feat: show animation

animate/style.css

@@ -1,13 +1,7 @@
 @keyframes colorRotate {
-  from {
+  from { opacity: 100%; }
-    opacity: 100%;
+  80%  { opacity: 100%; }
-  }
+  to   { opacity: 0; }
-  80% {
-    opacity: 100%;
-  }
-  to {
-    opacity: 0;
-  }
 }
 
 #path53926,
@@ -35,3 +29,49 @@
 #path53876 {
   animation-delay: 1.2s;
 }
+
+@keyframes toggleLight1 {
+  from { fill: #37c1ef; }
+  50%  { fill: #37c1ef; }
+  51%  { fill: #80e8f8; }
+  to   { fill: #80e8f8; }
+}
+
+@keyframes toggleLight2 {
+  from { fill: #36aed7; }
+  50%  { fill: #36aed7; }
+  51%  { fill: #70e0f0; }
+  to   { fill: #70e0f0; }
+}
+
+#path27272,
+#path34452 {
+  animation-duration: 2s;
+  animation-direction: alternate;
+  animation-iteration-count: infinite;
+}
+
+#path27272 {
+  animation-name: toggleLight1;
+}
+
+#path34452 {
+  animation-name: toggleLight2;
+}
+
+@keyframes lightSwitch {
+  from { transform: scaleY(1) translateY(0); }
+  40%  { transform: scaleY(1) translateY(0); }
+  41%  { transform: scaleY(1.4) translateY(-42px); }
+  50%  { transform: scaleY(1.4) translateY(-42px); }
+  51%  { transform: scaleY(1) translateY(0); }
+  to   { transform: scaleY(1) translateY(0); }
+}
+
+#rect36645,
+#path36960 {
+  animation-name: lightSwitch;
+  animation-duration: 2s;
+  animation-direction: alternate;
+  animation-iteration-count: infinite;
+}