scu-web-components 1.3.11 → 1.3.13

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-mixins.scss

@@ -0,0 +1,73 @@
+
+
+
+@mixin box (
+  $bgThemeVar: false, 
+  $borderThemeVar: false
+) { 
+  @if $bgThemeVar {
+    background-color: var( #{$bgThemeVar}-02 , var( --scw-color-grey-02 ) );
+  } @else {
+    background-color: var( --scw-color-grey-02 );
+  }
+  border-radius: 30px 30px 30px 30px; 
+}
+
+@mixin sizing {
+  width: 112px;
+  height: 27px;
+}
+
+@mixin width {
+  width: 112px;
+}
+
+@mixin height {
+  height: 27px;
+}
+
+@mixin padding {
+  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 );
+}
+
+@mixin figma-autolayout { 
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  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 );
+  & > *:not(:last-child) { 
+        margin-right: calc( var( --scw-spacing-1 ) * 0.5 ); 
+        --margin-right: calc( var( --scw-spacing-1 ) * 0.5 ); 
+      } 
+}
+
+@mixin absolute-layout {
+  position: absolute;
+  left: var( --scw-spacing-2 );
+  width: 112px;
+  top: calc( var( --scw-spacing-1 ) * 30.35 );
+  height: 27px; 
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-2 );
+  margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
+  margin-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-2 );
+  padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
+  padding-top: calc( var( --scw-spacing-1 ) * 30.35 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+}

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-scw-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: 12px;
+  height: 12px;
+}
+
+@mixin width {
+  width: 12px;
+}
+
+@mixin height {
+  height: 12px;
+}
+
+@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: 0px;
+  bottom: 0px; 
+}
+
+@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-tag/_state-selected-hover-size-small-scw-icon-icon-vars.scss

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

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-scw-icon-icon-vector-mixins.scss

@@ -0,0 +1,61 @@
+
+
+
+@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 );
+  } 
+}
+
+@mixin sizing {
+  width: 10.7143px;
+  height: 9.49px;
+}
+
+@mixin width {
+  width: 10.7143px;
+}
+
+@mixin height {
+  height: 9.49px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+  position: absolute;
+  left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 ); 
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+}

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-scw-icon-icon-vector-vars.scss

@@ -0,0 +1,26 @@
+
+
+$background-color: var( --scw-color-grey-10 );
+$blend-mode: NORMAL;
+$width: 10.7143px;
+$height: 9.49px;
+$constraint-horizontal: STRETCH;
+$constraint-vertical: STRETCH;
+$constrain-proportions: false;
+$layout-context: ABSOLUTE;
+$layout-mode: NONE;
+$primary-axis-align-items: MIN;
+$counter-axis-align-items: MIN;
+$item-spacing: 0px;
+$layout-align: MIN;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
+$top-percent: 50.01%;
+$bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
+$left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
+$left-percent: 50%;
+$right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-scw-icon-mixins.scss

@@ -0,0 +1,57 @@
+
+
+
+@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: 12px;
+  height: 12px;
+}
+
+@mixin width {
+  width: 12px;
+}
+
+@mixin height {
+  height: 12px;
+}
+
+@mixin padding {
+  padding-left: 0px;
+  padding-right: 0px;
+  padding-top: 0px;
+  padding-bottom: 0px;
+}
+
+@mixin figma-autolayout { 
+   
+}
+
+@mixin absolute-layout {
+   
+}
+
+@mixin html-autolayout-margins {
+  display: inline-block;
+  margin-left: var( --scw-spacing-1 );
+  margin-right: var( --scw-spacing-9 );
+  margin-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}
+
+@mixin html-autolayout-padding {
+  display: inline-block;
+  padding-left: var( --scw-spacing-1 );
+  padding-right: var( --scw-spacing-9 );
+  padding-top: calc( var( --scw-spacing-1 ) * 0.75 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+}

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-scw-icon-vars.scss

@@ -0,0 +1,26 @@
+
+
+$background-color: rgba(0,0,0,0);
+$width: 12px;
+$height: 12px;
+$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.75 );
+$top-percent: 50%;
+$bottom: calc( var( --scw-spacing-1 ) * 0.75 );
+$left: var( --scw-spacing-1 );
+$left-percent: 14.29%;
+$right: var( --scw-spacing-9 );
+$padding-left: 0px;
+$padding-right: 0px;
+$padding-top: 0px;
+$padding-bottom: 0px;
+$margin-right: 0px;

package/dist/tokens/segments/comp-scw-tag/_state-selected-hover-size-small-vars.scss

@@ -0,0 +1,30 @@
+
+
+$background-color: var( --scw-color-grey-02 );
+$blend-mode: NORMAL;
+$corner-radius-top-left: 30px;
+$corner-radius-top-right: 30px;
+$corner-radius-bottom-right: 30px;
+$corner-radius-bottom-left: 30px;
+$width: 112px;
+$height: 27px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: ABSOLUTE;
+$layout-mode: HORIZONTAL;
+$primary-axis-align-items: CENTER;
+$counter-axis-align-items: CENTER;
+$item-spacing: calc( var( --scw-spacing-1 ) * 0.5 );
+$layout-align: MIN;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 30.35 );
+$top-percent: 82.34%;
+$bottom: calc( var( --scw-spacing-1 ) * 5.45 );
+$left: var( --scw-spacing-2 );
+$left-percent: 17.43%;
+$right: calc( var( --scw-spacing-1 ) * 30.4 );
+$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-tag/_state-selected-hover-vars.scss

@@ -0,0 +1,30 @@
+
+
+$background-color: var( --scw-color-grey-02 );
+$blend-mode: NORMAL;
+$corner-radius-top-left: 30px;
+$corner-radius-top-right: 30px;
+$corner-radius-bottom-right: 30px;
+$corner-radius-bottom-left: 30px;
+$width: 129px;
+$height: 30px;
+$constraint-horizontal: MIN;
+$constraint-vertical: MIN;
+$constrain-proportions: false;
+$layout-context: ABSOLUTE;
+$layout-mode: HORIZONTAL;
+$primary-axis-align-items: CENTER;
+$counter-axis-align-items: CENTER;
+$item-spacing: calc( var( --scw-spacing-1 ) * 0.5 );
+$layout-align: MIN;
+$layout-grow: 0;
+$top: calc( var( --scw-spacing-1 ) * 14.2 );
+$top-percent: 40.78%;
+$bottom: calc( var( --scw-spacing-1 ) * 21.3 );
+$left: var( --scw-spacing-2 );
+$left-percent: 19.38%;
+$right: calc( var( --scw-spacing-1 ) * 28.7 );
+$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-tag/_state-selected-mixins.scss

@@ -6,9 +6,9 @@
   $borderThemeVar: false
 ) { 
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-02 , var( --scw-color-grey-02 ) );
+    background-color: var( #{$bgThemeVar}-03 , var( --scw-color-grey-03 ) );
   } @else {
-    background-color: var( --scw-color-grey-02 );
+    background-color: var( --scw-color-grey-03 );
   }
   border-radius: 30px 30px 30px 30px; 
 }
@@ -61,7 +61,7 @@
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 28.7 );
   margin-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }
 
 @mixin html-autolayout-padding {
@@ -69,5 +69,5 @@
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 28.7 );
   padding-top: calc( var( --scw-spacing-1 ) * 10.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 }

package/dist/tokens/segments/comp-scw-tag/_state-selected-scw-icon-icon-vector-mixins.scss

@@ -39,23 +39,23 @@
 @mixin absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 ); 
+  bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 ); 
 }
 
 @mixin html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }
 
 @mixin html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 }

package/dist/tokens/segments/comp-scw-tag/_state-selected-scw-icon-icon-vector-vars.scss

@@ -16,10 +16,10 @@ $layout-align: MIN;
 $layout-grow: 0;
 $top: calc( var( --scw-spacing-1 ) * 0.1568359375 );
 $top-percent: 50%;
-$bottom: calc( var( --scw-spacing-1 ) * 0.15691490173339845 );
+$bottom: calc( var( --scw-spacing-1 ) * 0.1569148063659668 );
 $left: calc( var( --scw-spacing-1 ) * 0.08037109375 );
 $left-percent: 50%;
-$right: calc( var( --scw-spacing-1 ) * 0.08034315109252929 );
+$right: calc( var( --scw-spacing-1 ) * 0.08034305572509766 );
 $padding-left: 0px;
 $padding-right: 0px;
 $padding-top: 0px;

package/dist/tokens/segments/comp-scw-tag/_state-selected-size-small-mixins.scss

@@ -6,9 +6,9 @@
   $borderThemeVar: false
 ) { 
   @if $bgThemeVar {
-    background-color: var( #{$bgThemeVar}-02 , var( --scw-color-grey-02 ) );
+    background-color: var( #{$bgThemeVar}-03 , var( --scw-color-grey-03 ) );
   } @else {
-    background-color: var( --scw-color-grey-02 );
+    background-color: var( --scw-color-grey-03 );
   }
   border-radius: 30px 30px 30px 30px; 
 }
@@ -52,7 +52,7 @@
   position: absolute;
   left: var( --scw-spacing-2 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 23.7 );
+  top: calc( var( --scw-spacing-1 ) * 26.65 );
   height: 27px; 
 }
 
@@ -60,14 +60,14 @@
   display: inline-block;
   margin-left: var( --scw-spacing-2 );
   margin-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  margin-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  margin-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }
 
 @mixin html-autolayout-padding {
   display: inline-block;
   padding-left: var( --scw-spacing-2 );
   padding-right: calc( var( --scw-spacing-1 ) * 30.4 );
-  padding-top: calc( var( --scw-spacing-1 ) * 23.7 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+  padding-top: calc( var( --scw-spacing-1 ) * 26.65 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 }

package/dist/tokens/segments/comp-scw-tag/_state-selected-size-small-scw-icon-icon-vector-mixins.scss

@@ -39,7 +39,7 @@
 @mixin absolute-layout {
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 ); 
 }
@@ -47,7 +47,7 @@
 @mixin html-autolayout-margins {
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  margin-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  margin-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   margin-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   margin-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }
@@ -55,7 +55,7 @@
 @mixin html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
-  padding-right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+  padding-right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
   padding-top: calc( var( --scw-spacing-1 ) * 0.1255859375 );
   padding-bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 }

package/dist/tokens/segments/comp-scw-tag/_state-selected-size-small-scw-icon-icon-vector-vars.scss

@@ -19,7 +19,7 @@ $top-percent: 50.01%;
 $bottom: calc( var( --scw-spacing-1 ) * 0.12541465759277343 );
 $left: calc( var( --scw-spacing-1 ) * 0.0642578125 );
 $left-percent: 50%;
-$right: calc( var( --scw-spacing-1 ) * 0.06431360244750976 );
+$right: calc( var( --scw-spacing-1 ) * 0.06431350708007813 );
 $padding-left: 0px;
 $padding-right: 0px;
 $padding-top: 0px;

package/dist/tokens/segments/comp-scw-tag/_state-selected-size-small-vars.scss

@@ -1,6 +1,6 @@
 
 
-$background-color: var( --scw-color-grey-02 );
+$background-color: var( --scw-color-grey-03 );
 $blend-mode: NORMAL;
 $corner-radius-top-left: 30px;
 $corner-radius-top-right: 30px;
@@ -18,9 +18,9 @@ $counter-axis-align-items: CENTER;
 $item-spacing: calc( var( --scw-spacing-1 ) * 0.5 );
 $layout-align: MIN;
 $layout-grow: 0;
-$top: calc( var( --scw-spacing-1 ) * 23.7 );
-$top-percent: 83.5%;
-$bottom: calc( var( --scw-spacing-1 ) * 3.6 );
+$top: calc( var( --scw-spacing-1 ) * 26.65 );
+$top-percent: 72.73%;
+$bottom: calc( var( --scw-spacing-1 ) * 9.15 );
 $left: var( --scw-spacing-2 );
 $left-percent: 17.43%;
 $right: calc( var( --scw-spacing-1 ) * 30.4 );

package/dist/tokens/segments/comp-scw-tag/_state-selected-vars.scss

@@ -1,6 +1,6 @@
 
 
-$background-color: var( --scw-color-grey-02 );
+$background-color: var( --scw-color-grey-03 );
 $blend-mode: NORMAL;
 $corner-radius-top-left: 30px;
 $corner-radius-top-right: 30px;
@@ -19,8 +19,8 @@ $item-spacing: calc( var( --scw-spacing-1 ) * 0.5 );
 $layout-align: MIN;
 $layout-grow: 0;
 $top: calc( var( --scw-spacing-1 ) * 10.2 );
-$top-percent: 39%;
-$bottom: calc( var( --scw-spacing-1 ) * 16.8 );
+$top-percent: 30.39%;
+$bottom: calc( var( --scw-spacing-1 ) * 25.3 );
 $left: var( --scw-spacing-2 );
 $left-percent: 19.38%;
 $right: calc( var( --scw-spacing-1 ) * 28.7 );

package/dist/tokens/segments/comp-scw-tag/_theme-color-primary-mixins.scss

@@ -61,7 +61,7 @@
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
   margin-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }
 
 @mixin html-autolayout-padding {
@@ -69,5 +69,5 @@
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
   padding-top: calc( var( --scw-spacing-1 ) * 2.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 24.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 33.3 );
 }

package/dist/tokens/segments/comp-scw-tag/_theme-color-primary-size-small-mixins.scss

@@ -52,7 +52,7 @@
   position: absolute;
   left: calc( var( --scw-spacing-1 ) * 21.9 );
   width: 112px;
-  top: calc( var( --scw-spacing-1 ) * 16.3 );
+  top: calc( var( --scw-spacing-1 ) * 19.25 );
   height: 27px; 
 }
 
@@ -60,14 +60,14 @@
   display: inline-block;
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  margin-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  margin-bottom: var( --scw-spacing-11 );
+  margin-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }
 
 @mixin html-autolayout-padding {
   display: inline-block;
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 10.5 );
-  padding-top: calc( var( --scw-spacing-1 ) * 16.3 );
-  padding-bottom: var( --scw-spacing-11 );
+  padding-top: calc( var( --scw-spacing-1 ) * 19.25 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 }

package/dist/tokens/segments/comp-scw-tag/_theme-color-primary-size-small-vars.scss

@@ -18,9 +18,9 @@ $counter-axis-align-items: CENTER;
 $item-spacing: calc( var( --scw-spacing-1 ) * 0.5 );
 $layout-align: MIN;
 $layout-grow: 0;
-$top: calc( var( --scw-spacing-1 ) * 16.3 );
-$top-percent: 58.83%;
-$bottom: var( --scw-spacing-11 );
+$top: calc( var( --scw-spacing-1 ) * 19.25 );
+$top-percent: 53.51%;
+$bottom: calc( var( --scw-spacing-1 ) * 16.55 );
 $left: calc( var( --scw-spacing-1 ) * 21.9 );
 $left-percent: 63.07%;
 $right: calc( var( --scw-spacing-1 ) * 10.5 );

package/dist/tokens/segments/comp-scw-tag/_theme-color-primary-state-hover-mixins.scss

@@ -61,7 +61,7 @@
   margin-left: calc( var( --scw-spacing-1 ) * 21.9 );
   margin-right: calc( var( --scw-spacing-1 ) * 8.8 );
   margin-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  margin-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  margin-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }
 
 @mixin html-autolayout-padding {
@@ -69,5 +69,5 @@
   padding-left: calc( var( --scw-spacing-1 ) * 21.9 );
   padding-right: calc( var( --scw-spacing-1 ) * 8.8 );
   padding-top: calc( var( --scw-spacing-1 ) * 6.2 );
-  padding-bottom: calc( var( --scw-spacing-1 ) * 20.8 );
+  padding-bottom: calc( var( --scw-spacing-1 ) * 29.3 );
 }