Hue the Navbar with notification banner #17

Merged
alk-spriet merged 3 commits from hue-navbar-on-notification into main 2023-05-25 23:39:19 +02:00
Showing only changes of commit a09f40b2d7 - Show all commits

32
Navbar color on Notif.css Normal file
View 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;
}
}