Refactor intro animations into a separate SASS variable (#1147)

mmistakes · Aug 2, 2017 · 5b4baee · 5b4baee
1 parent 822fa4d
commit 5b4baee
Show file tree

Hide file tree

Showing 9 changed files with 25 additions and 24 deletions.
diff --git a/_sass/minimal-mistakes/_footer.scss b/_sass/minimal-mistakes/_footer.scss
@@ -14,8 +14,8 @@
   /* sticky footer fix end */
   margin-top: 3em;
   color: mix(#fff, $gray, 25%);
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.45s;
           animation-delay: 0.45s;
   background-color: $lighter-gray;

diff --git a/_sass/minimal-mistakes/_masthead.scss b/_sass/minimal-mistakes/_masthead.scss
@@ -5,8 +5,8 @@
 .masthead {
   position: relative;
   border-bottom: 1px solid $border-color;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.15s;
           animation-delay: 0.15s;
   z-index: 20;

diff --git a/_sass/minimal-mistakes/_navigation.scss b/_sass/minimal-mistakes/_navigation.scss
@@ -14,8 +14,8 @@
   padding-left: 2em;
   padding-right: 2em;
   font-family: $sans-serif;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.30s;
           animation-delay: 0.30s;
 

diff --git a/_sass/minimal-mistakes/_page.scss b/_sass/minimal-mistakes/_page.scss
@@ -8,8 +8,8 @@
   margin-top: 2em;
   padding-left: 1em;
   padding-right: 1em;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.35s;
           animation-delay: 0.35s;
 
@@ -113,8 +113,8 @@
   position: relative;
   margin-bottom: 2em;
   @include clearfix;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.25s;
           animation-delay: 0.25s;
 
@@ -126,8 +126,8 @@
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
-    -webkit-animation: intro 0.3s both;
-            animation: intro 0.3s both;
+    -webkit-animation: $intro-transition;
+            animation: $intro-transition;
     -webkit-animation-delay: 0.25s;
             animation-delay: 0.25s;
 

diff --git a/_sass/minimal-mistakes/_variables.scss b/_sass/minimal-mistakes/_variables.scss
@@ -127,3 +127,4 @@ $box-shadow                 : 0 1px 1px rgba(0, 0, 0, 0.125) !default;
 $navicon-width              : 1.5rem !default;
 $navicon-height             : 0.25rem !default;
 $global-transition          : all 0.2s ease-in-out !default;
+$intro-transition            : intro 0.3s both !default;
diff --git a/docs/_sass/minimal-mistakes/_footer.scss b/docs/_sass/minimal-mistakes/_footer.scss
@@ -14,8 +14,8 @@
   /* sticky footer fix end */
   margin-top: 3em;
   color: mix(#fff, $gray, 25%);
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.45s;
           animation-delay: 0.45s;
   background-color: $lighter-gray;

diff --git a/docs/_sass/minimal-mistakes/_masthead.scss b/docs/_sass/minimal-mistakes/_masthead.scss
@@ -5,8 +5,8 @@
 .masthead {
   position: relative;
   border-bottom: 1px solid $border-color;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.15s;
           animation-delay: 0.15s;
   z-index: 20;

diff --git a/docs/_sass/minimal-mistakes/_navigation.scss b/docs/_sass/minimal-mistakes/_navigation.scss
@@ -14,8 +14,8 @@
   padding-left: 2em;
   padding-right: 2em;
   font-family: $sans-serif;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.30s;
           animation-delay: 0.30s;
 

diff --git a/docs/_sass/minimal-mistakes/_page.scss b/docs/_sass/minimal-mistakes/_page.scss
@@ -8,8 +8,8 @@
   margin-top: 2em;
   padding-left: 1em;
   padding-right: 1em;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.35s;
           animation-delay: 0.35s;
 
@@ -113,8 +113,8 @@
   position: relative;
   margin-bottom: 2em;
   @include clearfix;
-  -webkit-animation: intro 0.3s both;
-          animation: intro 0.3s both;
+  -webkit-animation: $intro-transition;
+          animation: $intro-transition;
   -webkit-animation-delay: 0.25s;
           animation-delay: 0.25s;
 
@@ -126,8 +126,8 @@
     background-size: cover;
     background-repeat: no-repeat;
     background-position: center;
-    -webkit-animation: intro 0.3s both;
-            animation: intro 0.3s both;
+    -webkit-animation: $intro-transition;
+            animation: $intro-transition;
     -webkit-animation-delay: 0.25s;
             animation-delay: 0.25s;