If you show a notification in the material design, the style makes no difference to the look of the notification. They all look the same as if you put no style there at all.
EDIT: Didn’t realise you were referring to the style
kwarg in the Notification constructor. They are not currently applied in the Material Design theme, I’ll move this to Bug Reports (and modify the theme accordingly.)
For posterity:
Notifications are styled independently from other components. The rules are in theme.css
where it says:
/* Notifications */
For example, I changed the colour of the message to the Primary colour by doing:
body>div[data-notify="container"]>span[data-notify="message"] {
display: block;
padding: 20px 0 0;
font-size: 16px;
/* color: #747474; */
color: %color:Primary 500%;
}
This gives me:
https://anvil.works/build#clone:YNAPW2LV4PSGXNY7=B2UEAFLDGZW3BANS7TSLQCLM
Yes I was
Cheers.
We’ve updated the Material Design CSS to style notifications like the images below. We’ll deploy tomorrow morning, and from then on new Material Design apps will have these styles.
Success
Warning
Danger
Info
Existing apps
As always with style changes, you’ll have to add the rules manually to the theme.css
of existing apps, because auto-merging style updates with files you may have modified would cause all kinds of pain. So please add these rules to any relevant existing apps:
body>div[data-notify="container"].alert-success{
background-color: #d4edda;
}
body>div[data-notify="container"].alert-success>span[data-notify="title"]{
color: #155724;
}
body>div[data-notify="container"].alert-danger{
background-color: #f8d7da;
}
body>div[data-notify="container"].alert-danger>span[data-notify="title"]{
color: #721c24;
}
body>div[data-notify="container"].alert-warning{
background-color: #fff3cd;
}
body>div[data-notify="container"].alert-warning>span[data-notify="title"]{
color: #856404;
}
We’ve deployed now, so new apps will have the styled notifications.