scu-web-components 0.0.97 → 0.0.99

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-cell-data-vars.scss

@@ -1,24 +1,24 @@
 
 
 $background-color: rgba(0,0,0,0);
-$width: 103px;
-$height: 24px;
+$width: 74px;
+$height: 20px;
 $constraint-horizontal: MIN;
 $constraint-vertical: MIN;
 $constrain-proportions: false;
 $layout-context: FLEX;
-$layout-mode: HORIZONTAL;
+$layout-mode: VERTICAL;
 $primary-axis-align-items: MIN;
 $counter-axis-align-items: MIN;
 $item-spacing: var( --scw-spacing-1 );
 $layout-align: INHERIT;
 $layout-grow: 0;
 $top: var( --scw-spacing-2 );
-$top-percent: 50%;
-$bottom: var( --scw-spacing-2 );
-$left: calc( var( --scw-spacing-1 ) * 2.52001953125 );
-$left-percent: 50%;
-$right: calc( var( --scw-spacing-1 ) * 2.5199798583984374 );
+$top-percent: 46.88%;
+$bottom: calc( var( --scw-spacing-1 ) * 2.4 );
+$left: var( --scw-spacing-2 );
+$left-percent: 30%;
+$right: calc( var( --scw-spacing-1 ) * 9.6 );
 $padding-left: 0px;
 $padding-right: 0px;
 $padding-top: 0px;

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-cell-data-header-label-mixins.scss

@@ -14,12 +14,12 @@
 }
 
 @mixin sizing {
-  width: 106px;
+  width: 62px;
   height: 24px;
 }
 
 @mixin width {
-  width: 106px;
+  width: 62px;
 }
 
 @mixin height {

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-cell-data-header-label-vars.scss

@@ -1,6 +1,6 @@
 
 
-$characters: 'Free Checking';
+$characters: 'Heading';
 $font-size: 1rem;
 $text-align-horizontal: LEFT;
 $text-align-vertical: TOP;
@@ -11,7 +11,7 @@ $font-weight: 700;
 $line-height: 1.5rem;
 $letter-spacing: 0rem;
 $font: var( --scw-type-text-bold-04-font );
-$width: 106px;
+$width: 62px;
 $height: 24px;
 $constraint-horizontal: MIN;
 $constraint-vertical: MIN;

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-cell-data-mixins.scss

@@ -13,12 +13,12 @@
 }
 
 @mixin sizing {
-  width: 106px;
+  width: 62px;
   height: 24px;
 }
 
 @mixin width {
-  width: 106px;
+  width: 62px;
 }
 
 @mixin height {
@@ -53,16 +53,16 @@
 
 @mixin html-autolayout-margins {
   display: inline-block;
-  margin-left: var( --scw-spacing-2 );
-  margin-right: calc( var( --scw-spacing-1 ) * 12.4 );
+  margin-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-right: calc( var( --scw-spacing-1 ) * 16.3 );
   margin-top: var( --scw-spacing-2 );
   margin-bottom: var( --scw-spacing-2 );
 }
 
 @mixin html-autolayout-padding {
   display: inline-block;
-  padding-left: var( --scw-spacing-2 );
-  padding-right: calc( var( --scw-spacing-1 ) * 12.4 );
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 16.3 );
   padding-top: var( --scw-spacing-2 );
   padding-bottom: var( --scw-spacing-2 );
 }

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-cell-data-vars.scss

@@ -1,7 +1,7 @@
 
 
 $background-color: rgba(0,0,0,0);
-$width: 106px;
+$width: 62px;
 $height: 24px;
 $constraint-horizontal: MIN;
 $constraint-vertical: MIN;
@@ -16,9 +16,9 @@ $layout-grow: 0;
 $top: var( --scw-spacing-2 );
 $top-percent: 50%;
 $bottom: var( --scw-spacing-2 );
-$left: var( --scw-spacing-2 );
-$left-percent: 29.2%;
-$right: calc( var( --scw-spacing-1 ) * 12.4 );
+$left: calc( var( --scw-spacing-1 ) * 2.5 );
+$left-percent: 22.4%;
+$right: calc( var( --scw-spacing-1 ) * 16.3 );
 $padding-left: 0px;
 $padding-right: 0px;
 $padding-top: 0px;

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-mixins.scss

@@ -34,7 +34,7 @@
 }
 
 @mixin padding {
-  padding-left: var( --scw-spacing-2 );
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
   padding-right: var( --scw-spacing-2 );
   padding-top: var( --scw-spacing-2 );
   padding-bottom: var( --scw-spacing-2 );
@@ -45,7 +45,7 @@
   flex-flow: row nowrap;
   justify-content: flex-start;
   align-items: flex-start;
-  padding-left: var( --scw-spacing-2 );
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
   padding-right: var( --scw-spacing-2 );
   padding-top: var( --scw-spacing-2 );
   padding-bottom: var( --scw-spacing-2 );

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-label-vars.scss

@@ -23,7 +23,7 @@ $bottom: calc( var( --scw-spacing-1 ) * -2.4 );
 $left: 0px;
 $left-percent: 29.98%;
 $right: calc( var( --scw-spacing-1 ) * 16.7 );
-$padding-left: var( --scw-spacing-2 );
+$padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
 $padding-right: var( --scw-spacing-2 );
 $padding-top: var( --scw-spacing-2 );
 $padding-bottom: var( --scw-spacing-2 );

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-mixins.scss

@@ -22,12 +22,12 @@
 }
 
 @mixin sizing {
-  width: 153.4px;
+  width: 190px;
   height: 64px;
 }
 
 @mixin width {
-  width: 153.4px;
+  width: 190px;
 }
 
 @mixin height {
@@ -63,7 +63,7 @@
 @mixin html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 25 );
-  margin-right: calc( var( --scw-spacing-1 ) * 1.3600006103515625 );
+  margin-right: calc( var( --scw-spacing-1 ) * -2.3 );
   margin-top: 0px;
   margin-bottom: calc( var( --scw-spacing-1 ) * -2.4 );
 }
@@ -71,7 +71,7 @@
 @mixin html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 25 );
-  padding-right: calc( var( --scw-spacing-1 ) * 1.3600006103515625 );
+  padding-right: calc( var( --scw-spacing-1 ) * -2.3 );
   padding-top: 0px;
   padding-bottom: calc( var( --scw-spacing-1 ) * -2.4 );
 }

package/dist/tokens/segments/comp-scw-rate-table-mobile/_table-row-cell-vars.scss

@@ -5,7 +5,7 @@ $blend-mode: NORMAL;
 $stroke-color: var( --scw-color-grey-08 );
 $stroke-weight: 1px;
 $stroke-align: INSIDE;
-$width: 153.4px;
+$width: 190px;
 $height: 64px;
 $constraint-horizontal: MIN;
 $constraint-vertical: MIN;
@@ -21,8 +21,8 @@ $top: 0px;
 $top-percent: 80%;
 $bottom: calc( var( --scw-spacing-1 ) * -2.4 );
 $left: calc( var( --scw-spacing-1 ) * 25 );
-$left-percent: 78.35%;
-$right: calc( var( --scw-spacing-1 ) * 1.3600006103515625 );
+$left-percent: 82.73%;
+$right: calc( var( --scw-spacing-1 ) * -2.3 );
 $padding-left: var( --scw-spacing-1 );
 $padding-right: var( --scw-spacing-1 );
 $padding-top: var( --scw-spacing-1 );

package/dist/tokens/segments/comp-scw-table/_index-mixins.scss

@@ -0,0 +1,70 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  }
+  align-self: stretch;
+  flex: 1; 
+}
+
+@mixin sizing {
+  width: 1171px;
+  height: 727px;
+}
+
+@mixin width {
+  width: 1171px;
+}
+
+@mixin height {
+  height: 727px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: flex-start;
+  align-items: flex-end;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+  & > *:not(:last-child) { 
+        margin-bottom: 0px; 
+        --margin-bottom: 0px; 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-table/_index-vars.scss

@@ -0,0 +1,25 @@
+
+
+$background-color: rgba(0,0,0,0);
+$width: 1171px;
+$height: 727px;
+$constraint-horizontal: CENTER;
+$constraint-vertical: CENTER;
+$constrain-proportions: false;
+$layout-context: NONE;
+$layout-mode: VERTICAL;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MAX;
+$item-spacing: 0px;
+$layout-align: STRETCH;
+$layout-grow: 1;
+$top: 0px;
+$top-percent: 0%;
+$bottom: 0px;
+$left: 0px;
+$left-percent: 0%;
+$right: 0px;
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-header-label-mixins.scss

@@ -0,0 +1,54 @@
+
+
+
+@mixin text (
+  $themeVar: false
+) { 
+  text-align: LEFT;
+  font: 700 1.25rem/1.688rem 'Proxima Nova';
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  } 
+}
+
+@mixin sizing {
+  width: 118px;
+  height: 27px;
+}
+
+@mixin width {
+  width: 118px;
+}
+
+@mixin height {
+  height: 27px;
+}
+
+@mixin padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-2 );
+  margin-right: calc( var( --scw-spacing-1 ) * 9.61999969482422 );
+  margin-top: var( --scw-spacing-3 );
+  margin-bottom: var( --scw-spacing-3 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: calc( var( --scw-spacing-1 ) * 9.61999969482422 );
+  padding-top: var( --scw-spacing-3 );
+  padding-bottom: var( --scw-spacing-3 );
+}

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-header-label-vars.scss

@@ -0,0 +1,32 @@
+
+
+$characters: 'Lorem Ipsum';
+$font-size: 1.25rem;
+$text-align-horizontal: LEFT;
+$text-align-vertical: TOP;
+$text-transform: none;
+$color: var( --scw-color-grey-10 );
+$font-family: 'Proxima Nova';
+$font-weight: 700;
+$line-height: 1.688rem;
+$letter-spacing: 0rem;
+$font: 700 1.25rem/1.688rem 'Proxima Nova';
+$width: 118px;
+$height: 27px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: var( --scw-spacing-3 );
+$top-percent: 50%;
+$bottom: var( --scw-spacing-3 );
+$left: var( --scw-spacing-2 );
+$left-percent: 33.73%;
+$right: calc( var( --scw-spacing-1 ) * 9.61999969482422 );
+$margin-bottom: 0px;

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-mixins.scss

@@ -0,0 +1,78 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-03 , var( --scw-color-grey-03 ) );
+  } @else {
+    background-color: var( --scw-color-grey-03 );
+  }
+  border-radius: 10px 0px 0px 0px;
+  border-width: 1px;
+  border-style: solid;
+  @if $borderThemeVar {
+    border-color: var( #{$borderThemeVar}-04 , var( --scw-color-grey-04 ) );
+  } @else {
+    border-color: var( --scw-color-grey-04 );
+  }
+  align-self: stretch;
+  flex: 1; 
+}
+
+@mixin sizing {
+  width: 234.2px;
+  height: 87px;
+}
+
+@mixin width {
+  width: 234.2px;
+}
+
+@mixin height {
+  height: 87px;
+}
+
+@mixin padding {
+  padding-left: var( --scw-spacing-2 );
+  padding-right: var( --scw-spacing-2 );
+  padding-top: var( --scw-spacing-3 );
+  padding-bottom: var( --scw-spacing-3 );
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  align-items: flex-start;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: var( --scw-spacing-2 );
+  padding-top: var( --scw-spacing-3 );
+  padding-bottom: var( --scw-spacing-3 );
+  & > *:not(:last-child) { 
+        margin-bottom: var( --scw-spacing-1 ); 
+        --margin-bottom: var( --scw-spacing-1 ); 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: calc( var( --scw-spacing-1 ) * 93.68000030517578 );
+  margin-top: 0px;
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: calc( var( --scw-spacing-1 ) * 93.68000030517578 );
+  padding-top: 0px;
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-scw-link-base-mixins.scss

@@ -0,0 +1,76 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    background-color: var( --scw-color-grey-10 );
+  }
+  border-radius: 8px 8px 8px 8px;
+  border-width: 1px;
+  border-style: solid;
+  @if $borderThemeVar {
+    border-color: var( #{$borderThemeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    border-color: var( --scw-color-grey-10 );
+  } 
+}
+
+@mixin sizing {
+  width: 117px;
+  height: 33px;
+}
+
+@mixin width {
+  width: 117px;
+}
+
+@mixin height {
+  height: 33px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+  & > *:not(:last-child) { 
+        margin-right: calc( var( --scw-spacing-1 ) * 0.4 ); 
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.4 ); 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-2 );
+  margin-right: calc( var( --scw-spacing-1 ) * 9.719999694824219 );
+  margin-top: calc( var( --scw-spacing-1 ) * 6.7 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -1.3 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: calc( var( --scw-spacing-1 ) * 9.719999694824219 );
+  padding-top: calc( var( --scw-spacing-1 ) * 6.7 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -1.3 );
+}

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-scw-link-base-scw-link-label-base-label-mixins.scss

@@ -0,0 +1,54 @@
+
+
+
+@mixin text (
+  $themeVar: false
+) { 
+  text-align: CENTER;
+  font: var( --scw-type-text-semibold-03-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-02 , var( --scw-color-grey-02 ) );
+  } @else {
+    color: var( --scw-color-grey-02 );
+  } 
+}
+
+@mixin sizing {
+  width: 97px;
+  height: 23px;
+}
+
+@mixin width {
+  width: 97px;
+}
+
+@mixin height {
+  height: 23px;
+}
+
+@mixin padding {
+  padding-left: initial;
+  padding-right: initial;
+  padding-top: initial;
+  padding-bottom: initial;
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-1 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-1 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+}

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-scw-link-base-scw-link-label-base-label-vars.scss

@@ -0,0 +1,32 @@
+
+
+$characters: 'Open Account';
+$font-size: 0.9375rem;
+$text-align-horizontal: CENTER;
+$text-align-vertical: CENTER;
+$text-transform: none;
+$color: var( --scw-color-grey-02 );
+$font-family: 'Proxima Nova';
+$font-weight: 600;
+$line-height: 1.406rem;
+$letter-spacing: 0rem;
+$font: var( --scw-type-text-semibold-03-font );
+$width: 97px;
+$height: 23px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: INHERIT;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 0.5 );
+$top-percent: 50%;
+$bottom: calc( var( --scw-spacing-1 ) * 0.5 );
+$left: var( --scw-spacing-1 );
+$left-percent: 50%;
+$right: var( --scw-spacing-1 );
+$margin-right: 0px;

package/dist/tokens/segments/comp-scw-table/_scw-table-header-header-row-scw-link-base-scw-link-label-base-left-icon-icon-mixins.scss

@@ -0,0 +1,61 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , rgba(0,0,0,0) );
+  } @else {
+    background-color: rgba(0,0,0,0);
+  } 
+}
+
+@mixin sizing {
+  width: 16px;
+  height: 16px;
+}
+
+@mixin width {
+  width: 16px;
+}
+
+@mixin height {
+  height: 16px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+  position: absolute;
+  left: 0px;
+  right: 0px;
+  top: calc( var( --scw-spacing-1 ) * 0.0000244140625 );
+  bottom: calc( var( --scw-spacing-1 ) * -0.000024318695068359375 ); 
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * 0.0000244140625 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * -0.000024318695068359375 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * 0.0000244140625 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * -0.000024318695068359375 );
+}