diff --git a/PRD banner.css b/PRD banner.css index 662479c..ac145ed 100644 --- a/PRD banner.css +++ b/PRD banner.css @@ -1,17 +1,28 @@ @-moz-document domain("stream.alkemics.com") { - .Navbar { - animation-duration: 3s; - animation-name: slidein; - animation-iteration-count: infinite; - animation-direction: alternate; + :root { + --stripe-size: 100px; + --color1: #005564; + --color2: rgb(0, 0, 0); + --duration: 10s; } - @keyframes slidein { - from { - background-color: black; + .Navbar::before { + z-index: -10; + content: ""; + position: absolute; + top: 0; + left: calc(-1 * var(--stripe-size)); + 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); } - - to { - background-color: rgb(30, 180, 155); + 100% { + transform: translateX(calc(var(--stripe-size) * 1)); } } } \ No newline at end of file