finally added all mixing for transform

pixu1980 · Mar 5, 2018 · cd9a721 · cd9a721
1 parent e497217
commit cd9a721
Show file tree

Hide file tree

Showing 13 changed files with 331 additions and 72 deletions.
diff --git a/scss/mixins/_animation.scss b/scss/mixins/_animation.scss
@@ -5,48 +5,48 @@
 ////
 /// @name animation-name-modes
 /// @access public
-$animation-name-modes: concat((none), $css-default-modes);
+$animation-name-modes: array-concat((none), $css-default-modes);
 
 /// Checks if animation name is string or css default (inherit, initial)
 /// @name is-animation-name
 /// @access public
 /// @return {Bool}
 @function is-animation-name($an) {
-  @return is-string($an) or contains($animation-name-modes, $an);
+  @return is-string($an) or array-contains($animation-name-modes, $an);
 }
 
 @function is-animation-time($at) {
   @return is-time($at) or is-css-default($at);
 }
 
-$animation-direction-modes: concat((normal, reverse, alternate, alternate-reverse), $css-default-modes);
+$animation-direction-modes: array-concat((normal, reverse, alternate, alternate-reverse), $css-default-modes);
 
 @function is-animation-direction($ad) {
-  @return contains($animation-direction-modes, $ad);
+  @return array-contains($animation-direction-modes, $ad);
 }
 
-$animation-iteration-count-modes: concat((infinite), $css-default-modes);
+$animation-iteration-count-modes: array-concat((infinite), $css-default-modes);
 
 @function is-animation-iteration-count($aic) {
-  @return is-integer($aic) or contains($animation-iteration-count-modes, $aic);
+  @return is-integer($aic) or array-contains($animation-iteration-count-modes, $aic);
 }
 
-$animation-fill-modes: concat((none, forwards, backwards, both), $css-default-modes);
+$animation-fill-modes: array-concat((none, forwards, backwards, both), $css-default-modes);
 
 @function is-animation-fill-mode($afm) {
-  @return contains($animation-fill-modes, $afm);
+  @return array-contains($animation-fill-modes, $afm);
 }
 
-$animation-timing-function-modes: concat((linear, ease, ease-in, ease-out, ease-in-out, step-start, step-end), $css-default-modes);
+$animation-timing-function-modes: array-concat((linear, ease, ease-in, ease-out, ease-in-out, step-start, step-end), $css-default-modes);
 
 @function is-animation-timing-function($atf) {
-  @return string-starts-with($atf, 'steps') or string-starts-with($atf, 'cubic-bezier') or contains($animation-timing-function-modes, $atf);
+  @return string-starts-with($atf, 'steps') or string-starts-with($atf, 'cubic-bezier') or array-contains($animation-timing-function-modes, $atf);
 }
 
-$animation-play-state-modes: concat((paused, running), $css-default-modes);
+$animation-play-state-modes: array-concat((paused, running), $css-default-modes);
 
 @function is-animation-play-state-modes($aps) {
-  @return contains($animation-play-state-modess, $aps);
+  @return array-contains($animation-play-state-modess, $aps);
 }
 
 // keyframe mixin e.g. usage

diff --git a/scss/mixins/_background.scss b/scss/mixins/_background.scss
@@ -1,28 +1,28 @@
-$background-image-modes: concat((none), $css-default-modes);
+$background-image-modes: array-concat((none), $css-default-modes);
 
 @function is-background-image($bi) {
-  @return is-url($bi) or contains($background-image-modes, $bi);
+  @return is-url($bi) or array-contains($background-image-modes, $bi);
 }
 
 $background-position-horizontal-modes: (left, center, right);
 $background-position-vertical-modes: (top, center, bottom);
-$background-position-modes: concat((left, center, right, top, bottom), $css-default-modes);
+$background-position-modes: array-concat((left, center, right, top, bottom), $css-default-modes);
 
 @function is-background-position($bp) {
   @if is-array($bp) {
     $h: if(length($bp) > 0, nth($bp, 1), null);
-    $h-valid: is-css-size($h) or contains($background-position-horizontal-modes, $h);
+    $h-valid: is-css-size($h) or array-contains($background-position-horizontal-modes, $h);
 
     $v: if(length($bp) > 1, nth($bp, 2), null);
-    $v-valid: is-css-size($v) or contains($background-position-vertical-modes, $v);
+    $v-valid: is-css-size($v) or array-contains($background-position-vertical-modes, $v);
 
     @return $h-valid and $v-valid;
   }
 
-  @return is-css-size($bp) or contains($background-position-modes, $bp);
+  @return is-css-size($bp) or array-contains($background-position-modes, $bp);
 }
 
-$background-size-modes: concat((auto, cover, contain), $css-default-modes);
+$background-size-modes: array-concat((auto, cover, contain), $css-default-modes);
 
 @function is-background-size($bs) {
   @if is-array($bs) {
@@ -34,25 +34,25 @@ $background-size-modes: concat((auto, cover, contain), $css-default-modes);
     }
   }
 
-  @return is-css-size($bs) or contains($background-size-modes, $bs);
+  @return is-css-size($bs) or array-contains($background-size-modes, $bs);
 }
 
-$background-repeat-modes: concat((repeat, repeat-x, repeat-y, no-repeat), $css-default-modes);
+$background-repeat-modes: array-concat((repeat, repeat-x, repeat-y, no-repeat), $css-default-modes);
 
 @function is-background-repeat($br) {
-  @return contains($background-repeat-modes, $br);
+  @return array-contains($background-repeat-modes, $br);
 }
 
-$background-origin-clip-modes: concat((border-box, padding-box, content-box), $css-default-modes);
+$background-origin-clip-modes: array-concat((border-box, padding-box, content-box), $css-default-modes);
 
 @function is-background-origin-clip($bc) {
-  @return contains($background-origin-clip-modes, $bc);
+  @return array-contains($background-origin-clip-modes, $bc);
 }
 
-$background-attachment-modes: concat((scroll, fixed, local), $css-default-modes);
+$background-attachment-modes: array-concat((scroll, fixed, local), $css-default-modes);
 
 @function is-background-attachment($ba) {
-  @return contains($background-attachment-modes, $ba);
+  @return array-contains($background-attachment-modes, $ba);
 }
 
 @mixin background($options, $shorthand: false) {

diff --git a/scss/mixins/_border.scss b/scss/mixins/_border.scss
@@ -1,17 +1,17 @@
-$border-styles: concat((none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset), $css-default-modes);
+$border-styles: array-concat((none, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset), $css-default-modes);
 
 @function is-border-style($bs) {
-  @return contains($border-styles, $bs);
+  @return array-contains($border-styles, $bs);
 }
 
 @mixin border-radius($br...) {
   @include prefixer(border-radius, $br);
 }
 
-$border-modes: concat((none), $css-default-modes);
+$border-modes: array-concat((none), $css-default-modes);
 
 @function is-border-mode($b) {
-  @return contains($border-modes, $b);
+  @return array-contains($border-modes, $b);
 }
 
 @mixin border($options, $shorthand: false) {

diff --git a/scss/mixins/_box.scss b/scss/mixins/_box.scss
@@ -1,7 +1,7 @@
-$display-modes: concat((none, inline, block, inline-block, flex, inline-flex, table, inline-table, table-caption, table-header-group, table-row-group, table-column-group, table-footer-group, table-row, table-column, table-cell, list-item, run-in), $css-default-modes);
+$display-modes: array-concat((none, inline, block, inline-block, flex, inline-flex, table, inline-table, table-caption, table-header-group, table-row-group, table-column-group, table-footer-group, table-row, table-column, table-cell, list-item, run-in), $css-default-modes);
 
 @function is-display-mode($dm) {
-  @return contains($display-modes, $dm);
+  @return array-contains($display-modes, $dm);
 }
 
 @mixin display($dm) {
@@ -13,10 +13,10 @@ $display-modes: concat((none, inline, block, inline-block, flex, inline-flex, ta
   }
 }
 
-$box-sizing-modes: concat((content-box, border-box), $css-default-modes);
+$box-sizing-modes: array-concat((content-box, border-box), $css-default-modes);
 
 @function is-box-sizing-mode($bs) {
-  @return contains($box-sizing-modes, $bs);
+  @return array-contains($box-sizing-modes, $bs);
 }
 
 @mixin box-sizing($bs) {
@@ -28,16 +28,16 @@ $box-sizing-modes: concat((content-box, border-box), $css-default-modes);
   }
 }
 
-$box-sizes: concat((auto), $css-default-modes);
+$box-sizes: array-concat((auto), $css-default-modes);
 
 @function is-box-size($s) {
-  @return is-size($s) or contains($box-sizes, $s);
+  @return is-size($s) or array-contains($box-sizes, $s);
 }
 
-$bound-box-sizes: concat((none), $css-default-modes);
+$bound-box-sizes: array-concat((none), $css-default-modes);
 
 @function is-bound-box-size($s) {
-  @return is-size($s) or contains($bound-box-sizes, $s);
+  @return is-size($s) or array-contains($bound-box-sizes, $s);
 }
 
 @mixin box-size($options, $height-fallback: true) {

diff --git a/scss/mixins/_text.scss b/scss/mixins/_text.scss
@@ -1,19 +1,19 @@
-$font-weight-modes: concat((normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900), $css-default-modes);
+$font-weight-modes: array-concat((normal, bold, bolder, lighter, 100, 200, 300, 400, 500, 600, 700, 800, 900), $css-default-modes);
 
 @function is-font-weight($fw) {
-  @return contains($font-weight-modes, $fw);
+  @return array-contains($font-weight-modes, $fw);
 }
 
-$font-modes: concat((medium, xx-small, x-small, small, large, x-large, xx-large, smaller, larger), $css-default-modes);
+$font-modes: array-concat((medium, xx-small, x-small, small, large, x-large, xx-large, smaller, larger), $css-default-modes);
 
 @function is-font-size($s) {
-  @return is-css-size($s) or contains($font-modes, $s);
+  @return is-css-size($s) or array-contains($font-modes, $s);
 }
 
-$line-height-modes: concat((normal), $css-default-modes);
+$line-height-modes: array-concat((normal), $css-default-modes);
 
 @function is-line-height($s) {
-  @return is-css-size($s) or contains($line-height-modes, $s);
+  @return is-css-size($s) or array-contains($line-height-modes, $s);
 }
 
 @mixin font($options) {
@@ -132,16 +132,16 @@ $line-height-modes: concat((normal), $css-default-modes);
   hyphens: auto;
 }
 
-$text-align-modes: concat((left, center, right, justify), $css-default-modes);
+$text-align-modes: array-concat((left, center, right, justify), $css-default-modes);
 
 @function is-text-align($ta) {
-  @return contains($text-align-modes, $ta);
+  @return array-contains($text-align-modes, $ta);
 }
 
-$vertical-align-modes: concat((baseline, sub, super, top, text-top, middle, bottom, text-bottom), $css-default-modes);
+$vertical-align-modes: array-concat((baseline, sub, super, top, text-top, middle, bottom, text-bottom), $css-default-modes);
 
 @function is-vertical-align($va) {
-  @return is-css-size($va) or contains($vertical-align-modes, $va);
+  @return is-css-size($va) or array-contains($vertical-align-modes, $va);
 }
 
 @mixin content-align($options) {