test globe rotation

asdf-format · Nov 25, 2024 · 0017d71 · 0017d71
1 parent 93c2a37
commit 0017d71
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 4 deletions.
diff --git a/asdf_website/_static/css/custom.css b/asdf_website/_static/css/custom.css
@@ -138,6 +138,7 @@ a:hover {
 
 .splash-container {
   z-index: 3;
+  margin-top: 15%;
   overflow: visible;
 }
 
@@ -147,6 +148,7 @@ a:hover {
 .splash-image {
   max-width: 25%;
   min-width: 25em;
+  top: 25%;
   z-index: 3;
   justify-content: center;
   text-align: center;
@@ -185,10 +187,10 @@ a:hover {
 
 .star-animation:before {
   background-size: 100% auto;
-  -webkit-animation: rotate 30s infinite linear;
-  -moz-animation: rotate 30s infinite linear;
-  -o-animation: rotate 30s infinite linear;
-  animation: rotate 30s infinite linear;
+  -webkit-animation: rotate 80s infinite linear;
+  -moz-animation: rotate 80s infinite linear;
+  -o-animation: rotate 80s infinite linear;
+  animation: rotate 80s infinite linear;
 }
 
 .star-animation:after {
@@ -225,4 +227,47 @@ a:hover {
   color: #fff;
   background-color: #f14d2d;
   border-color: #11c192;
+}
+
+/* Star Animation
+-------------------------------------------------- */
+
+@-webkit-keyframes rotate {
+  0% {
+    transform: rotate(0);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@-moz-keyframes rotate {
+  0% {
+    transform: rotate(0);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@-o-keyframes rotate {
+  0% {
+    transform: rotate(0);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes rotate {
+  0% {
+    transform: rotate(0);
+  }
+
+  100% {
+    transform: rotate(360deg);
+  }
 }
diff --git a/asdf_website/_templates/index.html b/asdf_website/_templates/index.html
@@ -20,6 +20,10 @@
             background-image: url("{{pathto('_static/images/stars.svg', 1)}}");
             z-index: 1;
         }
+        .star-animation:after {
+            background-image: url("{{pathto('_static/images/stars.svg', 1)}}");
+            z-index: 1;
+        }
         .splash-sky {
             background-image: url(" {{ pathto('_static/images/night-sky.svg', 1) }}");
             z-index: 1;