From 051e7945a817f1b78bf18d4473b65d5fdeab3493 Mon Sep 17 00:00:00 2001
From: Thomas Smith <49042513+tsmitty11@users.noreply.github.com>
Date: Mon, 26 Sep 2022 19:07:37 -0400
Subject: [PATCH] Consolidated css animations

---
 src/layouts/index.html            |  2 +-
 src/layouts/partials/head.html    |  2 +-
 src/static/css/animations.css     | 92 +++++++++++++++++++++++++++++++
 src/static/css/generative-art.css | 43 ---------------
 4 files changed, 94 insertions(+), 45 deletions(-)
 create mode 100644 src/static/css/animations.css

diff --git a/src/layouts/index.html b/src/layouts/index.html
index 1da637a..31e4b3d 100644
--- a/src/layouts/index.html
+++ b/src/layouts/index.html
@@ -56,7 +56,7 @@
       </div>
     </div>
   </div>
-  <div class="full-width-cta-container animated animatedFadeInUp fadeInUp">
+  <div class="full-width-cta-container">
    {{- partial "full-width-cta.html" . -}}
   </div>
   <div class="hero-bottom">
diff --git a/src/layouts/partials/head.html b/src/layouts/partials/head.html
index f0166d0..65245c8 100644
--- a/src/layouts/partials/head.html
+++ b/src/layouts/partials/head.html
@@ -55,7 +55,7 @@
     <link rel="stylesheet" href="/css/footer.css">
     <link rel="stylesheet" href="/css/package-grid.css">
     <link rel="stylesheet" href="/css/buttons.css">
-    <link rel="stylesheet" href="/css/text-flicker.css">
+    <link rel="stylesheet" href="/css/animations.css">
     <link
       rel="stylesheet"
       href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css"
diff --git a/src/static/css/animations.css b/src/static/css/animations.css
new file mode 100644
index 0000000..fa944b3
--- /dev/null
+++ b/src/static/css/animations.css
@@ -0,0 +1,92 @@
+/* Fade in and up animations - declared with the following classes: */
+
+@keyframes fadeInUp {
+    from {
+        transform: translate3d(0,40px,0)
+    }
+
+    to {
+        transform: translate3d(0,0,0);
+        opacity: 1
+    }
+}
+
+@-webkit-keyframes fadeInUp {
+    from {
+        transform: translate3d(0,40px,0)
+    }
+
+    to {
+        transform: translate3d(0,0,0);
+        opacity: 1
+    }
+}
+
+.animated {
+    animation-duration: 1s;
+    animation-delay: .5s;
+    animation-fill-mode: both;
+    -webkit-animation-duration: 1s;
+    -webkit-animation-fill-mode: both
+}
+
+.animatedFadeInUp {
+    opacity: 0
+}
+
+.fadeInUp {
+    opacity: 0;
+    animation-name: fadeInUp;
+    -webkit-animation-name: fadeInUp;
+}
+
+/* Text Flicker Animation */
+
+
+h1{
+  animation: text-flicker 3s linear;
+  transition: 0.2s ease-out;
+}
+
+@keyframes text-flicker {
+  0% {
+    opacity:.1;
+  }
+
+  2% {
+    opacity:1;
+  }
+  8% {
+    opacity:0.1;
+  }
+  9% {
+    opacity:1;
+  }
+  12% {
+    opacity:0.1;
+  }
+  20% {
+    opacity:1;
+  }
+  25% {
+    opacity:0.3;
+  }
+  30% {
+    opacity:1;
+  }
+
+  70% {
+    opacity:0.7;
+  }
+
+  72% {
+    opacity:0.2;
+  }
+
+  77% {
+    opacity:.9;
+  }
+  100% {
+    opacity:.9;
+  }
+}
diff --git a/src/static/css/generative-art.css b/src/static/css/generative-art.css
index b530b67..99d4585 100644
--- a/src/static/css/generative-art.css
+++ b/src/static/css/generative-art.css
@@ -1,46 +1,3 @@
-/* Animations */
-
-@keyframes fadeInUp {
-    from {
-        transform: translate3d(0,40px,0)
-    }
-
-    to {
-        transform: translate3d(0,0,0);
-        opacity: 1
-    }
-}
-
-@-webkit-keyframes fadeInUp {
-    from {
-        transform: translate3d(0,40px,0)
-    }
-
-    to {
-        transform: translate3d(0,0,0);
-        opacity: 1
-    }
-}
-
-.animated {
-    animation-duration: 1s;
-    animation-delay: .5s;
-    animation-fill-mode: both;
-    -webkit-animation-duration: 1s;
-    -webkit-animation-fill-mode: both
-}
-
-.animatedFadeInUp {
-    opacity: 0
-}
-
-.fadeInUp {
-    opacity: 0;
-    animation-name: fadeInUp;
-    -webkit-animation-name: fadeInUp;
-}
-
-
 @media only screen and (min-width: 1200px) {
 
   #gen-art-1{