Hue the Navbar with notification banner #17
32
Navbar color on Notif.css
Normal file
32
Navbar color on Notif.css
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
@-moz-document domain("supplierxm.salsify.com"),
|
||||||
|
domain("alkemics.com") {
|
||||||
|
:root {
|
||||||
|
--color1: hsla(194, 71%, 30%, 1);
|
||||||
|
/* --navbar-gradient-color: rgb(20, 157, 199); */
|
||||||
|
}
|
||||||
|
|
||||||
|
.PageTop>.Navbar::after {
|
||||||
|
background-color: var(--navbar-gradient-color);
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
height: 0%;
|
||||||
|
width: 100%;
|
||||||
|
z-index: -1;
|
||||||
|
transition: height .4s ease 0s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.PageTop>.Navbar--PPR:has(+ :is(.NotificationAnimation-enter-done, .NotificationAnimation-enter-active))::after {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.PageTop>.Navbar:has(+ .Notification--success) {
|
||||||
|
--navbar-gradient-color: #48b071;
|
||||||
|
}
|
||||||
|
|
||||||
|
.PageTop>.Navbar:has(+ .Notification--error) {
|
||||||
|
--navbar-gradient-color: #e64c42;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user