scu-web-components 0.0.59 → 0.0.60

package/dist/tokens/segments/comp-scw-rich-text/_size-p-mixins.scss

@@ -57,7 +57,7 @@
   margin-left: var( --scw-spacing-2 );
   margin-right: var( --scw-spacing-2 );
   margin-top: calc( var( --scw-spacing-1 ) * 40.8 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 11.4 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 29.5 );
 }
 
 @mixin html-autolayout-padding {
@@ -65,5 +65,5 @@
   padding-left: var( --scw-spacing-2 );
   padding-right: var( --scw-spacing-2 );
   padding-top: calc( var( --scw-spacing-1 ) * 40.8 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 11.4 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 29.5 );
 }

package/dist/tokens/segments/comp-scw-rich-text/_size-p-vars.scss

@@ -15,8 +15,8 @@ $item-spacing: 0px;
 $layout-align: STRETCH;
 $layout-grow: 0;
 $top: calc( var( --scw-spacing-1 ) * 40.8 );
-$top-percent: 75.83%;
-$bottom: calc( var( --scw-spacing-1 ) * 11.4 );
+$top-percent: 57.53%;
+$bottom: calc( var( --scw-spacing-1 ) * 29.5 );
 $left: var( --scw-spacing-2 );
 $left-percent: 50%;
 $right: var( --scw-spacing-2 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-even-cell-label-mixins.scss

@@ -0,0 +1,55 @@
+
+
+
+@mixin text (
+  $themeVar: false
+) { 
+  text-align: LEFT;
+  font: var( --scw-type-text-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-03 , var( --scw-color-grey-03 ) );
+  } @else {
+    color: var( --scw-color-grey-03 );
+  }
+  flex: 1; 
+}
+
+@mixin sizing {
+  width: 397px;
+  height: 24px;
+}
+
+@mixin width {
+  width: 397px;
+}
+
+@mixin height {
+  height: 24px;
+}
+
+@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: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-even-cell-label-vars.scss

@@ -0,0 +1,31 @@
+
+
+$characters: 'cell label';
+$font-size: 1rem;
+$text-align-horizontal: LEFT;
+$text-align-vertical: TOP;
+$text-transform: none;
+$color: var( --scw-color-grey-03 );
+$font-family: 'Proxima Nova';
+$font-weight: 400;
+$line-height: 1.5rem;
+$letter-spacing: 0rem;
+$font: var( --scw-type-text-font );
+$width: 397px;
+$height: 24px;
+$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: 1;
+$top: calc( var( --scw-spacing-1 ) * 1.5 );
+$top-percent: 50%;
+$bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+$left: calc( var( --scw-spacing-1 ) * 2.5 );
+$left-percent: 50%;
+$right: calc( var( --scw-spacing-1 ) * 2.5 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-even-mixins.scss

@@ -0,0 +1,76 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-095 , var( --scw-color-grey-095 ) );
+  } @else {
+    background-color: var( --scw-color-grey-095 );
+  }
+  border-width: 1px;
+  border-style: solid;
+  @if $borderThemeVar {
+    border-color: var( #{$borderThemeVar}-092 , var( --scw-color-grey-092 ) );
+  } @else {
+    border-color: var( --scw-color-grey-092 );
+  }
+  align-self: stretch; 
+}
+
+@mixin sizing {
+  width: 447px;
+  height: 54px;
+}
+
+@mixin width {
+  width: 447px;
+}
+
+@mixin height {
+  height: 54px;
+}
+
+@mixin padding {
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-start;
+  align-items: flex-start;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+  & > *:not(:last-child) { 
+        margin-right: var( --scw-spacing-1 ); 
+        --margin-right: var( --scw-spacing-1 ); 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * 10.7 );
+  margin-bottom: 0px;
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * 10.7 );
+  padding-bottom: 0px;
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-even-vars.scss

@@ -0,0 +1,29 @@
+
+
+$background-color: var( --scw-color-grey-095 );
+$blend-mode: NORMAL;
+$stroke-color: var( --scw-color-grey-092 );
+$stroke-weight: 1px;
+$stroke-align: INSIDE;
+$width: 447px;
+$height: 54px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: HORIZONTAL;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: var( --scw-spacing-1 );
+$layout-align: STRETCH;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 10.7 );
+$top-percent: 83.23%;
+$bottom: 0px;
+$left: 0px;
+$left-percent: 50%;
+$right: 0px;
+$padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+$padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-odd-cell-label-mixins.scss

@@ -0,0 +1,55 @@
+
+
+
+@mixin text (
+  $themeVar: false
+) { 
+  text-align: LEFT;
+  font: var( --scw-type-text-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-03 , var( --scw-color-grey-03 ) );
+  } @else {
+    color: var( --scw-color-grey-03 );
+  }
+  flex: 1; 
+}
+
+@mixin sizing {
+  width: 397px;
+  height: 24px;
+}
+
+@mixin width {
+  width: 397px;
+}
+
+@mixin height {
+  height: 24px;
+}
+
+@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: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-odd-cell-label-vars.scss

@@ -0,0 +1,31 @@
+
+
+$characters: 'cell label';
+$font-size: 1rem;
+$text-align-horizontal: LEFT;
+$text-align-vertical: TOP;
+$text-transform: none;
+$color: var( --scw-color-grey-03 );
+$font-family: 'Proxima Nova';
+$font-weight: 400;
+$line-height: 1.5rem;
+$letter-spacing: 0rem;
+$font: var( --scw-type-text-font );
+$width: 397px;
+$height: 24px;
+$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: 1;
+$top: calc( var( --scw-spacing-1 ) * 1.5 );
+$top-percent: 50%;
+$bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+$left: calc( var( --scw-spacing-1 ) * 2.5 );
+$left-percent: 50%;
+$right: calc( var( --scw-spacing-1 ) * 2.5 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-odd-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-width: 1px;
+  border-style: solid;
+  @if $borderThemeVar {
+    border-color: var( #{$borderThemeVar}-092 , var( --scw-color-grey-092 ) );
+  } @else {
+    border-color: var( --scw-color-grey-092 );
+  }
+  align-self: stretch; 
+}
+
+@mixin sizing {
+  width: 447px;
+  height: 54px;
+}
+
+@mixin width {
+  width: 447px;
+}
+
+@mixin height {
+  height: 54px;
+}
+
+@mixin padding {
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-start;
+  align-items: flex-start;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );
+  & > *:not(:last-child) { 
+        margin-right: var( --scw-spacing-1 ); 
+        --margin-right: var( --scw-spacing-1 ); 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: calc( var( --scw-spacing-1 ) * 5.3 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 5.4 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: calc( var( --scw-spacing-1 ) * 5.3 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 5.4 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-cell-odd-vars.scss

@@ -0,0 +1,29 @@
+
+
+$background-color: var( --scw-color-grey-10 );
+$blend-mode: NORMAL;
+$stroke-color: var( --scw-color-grey-092 );
+$stroke-weight: 1px;
+$stroke-align: INSIDE;
+$width: 447px;
+$height: 54px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: HORIZONTAL;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: var( --scw-spacing-1 );
+$layout-align: STRETCH;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 5.3 );
+$top-percent: 49.69%;
+$bottom: calc( var( --scw-spacing-1 ) * 5.4 );
+$left: 0px;
+$left-percent: 50%;
+$right: 0px;
+$padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-top: calc( var( --scw-spacing-1 ) * 1.5 );
+$padding-bottom: calc( var( --scw-spacing-1 ) * 1.5 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-header-row-header-label-mixins.scss

@@ -0,0 +1,55 @@
+
+
+
+@mixin text (
+  $themeVar: false
+) { 
+  text-align: LEFT;
+  font: var( --scw-type-text-bold-06-font );
+  @if $themeVar {
+    color: var( #{$themeVar}-10 , var( --scw-color-grey-10 ) );
+  } @else {
+    color: var( --scw-color-grey-10 );
+  }
+  flex: 1; 
+}
+
+@mixin sizing {
+  width: 397px;
+  height: 27px;
+}
+
+@mixin width {
+  width: 397px;
+}
+
+@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: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  margin-top: calc( var( --scw-spacing-1 ) * 1.3 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 1.3 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.3 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.3 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-header-row-header-label-vars.scss

@@ -0,0 +1,31 @@
+
+
+$characters: 'header label';
+$font-size: 1.125rem;
+$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: var( --scw-type-text-bold-06-font );
+$width: 397px;
+$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: 1;
+$top: calc( var( --scw-spacing-1 ) * 1.3 );
+$top-percent: 50%;
+$bottom: calc( var( --scw-spacing-1 ) * 1.3 );
+$left: calc( var( --scw-spacing-1 ) * 2.5 );
+$left-percent: 50%;
+$right: calc( var( --scw-spacing-1 ) * 2.5 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-header-row-mixins.scss

@@ -0,0 +1,70 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar} , var( --scw-color-primary ) );
+  } @else {
+    background-color: var( --scw-color-primary );
+  }
+  border-radius: 6px 6px 0px 0px;
+  align-self: stretch; 
+}
+
+@mixin sizing {
+  width: 447px;
+  height: 53px;
+}
+
+@mixin width {
+  width: 447px;
+}
+
+@mixin height {
+  height: 53px;
+}
+
+@mixin padding {
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.3 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.3 );
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: flex-start;
+  align-items: flex-start;
+  padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+  padding-top: calc( var( --scw-spacing-1 ) * 1.3 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 1.3 );
+  & > *:not(:last-child) { 
+        margin-right: var( --scw-spacing-1 ); 
+        --margin-right: var( --scw-spacing-1 ); 
+      } 
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: 0px;
+  margin-right: 0px;
+  margin-top: 0px;
+  margin-bottom: calc( var( --scw-spacing-1 ) * 10.8 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: calc( var( --scw-spacing-1 ) * 10.8 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-header-row-vars.scss

@@ -0,0 +1,30 @@
+
+
+$background-color: var( --scw-color-primary );
+$blend-mode: NORMAL;
+$corner-radius-top-left: 6px;
+$corner-radius-top-right: 6px;
+$corner-radius-bottom-right: 0px;
+$corner-radius-bottom-left: 0px;
+$width: 447px;
+$height: 53px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: HORIZONTAL;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: var( --scw-spacing-1 );
+$layout-align: STRETCH;
+$layout-grow: 0;
+$top: 0px;
+$top-percent: 16.46%;
+$bottom: calc( var( --scw-spacing-1 ) * 10.8 );
+$left: 0px;
+$left-percent: 50%;
+$right: 0px;
+$padding-left: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-right: calc( var( --scw-spacing-1 ) * 2.5 );
+$padding-top: calc( var( --scw-spacing-1 ) * 1.3 );
+$padding-bottom: calc( var( --scw-spacing-1 ) * 1.3 );

package/dist/tokens/segments/comp-scw-rich-text/_size-table-mixins.scss

@@ -0,0 +1,69 @@
+
+
+
+@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; 
+}
+
+@mixin sizing {
+  width: 447px;
+  height: 161px;
+}
+
+@mixin width {
+  width: 447px;
+}
+
+@mixin height {
+  height: 161px;
+}
+
+@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-start;
+  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: var( --scw-spacing-2 );
+  margin-right: var( --scw-spacing-2 );
+  margin-top: calc( var( --scw-spacing-1 ) * 56.9 );
+  margin-bottom: var( --scw-spacing-2 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: var( --scw-spacing-2 );
+  padding-top: calc( var( --scw-spacing-1 ) * 56.9 );
+  padding-bottom: var( --scw-spacing-2 );
+}

package/dist/tokens/segments/comp-scw-rich-text/_size-table-vars.scss

@@ -0,0 +1,25 @@
+
+
+$background-color: rgba(0,0,0,0);
+$width: 447px;
+$height: 161px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: FLEX;
+$layout-mode: VERTICAL;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: STRETCH;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 56.9 );
+$top-percent: 86.6%;
+$bottom: var( --scw-spacing-2 );
+$left: var( --scw-spacing-2 );
+$left-percent: 50%;
+$right: var( --scw-spacing-2 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;