Topic: Changing icon+font on Toastr-Alert?
<a class="text-info" onclick="toastr.info('Hi! I am info message.');"><i class="fa fa-android" aria-hidden="true"></i></a>
Best,
Marta
Hi i wanted to make a custom toast and had to do some minor changes to it to use 'blank' toast
By that i mean just a message without you forced to use the toast with info or success or danger icon
Firstly choose a type of toast eg the info toast , customise (overide) it in the css and ! important a few things
.toast-info{
background-color: #222222;
color:#FFFFFF;
background-image:none !important; /*Removes Pesky Default Toast Icon*/
padding: 15px 15px 15px 15px !important; /*Corrects Spacing for default icon*/
text-align:center;
}
toastr["info"]("<i class='fas fa-bell'></i><a href=''> You Have 6 New Notfications !</a>")
Would be nice if you guys have added in a default toast with no forced icons 'Blank' Toast
Marta Szymanska staff pro premium commented 7 years ago
Hi, thank you for the suggestion, we will take it into consideration. Best, Marta
Hi,
would you create a snippet showing the problem here: https://mdbootstrap.com/snippets/? I'll try to help you.
Best, Marta
Hi,
toastr.js is an external plugin in our package and for the nearest future, we don't plan to create other toasts than these which already exists. You still need to create a custom code if you want to modify our toasts. You can use code from here: https://mdbootstrap.com/snippets/jquery/piotr-glejzer/557298.
Best, Marta
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Pro
- Premium support: No
- Technology: General Bootstrap questions
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: No
- Provided link: No