yummacss 2.1.0 → 3.0.0

package/src/abstracts/_mixins.scss

@@ -1,575 +0,0 @@
-@import "breakpoints";
-
-@mixin color-variants($property, $prefix, $k, $v) {
-  .#{$prefix}-#{$k} {
-    #{$property}: $v;
-  }
-
-  .h\:#{$prefix}-#{$k} {
-    &:hover {
-      #{$property}: $v;
-    }
-  }
-}
-
-@mixin shade-variants($property, $prefix, $k, $v, $mod) {
-  @for $i from 1 through 6 {
-    // light variants
-    .#{$prefix}-l-#{$k}-#{$i} {
-      #{$property}: mix(white, $v, $i * $mod);
-    }
-
-    .h\:#{$prefix}-l-#{$k}-#{$i} {
-      &:hover {
-        #{$property}: mix(white, $v, $i * $mod);
-      }
-    }
-
-    // dark variants
-    .#{$prefix}-d-#{$k}-#{$i} {
-      #{$property}: mix(black, $v, $i * $mod);
-    }
-
-    .h\:#{$prefix}-d-#{$k}-#{$i} {
-      &:hover {
-        #{$property}: mix(black, $v, $i * $mod);
-      }
-    }
-  }
-}
-
-@mixin variants($property, $prefix, $unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} {
-      #{$property}: $i * $unit;
-    }
-
-    // Hover variant
-    .h\:#{$prefix}-#{$i}:hover {
-      #{$property}: $i * $unit;
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} {
-        @include breakpoint($bp-value) {
-          #{$property}: $i * $unit;
-        }
-      }
-
-      // Responsive hover variant
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover {
-        @include breakpoint($bp-value) {
-          #{$property}: $i * $unit;
-        }
-      }
-    }
-  }
-}
-
-@mixin dimension-variants($prefix, $height-unit, $width-unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} {
-      height: $i * $height-unit;
-      width: $i * $width-unit;
-    }
-
-    // Hover variant
-    .h\:#{$prefix}-#{$i}:hover {
-      height: $i * $height-unit;
-      width: $i * $width-unit;
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} {
-        @include breakpoint($bp-value) {
-          height: $i * $height-unit;
-          width: $i * $width-unit;
-        }
-      }
-
-      // Responsive hover variant
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover {
-        @include breakpoint($bp-value) {
-          height: $i * $height-unit;
-          width: $i * $width-unit;
-        }
-      }
-    }
-  }
-}
-
-@mixin x-axis-variants($property, $prefix, $unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} {
-      #{$property}-left: $i * $unit;
-      #{$property}-right: $i * $unit;
-    }
-
-    // Hover variant
-    .h\:#{$prefix}-#{$i}:hover {
-      #{$property}-left: $i * $unit;
-      #{$property}-right: $i * $unit;
-    }
-
-    // Responsive variant
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} {
-        @include breakpoint($bp-value) {
-          #{$property}-left: $i * $unit;
-          #{$property}-right: $i * $unit;
-        }
-      }
-
-      // Responsive hover variant
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover {
-        @include breakpoint($bp-value) {
-          #{$property}-left: $i * $unit;
-          #{$property}-right: $i * $unit;
-        }
-      }
-    }
-  }
-}
-
-@mixin y-axis-variants($property, $prefix, $unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} {
-      #{$property}-top: $i * $unit;
-      #{$property}-bottom: $i * $unit;
-    }
-
-    // Hover variant
-    .h\:#{$prefix}-#{$i}:hover {
-      #{$property}-top: $i * $unit;
-      #{$property}-bottom: $i * $unit;
-    }
-
-    // Responsive hover variant
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} {
-        @include breakpoint($bp-value) {
-          #{$property}-top: $i * $unit;
-          #{$property}-bottom: $i * $unit;
-        }
-      }
-
-      // Responsive hover variant
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover {
-        @include breakpoint($bp-value) {
-          #{$property}-top: $i * $unit;
-          #{$property}-bottom: $i * $unit;
-        }
-      }
-    }
-  }
-}
-
-@mixin spacing-x($prefix, $unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} > :not([hidden]) ~ :not([hidden]) {
-      margin-left: calc(#{$i * $unit} * calc(1 - 0));
-      margin-right: calc(#{$i * $unit} * 0);
-    }
-
-    .h\:#{$prefix}-#{$i}:hover > :not([hidden]) ~ :not([hidden]) {
-      margin-left: calc(#{$i * $unit} * calc(1 - 0));
-      margin-right: calc(#{$i * $unit} * 0);
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} > :not([hidden]) ~ :not([hidden]) {
-        @include breakpoint($bp-value) {
-          margin-left: calc(#{$i * $unit} * calc(1 - 0));
-          margin-right: calc(#{$i * $unit} * 0);
-        }
-      }
-
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover > :not([hidden]) ~ :not([hidden]) {
-        @include breakpoint($bp-value) {
-          margin-left: calc(#{$i * $unit} * calc(1 - 0));
-          margin-right: calc(#{$i * $unit} * 0);
-        }
-      }
-    }
-  }
-}
-
-@mixin spacing-y($prefix, $unit) {
-  @for $i from 0 through 100 {
-    .#{$prefix}-#{$i} > :not([hidden]) ~ :not([hidden]) {
-      margin-top: calc(#{$i * $unit} * calc(1 - 0));
-      margin-bottom: calc(#{$i * $unit} * 0);
-    }
-
-    .h\:#{$prefix}-#{$i}:hover > :not([hidden]) ~ :not([hidden]) {
-      margin-top: calc(#{$i * $unit} * calc(1 - 0));
-      margin-bottom: calc(#{$i * $unit} * 0);
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:#{$prefix}-#{$i} > :not([hidden]) ~ :not([hidden]) {
-        @include breakpoint($bp-value) {
-          margin-top: calc(#{$i * $unit} * calc(1 - 0));
-          margin-bottom: calc(#{$i * $unit} * 0);
-        }
-      }
-
-      .h\:#{$bp}\:#{$prefix}-#{$i}:hover > :not([hidden]) ~ :not([hidden]) {
-        @include breakpoint($bp-value) {
-          margin-top: calc(#{$i * $unit} * calc(1 - 0));
-          margin-bottom: calc(#{$i * $unit} * 0);
-        }
-      }
-    }
-  }
-}
-
-// Utility extensions
-@mixin extensions($map, $prefixes) {
-  @each $k, $v in $map {
-    @each $prefix, $property in $prefixes {
-      .#{$prefix}-#{$k} {
-        #{$property}: $v;
-      }
-
-      // Hover variant
-      .h\:#{$prefix}-#{$k}:hover {
-        #{$property}: $v;
-      }
-
-      // Responsive hover variant
-      @each $bp, $bp-value in $yma-breakpoints {
-        .#{$bp}\:#{$prefix}-#{$k} {
-          @include breakpoint($bp-value) {
-            #{$property}: $v;
-          }
-        }
-
-        // Responsive hover variant
-        .h\:#{$bp}\:#{$prefix}-#{$k}:hover {
-          @include breakpoint($bp-value) {
-            #{$property}: $v;
-          }
-        }
-      }
-    }
-  }
-}
-
-@mixin dimension-extensions($map) {
-  @each $k, $v in $map {
-    .dim-#{$k} {
-      height: $v;
-      width: $v;
-    }
-
-    .h\:dim-#{$k}:hover {
-      height: $v;
-      width: $v;
-    }
-
-    .max-dim-#{$k} {
-      max-height: $v;
-      max-width: $v;
-    }
-
-    .h\:max-dim-#{$k}:hover {
-      max-height: $v;
-      max-width: $v;
-    }
-
-    .min-dim-#{$k} {
-      min-height: $v;
-      min-width: $v;
-    }
-
-    .h\:min-dim-#{$k}:hover {
-      min-height: $v;
-      min-width: $v;
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:dim-#{$k} {
-        @include breakpoint($bp-value) {
-          height: $v;
-          width: $v;
-        }
-      }
-
-      .h\:#{$bp}\:dim-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          height: $v;
-          width: $v;
-        }
-      }
-
-      .#{$bp}\:max-dim-#{$k} {
-        @include breakpoint($bp-value) {
-          max-height: $v;
-          max-width: $v;
-        }
-      }
-
-      .h\:#{$bp}\:max-dim-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          max-height: $v;
-          max-width: $v;
-        }
-      }
-
-      .#{$bp}\:min-dim-#{$k} {
-        @include breakpoint($bp-value) {
-          min-height: $v;
-          min-width: $v;
-        }
-      }
-
-      .h\:#{$bp}\:min-dim-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          min-height: $v;
-          min-width: $v;
-        }
-      }
-    }
-  }
-}
-
-@mixin box-model-extensions($map, $prefixes, $property) {
-  @each $k, $v in $map {
-    @if $k == "auto" {
-      @each $prefix in $prefixes {
-        .#{$prefix}-#{$k} {
-          #{$property}: $v;
-        }
-
-        .h\:#{$prefix}-#{$k}:hover {
-          #{$property}: $v;
-        }
-      }
-
-      .mx-#{$k} {
-        margin-left: $v;
-        margin-right: $v;
-      }
-
-      .h\:mx-#{$k}:hover {
-        margin-left: $v;
-        margin-right: $v;
-      }
-
-      .px-#{$k} {
-        padding-left: $v;
-        padding-right: $v;
-      }
-
-      .h\:px-#{$k}:hover {
-        padding-left: $v;
-        padding-right: $v;
-      }
-
-      .my-#{$k} {
-        margin-bottom: $v;
-        margin-top: $v;
-      }
-
-      .h\:my-#{$k}:hover {
-        margin-bottom: $v;
-        margin-top: $v;
-      }
-
-      .py-#{$k} {
-        padding-bottom: $v;
-        padding-top: $v;
-      }
-
-      .h\:py-#{$k}:hover {
-        padding-bottom: $v;
-        padding-top: $v;
-      }
-
-      @each $bp, $bp-value in $yma-breakpoints {
-        @each $prefix in $prefixes {
-          .#{$bp}\:#{$prefix}-#{$k} {
-            @include breakpoint($bp-value) {
-              #{$property}: $v;
-            }
-          }
-
-          .h\:#{$bp}\:#{$prefix}-#{$k}:hover {
-            @include breakpoint($bp-value) {
-              #{$property}: $v;
-            }
-          }
-        }
-
-        .#{$bp}\:mx-#{$k} {
-          @include breakpoint($bp-value) {
-            margin-left: $v;
-            margin-right: $v;
-          }
-        }
-
-        .h\:#{$bp}\:mx-#{$k}:hover {
-          @include breakpoint($bp-value) {
-            margin-left: $v;
-            margin-right: $v;
-          }
-        }
-
-        .#{$bp}\:px-#{$k} {
-          @include breakpoint($bp-value) {
-            padding-left: $v;
-            padding-right: $v;
-          }
-        }
-
-        .h\:#{$bp}\:px-#{$k}:hover {
-          @include breakpoint($bp-value) {
-            padding-left: $v;
-            padding-right: $v;
-          }
-        }
-
-        .#{$bp}\:my-#{$k} {
-          @include breakpoint($bp-value) {
-            margin-bottom: $v;
-            margin-top: $v;
-          }
-        }
-
-        .h\:#{$bp}\:my-#{$k}:hover {
-          @include breakpoint($bp-value) {
-            margin-bottom: $v;
-            margin-top: $v;
-          }
-        }
-
-        .#{$bp}\:py-#{$k} {
-          @include breakpoint($bp-value) {
-            padding-bottom: $v;
-            padding-top: $v;
-          }
-        }
-
-        .h\:#{$bp}\:py-#{$k}:hover {
-          @include breakpoint($bp-value) {
-            padding-bottom: $v;
-            padding-top: $v;
-          }
-        }
-      }
-    }
-  }
-}
-
-@mixin height-extensions($map) {
-  @each $k, $v in $map {
-    .h-#{$k} {
-      height: $v;
-    }
-    .h\:h-#{$k}:hover {
-      height: $v;
-    }
-    .max-h-#{$k} {
-      max-height: $v;
-    }
-    .h\:max-h-#{$k}:hover {
-      max-height: $v;
-    }
-    .min-h-#{$k} {
-      min-height: $v;
-    }
-    .h\:min-h-#{$k}:hover {
-      min-height: $v;
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:h-#{$k} {
-        @include breakpoint($bp-value) {
-          height: $v;
-        }
-      }
-      .h\:#{$bp}\:h-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          height: $v;
-        }
-      }
-      .#{$bp}\:max-h-#{$k} {
-        @include breakpoint($bp-value) {
-          max-height: $v;
-        }
-      }
-      .h\:#{$bp}\:max-h-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          max-height: $v;
-        }
-      }
-      .#{$bp}\:min-h-#{$k} {
-        @include breakpoint($bp-value) {
-          min-height: $v;
-        }
-      }
-      .h\:#{$bp}\:min-h-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          min-height: $v;
-        }
-      }
-    }
-  }
-}
-
-@mixin width-extensions($map) {
-  @each $k, $v in $map {
-    .w-#{$k} {
-      width: $v;
-    }
-    .h\:w-#{$k}:hover {
-      width: $v;
-    }
-    .max-w-#{$k} {
-      max-width: $v;
-    }
-    .h\:max-w-#{$k}:hover {
-      max-width: $v;
-    }
-    .min-w-#{$k} {
-      min-width: $v;
-    }
-    .h\:min-w-#{$k}:hover {
-      min-width: $v;
-    }
-
-    @each $bp, $bp-value in $yma-breakpoints {
-      .#{$bp}\:w-#{$k} {
-        @include breakpoint($bp-value) {
-          width: $v;
-        }
-      }
-      .h\:#{$bp}\:w-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          width: $v;
-        }
-      }
-      .#{$bp}\:max-w-#{$k} {
-        @include breakpoint($bp-value) {
-          max-width: $v;
-        }
-      }
-      .h\:#{$bp}\:max-w-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          max-width: $v;
-        }
-      }
-      .#{$bp}\:min-w-#{$k} {
-        @include breakpoint($bp-value) {
-          min-width: $v;
-        }
-      }
-      .h\:#{$bp}\:min-w-#{$k}:hover {
-        @include breakpoint($bp-value) {
-          min-width: $v;
-        }
-      }
-    }
-  }
-}

package/src/core.scss

@@ -1,3 +0,0 @@
-$base: false;
-
-@import "yumma.scss";