From 6ad8a7f8797da7299523b50741b4315a3c2709f7 Mon Sep 17 00:00:00 2001 From: justcool393 Date: Thu, 15 Dec 2022 17:16:43 -0600 Subject: [PATCH] fistmas 2022: lights: add --- files/events/assets/css/blizzard.css | 41 ++++++++++++++++------------ 1 file changed, 23 insertions(+), 18 deletions(-) diff --git a/files/events/assets/css/blizzard.css b/files/events/assets/css/blizzard.css index 4226e06d6..e23b3aa2b 100644 --- a/files/events/assets/css/blizzard.css +++ b/files/events/assets/css/blizzard.css @@ -256,25 +256,30 @@ textarea, input[type=textbox], input[type=search] { cursor: url(/assets/images/event/pointer.png), auto !important; } -.navbar:after { - content: ""; - background-image: url('/assets/images/event/lights.png'); - position: fixed; - top: 60px; - left: 0; - width: 100%; - height: 74px; - /* Prevents clicks, to simulate an "overlay", see @nekobit's CSS */ - pointer-events: none; - background-repeat: repeat-x; - background-size: 220px 70px; -} +/* lights */ -@media (max-width: 767.98px) { - .navbar:after { - top: 40px; - } -} +.navbar::after, .lights::after { + content: ""; + position: absolute; + top: 0; + left: 0; + height: 57px; + width: 100%; + background: url(https://i.imgur.com/Lhfdgx5.png); + animation: lights 1s infinite steps(2); + pointer-events: none; + } + + @keyframes lights { + 0% { + /*Two zeros, not one !!*/ + /*[0] is equivalent to [0 50%] and will create a different animation */ + background-position: 0 0; + } + 100% { + background-position: 0 -138px; + } + } /* snowcaps */