Amend scss mixins

3 files changed, 58 insertions, 28 deletions

diff --git a/assets/sass/_ed.scss b/assets/sass/_ed.scss
index 4042af9..c227ad8 100644
--- a/assets/sass/_ed.scss
+++ b/assets/sass/_ed.scss
@@ -12,7 +12,7 @@
 */
 
 /*
-  To apply a different color scheme to the whole scroll down to the themes section instructions at
+  To apply a different color scheme to the whole scroll down to the themes section for instructions at
   the very bottom of this file
 */
 
@@ -50,8 +50,7 @@ html {
 body {
   color: $text-color;
   background-color: #fff;
-  -webkit-text-size-adjust: 100%;
-      -ms-text-size-adjust: 100%;
+  @include text-size-adjust(100%);
 }
 
 .content {
@@ -233,10 +232,7 @@ tbody tr:nth-child(odd) th {
   font-family: $main-font;
   font-size: 1.8rem;
   line-height: .777em;
-  margin-top: 2em;
-  margin-bottom: 0;
-  margin-right: 0;
-  margin-left: 0;
+  margin: 2em 0 0;
   text-align: center;
 }
 
@@ -290,8 +286,7 @@ tbody tr:nth-child(odd) th {
   font-size: .875rem;/* 15px*/
   color: rgba(255,255,255,.6);
   background-color: #202020;
-  -webkit-transition: all .3s ease-in-out;
-          transition: all .3s ease-in-out;
+  @include transition(all .3s ease-in-out);
 }
 
 @media (min-width: 30em) {
@@ -445,9 +440,7 @@ a.sidebar-nav-item:focus {
 #sidebar-checkbox:checked ~ .sidebar,
 #sidebar-checkbox:checked ~ .wrap,
 #sidebar-checkbox:checked ~ .sidebar-toggle {
-  -webkit-transform: translateX(14rem);
-      -ms-transform: translateX(14rem);
-          transform: translateX(14rem);
+  @include transform(translateX(14rem));
 }
 
 
@@ -470,9 +463,7 @@ a.sidebar-nav-item:focus {
 .layout-reverse #sidebar-checkbox:checked ~ .sidebar,
 .layout-reverse #sidebar-checkbox:checked ~ .wrap,
 .layout-reverse #sidebar-checkbox:checked ~ .sidebar-toggle {
-  -webkit-transform: translateX(-14rem);
-      -ms-transform: translateX(-14rem);
-          transform: translateX(-14rem);
+  @include transform(translateX(-14rem));
 }
 
 
@@ -483,9 +474,7 @@ a.sidebar-nav-item:focus {
 */
 
 .sidebar-overlay #sidebar-checkbox:checked ~ .wrap {
-  -webkit-transform: translateX(0);
-      -ms-transform: translateX(0);
-          transform: translateX(0);
+  @include transform(translateX(0));
 }
 
 .sidebar-overlay #sidebar-checkbox:checked ~ .sidebar-toggle {
@@ -642,7 +631,7 @@ a.footnote-ref {
   font-size: .66rem;
 }
 
-/*Bibliography styles */
+/* Bibliography styles */
 ol.bibliography {
   list-style-type:none;
   padding-left: 1rem;
diff --git a/assets/sass/_mixins.scss b/assets/sass/_mixins.scss
index 6261654..2c0ca95 100644
--- a/assets/sass/_mixins.scss
+++ b/assets/sass/_mixins.scss
@@ -40,6 +40,39 @@ $break-desktop: 1600px;
   }
 }
 
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  text-size-adjust
+// Controls the text inflation algorithm used on some smartphones and tablets.
+// Other browsers will ignore this property.
+//
+// Usage: @include text-size-adjust(none);
+
+@mixin text-size-adjust($value) {
+  -webkit-text-size-adjust: $value;
+     -moz-text-size-adjust: $value;
+      -ms-text-size-adjust: $value;
+          text-size-adjust: $value;
+}
+
+// - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  Transform
+// Usage: @include transform(
+//             rotate(90deg),
+//             scale(0.5),
+//             // ... add more transforms if you need
+//        );
+//
+
+@mixin transform($transforms...) {
+  // combine the passed transforms into a space separated list
+  $transform-list: join($transforms, null, space);
+
+  // print out the transforms
+  -webkit-transform: $transform-list;
+     -moz-transform: $transform-list;
+      -ms-transform: $transform-list;
+       -o-transform: $transform-list;
+          transform: $transform-list;
+}
+
 // - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -  Transitions
 // Usage: @include transition(color .3s ease);
 
diff --git a/resources/_gen/assets/scss/sass/style.scss_f300667da4f5b5f84e1a9e0702b2fdde.content b/resources/_gen/assets/scss/sass/style.scss_f300667da4f5b5f84e1a9e0702b2fdde.content
index afbe5d6..4b109c5 100644
--- a/resources/_gen/assets/scss/sass/style.scss_f300667da4f5b5f84e1a9e0702b2fdde.content
+++ b/resources/_gen/assets/scss/sass/style.scss_f300667da4f5b5f84e1a9e0702b2fdde.content
@@ -23,7 +23,7 @@
  * https://github.com/minicomp/ed.
 */
 /*
-  To apply a different color scheme to the whole scroll down to the themes section instructions at
+  To apply a different color scheme to the whole scroll down to the themes section for instructions at
   the very bottom of this file
 */
 /*
@@ -56,7 +56,9 @@ body {
   color: #454545;
   background-color: #fff;
   -webkit-text-size-adjust: 100%;
-  -ms-text-size-adjust: 100%; }
+  -moz-text-size-adjust: 100%;
+  -ms-text-size-adjust: 100%;
+  text-size-adjust: 100%; }
 
 .content {
   margin-bottom: 4rem; }
@@ -204,10 +206,7 @@ tbody tr:nth-child(odd) th {
   font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
   font-size: 1.8rem;
   line-height: .777em;
-  margin-top: 2em;
-  margin-bottom: 0;
-  margin-right: 0;
-  margin-left: 0;
+  margin: 2em 0 0;
   text-align: center; }
 
 .masthead-title small {
@@ -256,8 +255,11 @@ tbody tr:nth-child(odd) th {
   /* 15px*/
   color: rgba(255, 255, 255, 0.6);
   background-color: #202020;
-  -webkit-transition: all .3s ease-in-out;
-  transition: all .3s ease-in-out; }
+  -webkit-transition: all 0.3s ease-in-out;
+  -moz-transition: all 0.3s ease-in-out;
+  -ms-transition: all 0.3s ease-in-out;
+  -o-transition: all 0.3s ease-in-out;
+  transition: all 0.3s ease-in-out; }
 
 @media (min-width: 30em) {
   .sidebar {
@@ -384,7 +386,9 @@ a.sidebar-nav-item:focus {
 #sidebar-checkbox:checked ~ .wrap,
 #sidebar-checkbox:checked ~ .sidebar-toggle {
   -webkit-transform: translateX(14rem);
+  -moz-transform: translateX(14rem);
   -ms-transform: translateX(14rem);
+  -o-transform: translateX(14rem);
   transform: translateX(14rem); }
 
 /*
@@ -404,7 +408,9 @@ a.sidebar-nav-item:focus {
 .layout-reverse #sidebar-checkbox:checked ~ .wrap,
 .layout-reverse #sidebar-checkbox:checked ~ .sidebar-toggle {
   -webkit-transform: translateX(-14rem);
+  -moz-transform: translateX(-14rem);
   -ms-transform: translateX(-14rem);
+  -o-transform: translateX(-14rem);
   transform: translateX(-14rem); }
 
 /*
@@ -414,7 +420,9 @@ a.sidebar-nav-item:focus {
 */
 .sidebar-overlay #sidebar-checkbox:checked ~ .wrap {
   -webkit-transform: translateX(0);
+  -moz-transform: translateX(0);
   -ms-transform: translateX(0);
+  -o-transform: translateX(0);
   transform: translateX(0); }
 
 .sidebar-overlay #sidebar-checkbox:checked ~ .sidebar-toggle {
@@ -538,7 +546,7 @@ a.footnote-ref {
   padding-left: .1rem;
   font-size: .66rem; }
 
-/*Bibliography styles */
+/* Bibliography styles */
 ol.bibliography {
   list-style-type: none;
   padding-left: 1rem;