uswds-jekyll 4.1.0 → 5.3.0

data/_sass/uswds/src/core/mixins/utilities/_font.scss

@@ -0,0 +1,42 @@
+/*
+----------------------------------------
+family()
+----------------------------------------
+Get a font-family stack
+----------------------------------------
+*/
+
+@mixin u-font-family($family) {
+  font-family: ff($family);
+}
+
+/*
+----------------------------------------
+size()
+----------------------------------------
+Get a normalized font-size in rem from
+a family and a type size in either
+system scale or project scale
+----------------------------------------
+*/
+
+@mixin u-font-size($family, $scale) {
+  font-size: font-size($family, $scale);
+}
+
+/*
+----------------------------------------
+font()
+----------------------------------------
+Get a font-family stack
+AND
+Get a normalized font-size in rem from
+a family and a type size in either
+system scale or project scale
+----------------------------------------
+*/
+
+@mixin u-font($family, $scale) {
+  font-family: ff($family);
+  font-size: font-size($family, $scale);
+}

data/_sass/uswds/src/core/mixins/utilities/_height.scss

@@ -0,0 +1,11 @@
+// Outputs height
+
+@mixin u-height($value...) {
+  $value: unpack($value);
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  height: get-uswds-value(height, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_justify-content.scss

@@ -0,0 +1,10 @@
+// Outputs justify-content
+
+@mixin u-justify-content($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  justify-content: get-uswds-value(justify-content, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_left.scss

@@ -0,0 +1,10 @@
+// Outputs right
+
+@mixin u-left($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  left: get-uswds-value(left, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_line-height.scss

@@ -0,0 +1,13 @@
+// Outputs line-height
+
+@mixin u-line-height($value...) {
+  $value: unpack($value);
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  $family: nth($value, 1);
+  $scale: nth($value, 2);
+  line-height: lh($family, $scale) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_margin.scss

@@ -0,0 +1,85 @@
+// Adds margin either l/r(x) or t/b(y)
+
+@mixin margin-n($side, $value...) {
+  $value: unpack($value);
+  @if $side == all {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin: get-uswds-value(margin, $value...) #{$important};
+  } @else if $side == x {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-left: get-uswds-value(margin-horizontal, $value...) #{$important};
+    margin-right: get-uswds-value(margin-horizontal, $value...) #{$important};
+  } @else if $side == y {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-bottom: get-uswds-value(margin-vertical, $value...) #{$important};
+    margin-top: get-uswds-value(margin-vertical, $value...) #{$important};
+  } @else if $side == t {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-top: get-uswds-value(margin-vertical, $value...) #{$important};
+  } @else if $side == r {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-right: get-uswds-value(margin-horizontal, $value...) #{$important};
+  } @else if $side == b {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-bottom: get-uswds-value(margin-vertical, $value...) #{$important};
+  } @else if $side == l {
+    $important: null;
+    @if has-important($value) {
+      $value: remove($value, "!important");
+      $important: " !important";
+    }
+    margin-left: get-uswds-value(margin-horizontal, $value...) #{$important};
+  }
+}
+
+@mixin u-margin($value...) {
+  @include margin-n(all, $value...);
+}
+
+@mixin u-margin-x($value...) {
+  @include margin-n(x, $value...);
+}
+
+@mixin u-margin-y($value...) {
+  @include margin-n(y, $value...);
+}
+
+@mixin u-margin-top($value...) {
+  @include margin-n(t, $value...);
+}
+
+@mixin u-margin-right($value...) {
+  @include margin-n(r, $value...);
+}
+
+@mixin u-margin-bottom($value...) {
+  @include margin-n(b, $value...);
+}
+
+@mixin u-margin-left($value...) {
+  @include margin-n(l, $value...);
+}

data/_sass/uswds/src/core/mixins/utilities/_max-height.scss

@@ -0,0 +1,10 @@
+// Outputs max-height
+
+@mixin u-maxh($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  max-height: get-uswds-value(max-height, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_max-width.scss

@@ -0,0 +1,10 @@
+// Outputs max-width
+
+@mixin u-maxw($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  max-width: get-uswds-value(max-width, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_measure.scss

@@ -0,0 +1,10 @@
+// Outputs measure max-width
+
+@mixin u-measure($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  max-width: get-uswds-value(measure, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_min-height.scss

@@ -0,0 +1,10 @@
+// Outputs min-height
+
+@mixin u-minh($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  min-height: get-uswds-value(min-height, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_min-width.scss

@@ -0,0 +1,10 @@
+// Outputs min-width
+
+@mixin u-minw($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  min-width: get-uswds-value(min-width, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_order.scss

@@ -0,0 +1,10 @@
+// Outputs order
+
+@mixin u-order($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  order: get-uswds-value(order, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_outline-color.scss

@@ -0,0 +1,10 @@
+// Outputs line-height
+
+@mixin u-outline-color($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  outline-color: color($value) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_outline.scss

@@ -0,0 +1,35 @@
+// Outputs a solid outline of $value... width
+@mixin u-outline($value...) {
+  $important: null;
+  $widths: map-deep-get($system-properties, outline, standard);
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  @each $this-value in $value {
+    $this-value: smart-quote($this-value);
+    $match: false;
+    @if map-has-key($all-color-shortcodes, $this-value) {
+      $match: true;
+      outline-color: color(smart-quote($this-value)) #{$important};
+    } @else if map-has-key($widths, $this-value) {
+      $match: true;
+      $final-value: map-get($widths, $this-value);
+      outline-width: unquote("#{$final-value}#{$important}");
+      outline-style: solid#{$important};
+    } @else if type-of($this-value) == "number" {
+      $converted-value: number-to-token($this-value);
+      @if map-has-key($widths, $converted-value) {
+        $match: true;
+        $final-value: map-get($widths, $converted-value);
+        outline-width: unquote("#{$final-value}#{$important}");
+        outline-style: solid#{$important};
+      } @else {
+        @error '#{$this-value} is not a valid outline width. Accepted values: #{map-keys($widths)}';
+      }
+    }
+    @if not $match {
+      @error '`#{$this-value}` is not a valid outline value.';
+    }
+  }
+}

data/_sass/uswds/src/core/mixins/utilities/_overflow.scss

@@ -0,0 +1,28 @@
+// Outputs overflow
+
+@mixin u-overflow($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  overflow: get-uswds-value(overflow, $value...) #{$important};
+}
+
+@mixin u-overflow-x($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  overflow-x: get-uswds-value(overflow, $value...) #{$important};
+}
+
+@mixin u-overflow-y($value...) {
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  overflow-y: get-uswds-value(overflow, $value...) #{$important};
+}

data/_sass/uswds/src/core/mixins/utilities/_padding.scss

@@ -0,0 +1,49 @@
+// Adds padding either l/r(x) or t/b(y)
+
+@mixin padding-n($side, $value...) {
+  $value: unpack($value);
+  $important: null;
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+  @if $side == all {
+    padding: get-uswds-value(padding, $value...) #{$important};
+  } @else if $side == x {
+    padding-left: get-uswds-value(padding, $value...) #{$important};
+    padding-right: get-uswds-value(padding, $value...) #{$important};
+  } @else if $side == y {
+    padding-bottom: get-uswds-value(padding, $value...) #{$important};
+    padding-top: get-uswds-value(padding, $value...) #{$important};
+  } @else {
+    padding-#{$side}: get-uswds-value(padding, $value...) #{$important};
+  }
+}
+
+@mixin u-padding($value...) {
+  @include padding-n(all, $value...);
+}
+
+@mixin u-padding-x($value...) {
+  @include padding-n(x, $value...);
+}
+
+@mixin u-padding-y($value...) {
+  @include padding-n(y, $value...);
+}
+
+@mixin u-padding-top($value...) {
+  @include padding-n(top, $value...);
+}
+
+@mixin u-padding-right($value...) {
+  @include padding-n(right, $value...);
+}
+
+@mixin u-padding-bottom($value...) {
+  @include padding-n(bottom, $value...);
+}
+
+@mixin u-padding-left($value...) {
+  @include padding-n(left, $value...);
+}

data/_sass/uswds/src/core/mixins/utilities/_pin.scss

@@ -0,0 +1,82 @@
+$utility-pin-options: "all", "x", "y", "top", "bottom", "left", "right", "none";
+
+@mixin u-pin($value...) {
+  $important: null;
+  $position-absolute: append-important($value, absolute);
+  $position-static: append-important($value, static);
+  $has-position: false;
+
+  @if has-important($value) {
+    $value: remove($value, "!important");
+    $important: " !important";
+  }
+
+  @each $option in $value {
+    $option: smart-quote($option);
+    @if $option != "none" and not $has-position {
+      @include u-position($position-absolute);
+      $has-position: true;
+    }
+    @if $option == "all" {
+      bottom: 0#{$important};
+      left: 0#{$important};
+      right: 0#{$important};
+      top: 0#{$important};
+    } @else if $option == "x" {
+      left: 0#{$important};
+      right: 0#{$important};
+    } @else if $option == "y" {
+      bottom: 0#{$important};
+      top: 0#{$important};
+    } @else if $option == "top" {
+      top: 0#{$important};
+    } @else if $option == "bottom" {
+      bottom: 0#{$important};
+    } @else if $option == "left" {
+      left: 0#{$important};
+    } @else if $option == "right" {
+      right: 0#{$important};
+    } @else if $option == "none" {
+      $has-position: false;
+      @include u-position($position-static);
+      bottom: auto#{$important};
+      left: auto#{$important};
+      right: auto#{$important};
+      top: auto#{$important};
+    } @else {
+      @error '`#{$option}` is not a valid `pin` value. Valid pin values include #{$utility-pin-options}';
+    }
+  }
+}
+
+@mixin u-pin-none($value...) {
+  @include u-pin("none", $value...);
+}
+
+@mixin u-pin-all($value...) {
+  @include u-pin("all", $value...);
+}
+
+@mixin u-pin-y($value...) {
+  @include u-pin("y", $value...);
+}
+
+@mixin u-pin-x($value...) {
+  @include u-pin("x", $value...);
+}
+
+@mixin u-pin-bottom($value...) {
+  @include u-pin("bottom", $value...);
+}
+
+@mixin u-pin-left($value...) {
+  @include u-pin("left", $value...);
+}
+
+@mixin u-pin-right($value...) {
+  @include u-pin("right", $value...);
+}
+
+@mixin u-pin-top($value...) {
+  @include u-pin("top", $value...);
+}