chore(docs): update theme preview (#160)

assets/css/_page/_home.scss

@@ -5,6 +5,10 @@
   .home {
     @if $profile {
       .home-profile {
+        -webkit-transform: translateY(if($posts, 0, 16vh));
+        -moz-transform: translateY(if($posts, 0, 16vh));
+        -ms-transform: translateY(if($posts, 0, 16vh));
+        -o-transform: translateY(if($posts, 0, 16vh));
         transform: translateY(if($posts, 0, 16vh));
         padding: if($posts, 2rem, 0) 0;
         text-align: center;

assets/css/_partial/_archive/_tags.scss

@@ -6,14 +6,19 @@
     position: relative;
     margin: 5px 10px;
     overflow-wrap: break-word;
-    transition-duration: .3s;
-    transition-property: transform;
-    transition-timing-function: ease-out;
+    -webkit-transition: all ease-out .3s;
+    -moz-transition: all ease-out .3s;
+    -o-transition: all ease-out .3s;
+    transition: all ease-out .3s;
 
     &:active,
     &:focus,
     &:hover {
       color: $global-link-hover-color;
+      -webkit-transform: scale(1.2);
+      -moz-transform: scale(1.2);
+      -ms-transform: scale(1.2);
+      -o-transform: scale(1.2);
       transform: scale(1.2);
 
       .dark-theme & {

assets/css/_partial/_header.scss

@@ -30,6 +30,10 @@ header {
   }
 
   .theme-switch i {
+    -webkit-transform: rotate(225deg);
+    -moz-transform: rotate(225deg);
+    -ms-transform: rotate(225deg);
+    -o-transform: rotate(225deg);
     transform: rotate(225deg);
   }
 }
@@ -103,6 +107,7 @@ header {
           border-radius: 3px;
           -webkit-transition: .1s margin .1s, .1s transform;
           -moz-transition: .1s margin .1s, .1s transform;
+          -o-transition: .1s margin .1s, .1s transform;
           transition: .1s margin .1s, .1s transform;
 
           .dark-theme & {
@@ -122,13 +127,15 @@ header {
           span {
             -webkit-transition: .1s margin, .1s transform .1s;
             -moz-transition: .1s margin, .1s transform .1s;
+            -o-transition: .1s margin, .1s transform .1s;
             transition: .1s margin, .1s transform .1s;
           }
 
           span:nth-child(1) {
+            -webkit-transform: rotate(45deg) translate(.4rem, .5rem);
             -moz-transform: rotate(45deg) translate(.4rem, .5rem);
             -ms-transform: rotate(45deg) translate(.4rem, .5rem);
-            -webkit-transform: rotate(45deg) translate(.4rem, .5rem);
+            -o-transform: rotate(45deg) translate(.4rem, .5rem);
             transform: rotate(45deg) translate(.4rem, .5rem);
           }
 
@@ -140,6 +147,7 @@ header {
             -moz-transform: rotate(-45deg) translate(.4rem, -.5rem);
             -ms-transform: rotate(-45deg) translate(.4rem, -.5rem);
             -webkit-transform: rotate(-45deg) translate(.4rem, -.5rem);
+            -o-transform: rotate(-45deg) translate(.4rem, -.5rem);
             transform: rotate(-45deg) translate(.4rem, -.5rem);
           }
         }

assets/css/_partial/_single/_footer.scss

@@ -88,10 +88,10 @@
     & a.next {
       font-size: 1rem;
       font-weight: 600;
-
-      transition-duration: .3s;
-      transition-property: transform;
-      transition-timing-function: ease-out;
+      -webkit-transition: all ease-out .3s;
+      -moz-transition: all ease-out .3s;
+      -o-transition: all ease-out .3s;
+      transition: all ease-out .3s;
     }
 
     & a.prev {
@@ -99,6 +99,10 @@
     }
 
     & a.prev:hover {
+      -webkit-transform: translateX(-4px);
+      -moz-transform: translateX(-4px);
+      -ms-transform: translateX(-4px);
+      -o-transform: translateX(-4px);
       transform: translateX(-4px);
     }
 
@@ -107,6 +111,10 @@
     }
 
     & a.next:hover {
+      -webkit-transform: translateX(4px);
+      -moz-transform: translateX(4px);
+      -ms-transform: translateX(4px);
+      -o-transform: translateX(4px);
       transform: translateX(4px);
     }
   }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "loveit-src",
-  "version": "0.1.2",
+  "version": "0.1.4",
   "description": "LoveIt theme source file",
   "main": "index.js",
   "dependencies": {},