Salsify/front-ui-tweaker
1
0
Fork 0
Code Issues 4 Pull Requests 3 Packages Projects Releases Wiki Activity

Updated LTG banner with a smooth purple strip

Browse Source
This commit is contained in:
Simon Priet 2021-11-18 14:39:41 +01:00
parent 991a6da6c2
commit d8b7a7bb8b
1 changed files with 25 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
LTG banner.css
View File

@ -1,16 +1,29 @@
@-moz-document domain("ltg-stream.alkemics.com"), domain("ltg-admin.alkemics.com") { @-moz-document domain("ltg-stream.alkemics.com"),
.Navbar.bg-inverse, domain("ltg-admin.alkemics.com") {
.Navbar { :root {
background-color: #6c3ac8 !important; --stripe-size: 100px;
color: white; --color1: #752cf9;
--color2: #6723e4;
--duration: 30s;
} }
.Navbar::before {
.Navbar .active { z-index: -10;
color:white !important; content: "";
font-weight: bold !important; position: absolute;
top: 0;
left: 0;
width: calc(100% + var(--stripe-size));
height: 100%;
background: repeating-linear-gradient(-45deg, var(--color2) 25%, var(--color2) 50%, var(--color1) 50%, var(--color1) 75%);
background-size: var(--stripe-size) var(--stripe-size);
animation: stripeTransform var(--duration) linear infinite;
}
@keyframes stripeTransform {
0% {
transform: translateX(0);
}
100% {
transform: translateX(calc(var(--stripe-size) * -1));
} }
.Navbar__menu>li.nav-item a.nav-link.active:after {
background: white;
} }
} }