Added animation to mars theme

Author: Exauthor

src/assets/style/index.styl

@@ -9,10 +9,12 @@ section
   & h2
     margin 0px
 
+:root
+  font-size 16px
+
 html 
   font-family 'Source Sans Pro', -apple-system, BlinkMacSystemFont, 'Segoe UI',
     Roboto, 'Helvetica Neue', Arial, sans-serif;
-  font-size 16px
   height 100vh
   overflow-y hidden
   word-spacing 1px

src/components/themes/mars.vue

@@ -40,24 +40,36 @@
     .blick
       background linear-gradient(to top, rgba(201, 41, 57, .8) 0%, transparent 70%)
       border-radius 50%
+      animation resize 8s infinite alternate
       &:nth-child(1)
         width 150%
         height 150%
       &:nth-child(2)
         width 230%
         height 230%
+        animation-delay .2s
       &:nth-child(3)
         width 330%
         height 330%
+        animation-delay .4s
       &:nth-child(4)
         width 470%
         height 470%
+        animation-delay .6s
       &:nth-child(5)
         width 670%
         height 670%
+        animation-delay .8s
       &:nth-child(6)
         width 900%
         height 900%
+        animation-delay 1s
+
+@keyframes resize
+  from 
+    transform translate(-50%, -50%) scale(1)
+  to 
+    transform translate(-50%, -50%) scale(.8)
 
 .mountain-back
   width 100vw

src/store/index.js

@@ -56,7 +56,7 @@ export default new Vuex.Store({
         component: 'timeComponent',
         fullscreen: false,
         color: {
-          active: '#04ded4',
+          active: '#91e60a',
           background: '#13111c'
         },
       },

version

@@ -1 +1 @@
-1.0.2
+1.0.3