adds position argument to debug mixin (#50)

ianrose · Oct 10, 2020 · bbc8e9c · bbc8e9c
1 parent c794810
commit bbc8e9c
Show file tree

Hide file tree

Showing 8 changed files with 12 additions and 12 deletions.
diff --git a/_typesettings.bundle.scss b/_typesettings.bundle.scss
@@ -167,13 +167,13 @@ $not-integer-txt: ' value breaks vertical rhythm. Use an integer (whole number)
 
 // Creates base type baseline overlay and vertical unit overlay.
 // To use on the body tag for example: body { @include debug-vertical-alignment(); } and add class va-debug to the body tag
-@mixin debug-vertical-alignment($opacity: 0.8, $vertical-unit: $base-vertical-unit, $type-base-line-multi: $base-line-multi, $type-size: $base-em-font-size) {
+@mixin debug-vertical-alignment($position: 'absolute', $opacity: 0.8, $vertical-unit: $base-vertical-unit, $type-base-line-multi: $base-line-multi, $type-size: $base-em-font-size) {
   position: relative;
 
   &::before,
   &::after {
     content: "";
-    position: absolute;
+    position: #{$position};
     top: 0;
     left: 0;
     bottom: 0;

diff --git a/_typesettings.bundle.styl b/_typesettings.bundle.styl
@@ -159,13 +159,13 @@ rhythmBorder($border-width= 1px, $lines= $base-line-multi, $font-size= $base-em-
 
 // Creates base type baseline overlay and vertical unit overlay.
 // To use on the body tag for example: body { debug-vertical-alignment(); } and add class va-debug to the body tag
-debug-vertical-alignment($opacity= 0.8, $vertical-unit= $base-vertical-unit, $type-base-line-multi= $base-line-multi, $type-size= $base-em-font-size)
+debug-vertical-alignment($position= absolute,$opacity= 0.8, $vertical-unit= $base-vertical-unit, $type-base-line-multi= $base-line-multi, $type-size= $base-em-font-size)
   position: relative;
 
   &::before,
   &::after {
     content: "";
-    position: absolute;
+    position: $position;
     top: 0;
     left: 0;
     bottom: 0;

diff --git a/test/scss/styles.css.map b/test/scss/styles.css.map
diff --git a/test/scss/styles.scss b/test/scss/styles.scss
@@ -14,7 +14,7 @@ $load-typesetted: true;
 @import "../../typesettings";
 
 body {
-  // @include debug-vertical-alignment();
+  @include debug-vertical-alignment('fixed', 0.3);
 }
 
 .div {

diff --git a/test/styl/styles.css.map b/test/styl/styles.css.map
diff --git a/test/styl/styles.styl b/test/styl/styles.styl
@@ -14,7 +14,7 @@ $load-typesetted= true;
 @import "../../_typesettings.styl";
 
 body {
-  // debug-vertical-alignment()
+  debug-vertical-alignment(fixed, 0.3)
 }
 
 .div {

diff --git a/typesettings/_mixins.scss b/typesettings/_mixins.scss
@@ -39,13 +39,13 @@
 
 // Creates base type baseline overlay and vertical unit overlay.
 // To use on the body tag for example: body { @include debug-vertical-alignment(); } and add class va-debug to the body tag
-@mixin debug-vertical-alignment($opacity: 0.8, $vertical-unit: $base-vertical-unit, $type-base-line-multi: $base-line-multi, $type-size: $base-em-font-size) {
+@mixin debug-vertical-alignment($position: 'absolute', $opacity: 0.8, $vertical-unit: $base-vertical-unit, $type-base-line-multi: $base-line-multi, $type-size: $base-em-font-size) {
   position: relative;
 
   &::before,
   &::after {
     content: "";
-    position: absolute;
+    position: #{$position};
     top: 0;
     left: 0;
     bottom: 0;

diff --git a/typesettings/_mixins.styl b/typesettings/_mixins.styl
@@ -34,13 +34,13 @@ rhythmBorder($border-width= 1px, $lines= $base-line-multi, $font-size= $base-em-
 
 // Creates base type baseline overlay and vertical unit overlay.
 // To use on the body tag for example: body { debug-vertical-alignment(); } and add class va-debug to the body tag
-debug-vertical-alignment($opacity= 0.8, $vertical-unit= $base-vertical-unit, $type-base-line-multi= $base-line-multi, $type-size= $base-em-font-size)
+debug-vertical-alignment($position= absolute,$opacity= 0.8, $vertical-unit= $base-vertical-unit, $type-base-line-multi= $base-line-multi, $type-size= $base-em-font-size)
   position: relative;
 
   &::before,
   &::after {
     content: "";
-    position: absolute;
+    position: $position;
     top: 0;
     left: 0;
     bottom: 0;
-Original file line number
+Diff line change
@@ Expand Up / @@ -14,7 +14,7 @@ $load-typesetted: true; @@
     @import "../../typesettings";
     body {
-      // @include debug-vertical-alignment();
+      @include debug-vertical-alignment('fixed', 0.3);
     }
     .div {
@@ Expand Down @@