@elliemae/ds-basic 3.50.1-next.8 → 3.51.0-next.0

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_collapse.scss

@@ -1,74 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Collapses the grid a cells within it.
-///
-/// @param {String} $selector [.cell] - The child element to remove the gutter from.
-/// @param {Keyword} $gutter-type [margin] - The type of gutter to remove.
-/// @param {List} $gutter-position [right left] - The positions to remove gutters from. Accepts `top`, `bottom`, `left`, `right` in any combination.
-@mixin xy-grid-collapse(
-  $selector: '.cell',
-  $gutter-type: margin,
-  $gutter-position: right left,
-  $min-breakpoint: $-zf-zero-breakpoint
-) {
-  // First, lets negate any margins on the top level
-  @if ($gutter-type == 'margin') {
-
-    @include breakpoint($min-breakpoint) {
-      @each $value in $gutter-position {
-        margin-#{$value}: 0;
-      }
-
-      > #{$selector} {
-        @each $value in $gutter-position {
-          margin-#{$value}: 0;
-        }
-      }
-    }
-
-    $excluded-bps: -zf-breakpoints-less-than($min-breakpoint);
-
-    // Output new widths to not include gutters
-    @each $bp in $breakpoint-classes {
-      @if(sl-contain($excluded-bps, $bp)) {
-        @include breakpoint($min-breakpoint) {
-          @for $i from 1 through $grid-columns {
-            // Sizing (percentage)
-            > .#{$bp}-#{$i} {
-              @include xy-cell-static($i, $gutter-output: false, $gutter-type: padding);
-            }
-          }
-        }
-      } @else {
-        @include breakpoint($bp) {
-          @for $i from 1 through $grid-columns {
-            // Sizing (percentage)
-            > .#{$bp}-#{$i} {
-              @include xy-cell-static($i, $gutter-output: false, $gutter-type: padding);
-            }
-          }
-        }
-      } 
-    }
-  }
-  @else {
-
-    @include breakpoint($min-breakpoint) {
-      @each $value in $gutter-position {
-        margin-#{$value}: 0;
-      }
-
-      > #{$selector} {
-        @each $value in $gutter-position {
-          padding-#{$value}: 0;
-        }
-      }
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_frame.scss

@@ -1,86 +0,0 @@
-/// Modifies a grid to give it "frame" behavior (no overflow, no wrap, stretch behavior)
-///
-/// @param {Boolean} $vertical [false] - Is grid vertical or horizontal. Should match grid.
-/// @param {Boolean} $nested [false] - Is grid nested or not. If nested is true this sets the frame to 100% height, otherwise will be 100vh.
-/// @param {Number|Map} $gutters [null] - Map or single value for gutters.
-/// @param {String} $breakpoint [null] - The name of the breakpoint size in your gutters map to get the size from.
-/// @param {Boolean} $include-base [true] - Include the base styles that don't vary per breakpoint.
-@mixin xy-grid-frame(
-  $vertical: false,
-  $nested: false,
-  $gutters: null,
-  $breakpoint: null,
-  $include-base: true
-) {
-
-  @if $include-base {
-    overflow: hidden;
-    position: relative;
-    flex-wrap: nowrap;
-    align-items: stretch;
-  }
-
-  @if $breakpoint == null and type-of($gutters) == 'map' {
-    @include -zf-each-breakpoint() {
-      @include xy-grid-frame($vertical, $nested, $gutters, $-zf-size, false);
-    }
-  } @else {
-    // Get our gutters if applicable
-    $gutter: -zf-get-bp-val($gutters, $breakpoint);
-
-    // If we have a gutter, add it to the width/height
-    @if $gutter {
-      @if $vertical == true {
-        $unit: if($nested == true, 100%, 100vh);
-        $gutter: rem-calc($gutter);
-        height: calc(#{$unit} + #{$gutter});
-      } @else {
-        $unit: if($nested == true, 100%, 100vw);
-        $gutter: rem-calc($gutter);
-        width: calc(#{$unit} + #{$gutter});
-      }
-    }
-    @else {
-      @if $vertical == true {
-        height: if($nested == true, 100%, 100vh);
-      } @else {
-        width: if($nested == true, 100%, 100vw);
-      }
-    }
-  }
-}
-
-/// Modifies a cell to give it "block" behavior (overflow auto, inertial scrolling)
-///
-/// @param {Boolean} $vertical [false] - Is grid vertical or horizontal. Should match grid.
-@mixin xy-cell-block(
-  $vertical: false
-) {
-  $property: if($vertical == true, 'overflow-y', 'overflow-x');
-
-  @if $vertical == true {
-    overflow-y: auto;
-    max-height: 100%;
-    height: 100%;
-  } @else {
-    overflow-x: auto;
-    max-width: 100%;
-  }
-
-  -webkit-overflow-scrolling: touch;
-  -ms-overflow-stype: -ms-autohiding-scrollbar;
-}
-
-/// Container for inside a grid frame containing multiple blocks. Typically used
-/// as a modifier for a `.cell` to allow the cell to pass along flex sizing
-/// constraints / from parents to children.
-@mixin xy-cell-block-container() {
-  display: flex;
-  flex-direction: column;
-  max-height: 100%;
-
-  > .grid-x {
-    max-height: 100%;
-    flex-wrap: nowrap;
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_grid.scss

@@ -1,35 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Creates a max width container, designed to house your grid content.
-///
-/// @param {Number} $width [$grid-container] - a width to limit the container to.
-@mixin xy-grid-container(
-  $width: $grid-container,
-  $padding: $grid-container-padding
-) {
-  @include xy-gutters($gutters: $padding, $gutter-type: padding);
-
-  max-width: $width;
-  margin: 0 auto;
-}
-
-/// Creates a container for your flex cells.
-///
-/// @param {Keyword} $direction [horizontal] - Either horizontal or vertical direction of cells within.
-/// @param {Boolean} $wrap [true] - If the cells within should wrap or not.
-@mixin xy-grid(
-  $direction: horizontal,
-  $wrap: true
-) {
-  $direction: if($direction == 'horizontal', row, column);
-  $wrap: if($wrap, wrap, nowrap);
-
-  display: flex;
-  flex-flow: $direction $wrap;
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_gutters.scss

@@ -1,45 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Create gutters for a cell/container.
-///
-/// @param {Number|Map} $gutters [$grid-margin-gutters] - Map or single value for gutters.
-/// @param {Keyword} $gutter-type [margin] - Type of gutter to output. Accepts either margin or padding.
-/// @param {List} $gutter-position [right left] - The position to apply gutters to. Accepts `top`, `bottom`, `left`, `right` in any combination.
-/// @param {Boolean} $negative [false] - Whether to apply the gutter as a negative value. Commonly used for nested grids.
-@mixin xy-gutters(
-  $gutters: $grid-margin-gutters,
-  $gutter-type: margin,
-  $gutter-position: right left,
-  $negative: false
-) {
-  $operator: if($negative, '-', '');
-
-  // If we have declared negative gutters, force type to `margin.
-  $gutter-type: if($negative, 'margin', $gutter-type);
-
-  // Output our margin gutters.
-  @if (type-of($gutters) == 'map') {
-    @include -zf-breakpoint-value(auto, $gutters) {
-      $gutter: rem-calc($-zf-bp-value) / 2;
-
-      // Loop through each gutter position
-      @each $value in $gutter-position {
-        #{$gutter-type}-#{$value}: unquote("#{$operator}#{$gutter}");
-      }
-    }
-  }
-  @else if (type-of($gutters) == 'number') {
-    $gutter: rem-calc($gutters) / 2;
-
-    // Loop through each gutter position
-    @each $value in $gutter-position {
-      #{$gutter-type}-#{$value}: unquote("#{$operator}#{$gutter}");
-    }
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_layout.scss

@@ -1,33 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Sizes child elements so that `$n` number of items appear on each row.
-///
-/// @param {Number} $n - Number of elements to display per row.
-/// @param {String} $selector ['.cell'] - Selector(s) to use for child elements.
-/// @param {Boolean} $gutter-output [true] - Whether or not to output gutters
-/// @param {Number|Map} $gutters [$grid-margin-gutters] - Map or single value for gutters.
-/// @param {Keyword} $gutter-type [margin] - Type of gutter to output. Accepts `margin` or `padding`.
-/// @param {List} $gutter-position [right left] - The position to apply gutters to. Accepts `top`, `bottom`, `left`, `right` in any combination.
-/// @param {Boolean} $vertical [false] - Set to true to output vertical (height) styles rather than widths.
-@mixin xy-grid-layout(
-  $n,
-  $selector: '.cell',
-  $gutter-output: true,
-  $gutters: $grid-margin-gutters,
-  $gutter-type: margin,
-  $gutter-position: right left,
-  $breakpoint: $-zf-zero-breakpoint,
-  $vertical: false
-) {
-  $size: percentage(1/$n);
-
-  & > #{$selector} {
-    @include xy-cell($size, $gutter-output, $gutters, $gutter-type, $gutter-position, $breakpoint, $vertical);
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_position.scss

@@ -1,28 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Offsets a column to the right/bottom by `$n` columns.
-///
-/// @param {Number|List} $n - Size to offset by. You can pass in any value accepted by the `zf-cell()` mixin, such as `6`, `50%`, or `1 of 2`.
-/// @param {Boolean} $vertical [false] Sets the direction of the offset. If set to true will apply margin-top instead.
-@mixin xy-cell-offset(
- $n,
- $gutters: $grid-margin-gutters,
- $gutter-type: margin,
- $breakpoint: $-zf-zero-breakpoint,
- $vertical: false
-) {
-  $direction: if($vertical, 'top', $global-left);
-
-  @include -zf-breakpoint-value($breakpoint, $gutters) {
-    $gutter: rem-calc($-zf-bp-value) / 2;
-    $size: if($gutter-type == 'margin', calc(#{xy-cell-size($n)} + #{$gutter}), #{xy-cell-size($n)});
-
-    margin-#{$direction}: #{$size};
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid/xy-grid/_xy-grid.scss

@@ -1,51 +0,0 @@
-// Foundation for Sites by ZURB
-// foundation.zurb.com
-// Licensed under MIT Open Source
-
-////
-/// @group xy-grid
-////
-
-/// Enables the XY grid.
-/// @type Boolean
-$xy-grid: true !default;
-
-/// The maximum width of a grid container.
-/// @type Number
-$grid-container: $global-width !default;
-
-/// The number of columns used in the grid.
-/// @type Number
-$grid-columns: 12 !default;
-
-/// The amount of margin between cells at different screen sizes when using the margin grid. To use just one size, set the variable to a number instead of a map.
-/// @type Map | Length
-$grid-margin-gutters: (
-  small: 20px,
-  medium: 30px
-) !default;
-
-/// The amount of padding in cells at different screen sizes when using the padding grid. To use just one size, set the variable to a number instead of a map.
-/// @type Map | Length
-$grid-padding-gutters: $grid-margin-gutters !default;
-
-/// The amount of padding to use when padding the grid-container.
-/// @type Map | Length
-$grid-container-padding: $grid-padding-gutters !default;
-
-/// The maximum width to apply to a grid container
-/// @type Number
-$grid-container-max: $global-width !default;
-
-/// The maximum number of cells in an XY block grid.
-/// @type Number
-$xy-block-grid-max: 8 !default;
-
-@import 'gutters';
-@import 'grid';
-@import 'cell';
-@import 'frame';
-@import 'position';
-@import 'layout';
-@import 'collapse';
-@import 'classes';

package/dist/styles/components/packages/ds-basic/static-build/styles/base/grid.scss

@@ -1,8 +0,0 @@
-// For customization later on see reference below
-// In the meantime are are only including the XY-Grid component which we'll use as our layout grid
-// https://foundation.zurb.com/sites/docs/sass.html
-//https://foundation.zurb.com/sites/docs/xy-grid.html
-
-@import './grid/grid';
-
-@include foundation-xy-grid-classes;

package/dist/styles/components/packages/ds-basic/static-build/styles/base/iconography.scss

@@ -1,12 +0,0 @@
-$icon-unit: 8px !default;
-
-$icon-data: (
-  none: 0,                           
-  xxs:  ($icon-unit / 2), // 4px
-  xs:   ($icon-unit),     // 8px
-  s:    ($icon-unit * 2), // 16px
-  m:    ($icon-unit * 3), // 24px
-  l:    ($icon-unit * 4), // 32px
-  xl:   ($icon-unit * 6), // 48px
-  xxl:  ($icon-unit * 8)  // 64px
-) !default;

package/dist/styles/components/packages/ds-basic/static-build/styles/base/index.scss

@@ -1,23 +0,0 @@
-// normalizing css & general utility functions
-@import './_generic/_generic-dir.scss';
-
-// include colors data
-@import './color.scss';
-// include typography data
-@import './typography.scss';
-// include spacing data
-@import './spacing.scss';
-// include border data
-@import './border.scss';
-// include motion data
-@import './motion.scss';
-// include depth data
-@import './depth.scss';
-// include iconography data
-@import './iconography.scss';
-
-
-// include scss functions
-@import './utility-functions/_functions-base.scss';
-// base mixins
-@import './utility-mixins/_mixins-base.scss';

package/dist/styles/components/packages/ds-basic/static-build/styles/base/motion.scss

@@ -1,19 +0,0 @@
-$unit: 100ms;
-
-$duration-data: (
-  fast: $unit,
-  base: $unit * 2,
-  slow: $unit * 3,
-  slower: $unit * 4,
-  slowest: $unit * 5,
-) !default;
-
-$easing-data: (
-  base: cubic-bezier(0.64, 0, 0.35, 1),
-  in: cubic-bezier(0.36, 0, 1, 1),
-  out: cubic-bezier(0, 0, 0.42, 1),
-  excite: cubic-bezier(0.18, 0.67, 0.6, 1.22),
-  overshoot: cubic-bezier(0.07, 0.28, 0.32, 1.22),
-  anticipate: cubic-bezier(0.38, -0.4, 0.88, 0.65),
-) !default;
-

package/dist/styles/components/packages/ds-basic/static-build/styles/base/spacing.scss

@@ -1,71 +0,0 @@
-$point-unit: 8px !default;
-// Point-Grid System
-// Use multiples of this value to define dimensions, padding, and margin of both block and inline elements.
-// Learn more here: https://builttoadapt.io/intro-to-the-8-point-grid-system-d2573cde8632
-
-$spacing-data: (
-  none: 0,
-  xxs: rem($point-unit / 2),
-  // 4px
-  xs: rem($point-unit),
-  // 8px
-  s: rem($point-unit * 2),
-  // 16px
-  m: rem($point-unit * 3),
-  // 24px
-  l: rem($point-unit * 4),
-  // 32px
-  xl: rem($point-unit * 6),
-  // 48px
-  xxl: rem($point-unit * 8) // 64px,,,,,,,
-) !default;
-
-/// A list of named breakpoints. You can use these with the `breakpoint()` mixin to quickly create media queries.
-/// @type Map
-$breakpoints: (
-  small: 0,
-  medium: 640px,
-  large: 1024px,
-  xlarge: 1200px,
-  xxlarge: 1440px,
-) !default;
-
-// Small devices
-@mixin sm {
-  @media (max-width: 32rem) {
-    @content;
-  }
-}
-// Medium devices
-@mixin md {
-  @media (max-width: 48rem) {
-    @content;
-  }
-  @media only screen and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
-    @content;
-  }
-  @media only screen and (max-device-width: 812px) and (-webkit-min-device-pixel-ratio: 3) {
-    @content;
-  }
-  @media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 2) {
-    @content;
-  }
-  @media screen and (device-width: 320px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
-    @content;
-  }
-  @media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 4) {
-    @content;
-  }
-  @media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 3) {
-    @content;
-  }
-  @media screen and (device-width: 360px) and (device-height: 640px) and (-webkit-device-pixel-ratio: 4) {
-    @content;
-  }
-}
-// Large devices
-@mixin lg {
-  @media (max-width: 64rem) {
-    @content;
-  }
-}

package/dist/styles/components/packages/ds-basic/static-build/styles/base/typography.scss

@@ -1,29 +0,0 @@
-$font-size-data: (
-  900: 2.7692rem, // 36px
-  800: 1.8461rem, // 24px
-  700: 1.3846rem, // 18px
-  600: 1.2307rem, // 16px
-  500: 1.0769rem, // 14px
-  400: 1rem,      // 13px
-  300: 0.9230rem, // 12px
-  200: 0.8461rem,  // 11px
-  100: 0.75rem
-) !default;
-
-$line-height-data: (
-  normal: normal,
-  // TODO: Need to revise these with visual design team
-  600: 1.2,
-  500: 1.2,
-  400: 1.5,
-  300: 1.5,
-  200: 1.5
-) !default;
-  
-$font-weight-data: (
-  bold: 900,
-  semibold: 600,
-  regular: 400,
-  light: 300,
-  thin: 100
-) !default;

package/dist/styles/components/packages/ds-basic/static-build/styles/base/utility-functions/_functions-base.scss

@@ -1,7 +0,0 @@
-@import './color-functions.scss';
-@import './typography-functions.scss';
-@import './spacing-functions.scss';
-@import './motion-functions.scss';
-@import './depth-functions.scss';
-@import './border-functions.scss';
-@import './iconography-functions';

package/dist/styles/components/packages/ds-basic/static-build/styles/base/utility-functions/border-functions.scss

@@ -1,13 +0,0 @@
-/// Returns the border size for the specified size name
-/// @param {String} $size [xs]
-/// @return {List} The border value.
-
-@function border-size($size: xs) {
-  $fetched-value: map-get($border-size-data, $size);
-
-  @if type-of($fetched-value) == number {
-    @return $fetched-value;
-  } @else {
-    @error 'Border size `#{$size}` not found. Available variants: #{$border-size-data}';
-  }
-}