I have customized toastr success and error messages in my application by changing the background and font colors. Now, I want to update the colors of the icons displayed in these messages. Despite my thorough search, I have been unable to find a way to modify the fill color of the icons or replace the icons altogether. Below is a screenshot of the success message: https://i.sstatic.net/ct317.png
Here is the screenshot for the error message:
https://i.sstatic.net/CUVZF.png
I aim to alter the icons within these messages or adjust the filling color of the icons. The JavaScript code snippet is as follows:
.success(function(data) {
toastr.success('Successfully Build ', 'Congratulations!', {
closeButton: true
});
}).error(function(err) {
toastr.error('Cant Build', 'Error', {
closeButton: true
});
In the CSS file:
#toast-container > .toast-success {
background-image: none;
background-color: #e9e9e9;
color: black;
}
#toast-container > .toast-error {
background-image: none;
background-color: #e9e9e9;
color: red;
}