flicker banner h1

kuco23 · Jul 27, 2024 · 492dbdf · 492dbdf
1 parent 3fdfe26
commit 492dbdf
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 6 deletions.
diff --git a/packages/frontend/src/css/config.scss b/packages/frontend/src/css/config.scss
@@ -7,9 +7,12 @@ $h2-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
 $h3-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
 $h4-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
 
+/* banner */
+$banner-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
+$banner-h1-animation-flicker-speed: 5s;
+
 /* Namari style */
 $section-title-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
-$banner-font-family: 'Montserrat Alternates', sans-serif, Arial, Helvetica;
 $header-hover-color: FireBrick;
 
 /* popup */

diff --git a/packages/frontend/src/css/kucocoin-animations.scss b/packages/frontend/src/css/kucocoin-animations.scss
@@ -0,0 +1,4 @@
+@keyframes flicker-text {
+  90%, 92%, 94%, 96%, 98% {opacity: 0.4;}
+  89%, 91%, 93%, 95%, 97%, 99% {opacity: 1;}
+}
diff --git a/packages/frontend/src/css/kucocoin-style.scss b/packages/frontend/src/css/kucocoin-style.scss
@@ -1,4 +1,5 @@
 @import "./config.scss";
+@import "./kucocoin-animations.scss";
 
 /* popup */
 
@@ -303,11 +304,6 @@ blockquote.ancient:after {
   }
 }
 
-@keyframes flicker-text {
-  90%, 92%, 94%, 96%, 98% {opacity: 0.4;}
-  89%, 91%, 93%, 95%, 97%, 99% {opacity: 1;}
-}
-
 /* underline on scrolling */
 
 .underline {

diff --git a/packages/frontend/src/css/namari-color.scss b/packages/frontend/src/css/namari-color.scss
@@ -14,6 +14,7 @@
 /*------------------------------------------------------------------------------------------*/
 
 @import "./config.scss";
+@import "./kucocoin-animations.scss";
 
 /* Default Link Color */
 
@@ -161,6 +162,7 @@ body {
     font-weight:800;
     color: FireBrick;
     text-shadow: black 0px 0px 8px, red 0 0 18px;
+    animation: flicker-text $banner-h1-animation-flicker-speed infinite linear;
 }
 
 #banner h2 {