@designsystem-se/af 31.3.0 → 31.3.1-beta.0

package/dist/collection/design-tokens/components/_icon-table-row.variables.scss

@@ -1,4 +1,4 @@
-@mixin digi-icon-table-row--variables {
+@mixin digi-icon-table-row--variables {
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_icon-table.variables.scss

@@ -1,4 +1,4 @@
-@mixin digi-icon-table--variables {
+@mixin digi-icon-table--variables {
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_icon.variables.scss

@@ -1,7 +1,7 @@
-@mixin digi-icon--variables {
-  --digi--icon--color: var(--digi--color--icons--primary);
-  --digi--icon--width: initial;
-  --digi--icon--height: auto;
+@mixin digi-icon--variables {
+  --digi--icon--color: var(--digi--color--icons--primary);
+  --digi--icon--width: initial;
+  --digi--icon--height: auto;
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_info-card.variables.scss

@@ -1,16 +1,16 @@
-@mixin digi-info-card--variables() {
-  --digi--info-card--background-color--primary: var(--digi--color--background--neutral-5);
-  --digi--info-card--background-color--secondary: var(--digi--color--background--secondary);
-  --digi--info-card--background-color--related: var(--digi--color--background--primary);
-  --digi--info-card--color--heading: var(--digi--color--text--primary);
-  --digi--info-card--color--heading--multi: var(--digi--color--text--link);
-  --digi--info-card--border: var(--digi--border-width--complementary-2) solid var(--digi--color--border--secondary);
-  --digi--info-card--padding: var(--digi--padding--large) var(--digi--padding--medium) var(--digi--padding--largest) var(--digi--padding--medium);
-  --digi--info-card--padding--desktop: var(--digi--padding--largest-2) var(--digi--padding--largest) var(--digi--padding--largest-3) var(--digi--padding--largest);
-  --digi--info-card--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
-  --digi--info-card--heading--font-size--mobile: var(--digi--typography--heading-2--font-size--mobile);
-  --digi--info-card--heading--font-size--desktop: var(--digi--typography--heading-2--font-size--desktop);
- 
+@mixin digi-info-card--variables() {
+  --digi--info-card--background-color--primary: var(--digi--color--background--neutral-5);
+  --digi--info-card--background-color--secondary: var(--digi--color--background--secondary);
+  --digi--info-card--background-color--related: var(--digi--color--background--primary);
+  --digi--info-card--color--heading: var(--digi--color--text--primary);
+  --digi--info-card--color--heading--multi: var(--digi--color--text--link);
+  --digi--info-card--border: var(--digi--border-width--complementary-2) solid var(--digi--color--border--secondary);
+  --digi--info-card--padding: var(--digi--padding--large) var(--digi--padding--medium) var(--digi--padding--largest) var(--digi--padding--medium);
+  --digi--info-card--padding--desktop: var(--digi--padding--largest-2) var(--digi--padding--largest) var(--digi--padding--largest-3) var(--digi--padding--largest);
+  --digi--info-card--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
+  --digi--info-card--heading--font-size--mobile: var(--digi--typography--heading-2--font-size--mobile);
+  --digi--info-card--heading--font-size--desktop: var(--digi--typography--heading-2--font-size--desktop);
+ 
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_layout-columns.variables.scss

@@ -1,8 +1,8 @@
-@mixin digi-layout-columns--variables() {
-  --digi--layout-columns--gap--column: var(--digi--gutter--largest);
-  --digi--layout-columns--gap--row: var(--digi--gutter--largest);
-  --digi--layout-columns--min-width: 0;
-  --digi--layout-columns--gap--column--32: var(--digi--global--spacing--largest-4);
+@mixin digi-layout-columns--variables() {
+  --digi--layout-columns--gap--column: var(--digi--gutter--largest);
+  --digi--layout-columns--gap--row: var(--digi--gutter--largest);
+  --digi--layout-columns--min-width: 0;
+  --digi--layout-columns--gap--column--32: var(--digi--global--spacing--largest-4);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_list.variables.scss

@@ -1,6 +1,6 @@
-@mixin digi-list--variables (){
-	--digi--list--margin--top: initial;
-	--digi--list--margin--bottom: var(--digi--margin--large);
+@mixin digi-list--variables (){
+	--digi--list--margin--top: initial;
+	--digi--list--margin--bottom: var(--digi--margin--large);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_loader-skeleton.variables.scss

@@ -1,19 +1,19 @@
-@mixin digi-loader-skeleton--variables {
-  --digi--loader-skeleton--background: var(--digi--color--background--neutral-3);
-  --digi--loader-skeleton--margin-bottom: var(--digi--typography--paragraph--margin--small);
-  --digi--loader-skeleton--header-height: 2rem;
-  --digi--loader-skeleton--line-height: var(--digi--typography--body--font-size--desktop);
-  --digi--loader-skeleton--text-height: var(--digi--typography--body--font-size--desktop);
-
-  --digi--loader-skeleton--circle-height: 2rem;
-  --digi--loader-skeleton--circle-width: 2rem;
-  --digi--loader-skeleton--circle-border-radius: 50%;
-
-  --digi--loader-skeleton--text-margin: var(--digi--margin--h4-h6-large);
-  --digi--loader-skeleton--header-margin: var(--digi--typography--h3--margin--small);
-  --digi--loader-skeleton--line-margin-bottom: var(--digi--typography--paragraph--margin--small);
-
-  --digi--loader-skeleton--rounded-border-radius: var(--digi--border-radius--complementary-2);
+@mixin digi-loader-skeleton--variables {
+  --digi--loader-skeleton--background: var(--digi--color--background--neutral-3);
+  --digi--loader-skeleton--margin-bottom: var(--digi--typography--paragraph--margin--small);
+  --digi--loader-skeleton--header-height: 2rem;
+  --digi--loader-skeleton--line-height: var(--digi--typography--body--font-size--desktop);
+  --digi--loader-skeleton--text-height: var(--digi--typography--body--font-size--desktop);
+
+  --digi--loader-skeleton--circle-height: 2rem;
+  --digi--loader-skeleton--circle-width: 2rem;
+  --digi--loader-skeleton--circle-border-radius: 50%;
+
+  --digi--loader-skeleton--text-margin: var(--digi--margin--h4-h6-large);
+  --digi--loader-skeleton--header-margin: var(--digi--typography--h3--margin--small);
+  --digi--loader-skeleton--line-margin-bottom: var(--digi--typography--paragraph--margin--small);
+
+  --digi--loader-skeleton--rounded-border-radius: var(--digi--border-radius--complementary-2);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_loader-spinner.variables.scss

@@ -1,11 +1,11 @@
-@mixin digi-loader-spinner--variables {
-	--digi--loader-spinner--icon--size--small: 1rem;
-	--digi--loader-spinner--icon--size--medium: 2rem;
-	--digi--loader-spinner--icon--size--large: 5rem;
-
-	--digi-loader-spinner--font--size--small: var(--digi--typography--heading-4--font-size--desktop-xsmall);
-	--digi-loader-spinner--font--size--medium: var(--digi--typography--heading-4--font-size--desktop);
-	--digi-loader-spinner--font--size--large: var(--digi--typography--heading-4--font-size--desktop-large);
+@mixin digi-loader-spinner--variables {
+	--digi--loader-spinner--icon--size--small: 1rem;
+	--digi--loader-spinner--icon--size--medium: 2rem;
+	--digi--loader-spinner--icon--size--large: 5rem;
+
+	--digi-loader-spinner--font--size--small: var(--digi--typography--heading-4--font-size--desktop-xsmall);
+	--digi-loader-spinner--font--size--medium: var(--digi--typography--heading-4--font-size--desktop);
+	--digi-loader-spinner--font--size--large: var(--digi--typography--heading-4--font-size--desktop-large);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_logo.variables.scss

@@ -1,40 +1,40 @@
-@use '../../../global/styles/utilities' as *;
-
-@mixin digi-logo--variables() {
-  --digi--logo--img--min-width: #{rem(256)};
-  --digi--logo--img--max-width:#{rem(312)}; 
-  --digi--logo--img--max-width--large: #{rem(392)};   
-  --digi--logo--img--max-width--system: #{rem(44)}; 
-  
-  --digi--logo--padding: var(--digi--gutter--medium);
-  --digi--logo--padding--wide: var(--digi--gutter--larger);
-  --digi--logo--padding--large: var(--digi--gutter--medium);
-  --digi--logo--padding--large--wide: var(--digi--gutter--larger);
-
-  --digi--logo--color--primary: var(--digi--color--text--secondary);
-  --digi--logo--color--secondary: var(--digi--color--text--inverted);
-
-  --digi--logo--system-name-color--primary: var(--digi--color--text--primary);
-  --digi--logo--system-name-color--secondary: var(--digi--color--text--inverted);
-
-  --digi--logo--color--border--primary: var(--digi--color--text--primary);
-  --digi--logo--color--border--secondary: var(--digi--color--text--inverted);
-
-  --digi--logo--border-width: var(--digi--border-width--primary);
-  --digi--logo--border-width--large: var(--digi--border-width--secondary);
-
-  --digi--logo--margin--system: 0 0 0 var(--digi--gutter--medium);
-  --digi--logo--margin--system--large: 0 0 0 var(--digi--gutter--larger);
-  --digi--logo--padding--system: 0 0 0 var(--digi--gutter--medium);
-  --digi--logo--padding--system--large: 0 0 0 var(--digi--gutter--larger);
-
-  --digi--logo--font-size: var(--digi--typography--title-logo--font-size--mobile);
-  --digi--logo--font-size--large: var(--digi--typography--title-logo--font-size--desktop-large);
-  --digi--logo--font-size--system: var(--digi--typography--title-logo--font-size--mobile);
-  --digi--logo--font-size--system--large: var(--digi--typography--title-logo--font-size--desktop);
-  --digi--logo--font-weight: var(--digi--typography--title-logo--font-weight--desktop);
-  --digi--logo--line-height: #{rem(44)}; // or 1.375
-  --digi--logo--font-family: var(--digi--global--typography--font-family--default);
+@use '../../../global/styles/utilities' as *;
+
+@mixin digi-logo--variables() {
+  --digi--logo--img--min-width: #{rem(256)};
+  --digi--logo--img--max-width:#{rem(312)}; 
+  --digi--logo--img--max-width--large: #{rem(392)};   
+  --digi--logo--img--max-width--system: #{rem(44)}; 
+  
+  --digi--logo--padding: var(--digi--gutter--medium);
+  --digi--logo--padding--wide: var(--digi--gutter--larger);
+  --digi--logo--padding--large: var(--digi--gutter--medium);
+  --digi--logo--padding--large--wide: var(--digi--gutter--larger);
+
+  --digi--logo--color--primary: var(--digi--color--text--secondary);
+  --digi--logo--color--secondary: var(--digi--color--text--inverted);
+
+  --digi--logo--system-name-color--primary: var(--digi--color--text--primary);
+  --digi--logo--system-name-color--secondary: var(--digi--color--text--inverted);
+
+  --digi--logo--color--border--primary: var(--digi--color--text--primary);
+  --digi--logo--color--border--secondary: var(--digi--color--text--inverted);
+
+  --digi--logo--border-width: var(--digi--border-width--primary);
+  --digi--logo--border-width--large: var(--digi--border-width--secondary);
+
+  --digi--logo--margin--system: 0 0 0 var(--digi--gutter--medium);
+  --digi--logo--margin--system--large: 0 0 0 var(--digi--gutter--larger);
+  --digi--logo--padding--system: 0 0 0 var(--digi--gutter--medium);
+  --digi--logo--padding--system--large: 0 0 0 var(--digi--gutter--larger);
+
+  --digi--logo--font-size: var(--digi--typography--title-logo--font-size--mobile);
+  --digi--logo--font-size--large: var(--digi--typography--title-logo--font-size--desktop-large);
+  --digi--logo--font-size--system: var(--digi--typography--title-logo--font-size--mobile);
+  --digi--logo--font-size--system--large: var(--digi--typography--title-logo--font-size--desktop);
+  --digi--logo--font-weight: var(--digi--typography--title-logo--font-weight--desktop);
+  --digi--logo--line-height: #{rem(44)}; // or 1.375
+  --digi--logo--font-family: var(--digi--global--typography--font-family--default);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_navigation-pagination.variables.scss

@@ -1,32 +1,32 @@
-@mixin digi-navigation-pagination--variables() {
-	--digi--navigation-pagination--button--padding: calc(#{var(--digi--gutter--small)} + 1px) var(--digi--gutter--largest-2);
-	--digi--navigation-pagination--button--icon--width: var(--digi--gutter--medium);
-	--digi--navigation-pagination--button--width: 8.750rem;
-	--digi--navigation-pagination--button--margin: 0.125rem;
-	--digi--navigation-pagination--button--display: flex;
-	--digi--navigation-pagination--button--justify-content--default: center;
-	--digi--navigation-pagination--button--keep-right--margin: 8.375rem;
-
-	--digi--navigation-pagination--button--previous-button--border-radius: var(--digi--global--border-radius--base) 0 0 var(--digi--global--border-radius--base);
-	--digi--navigation-pagination--button--next-button--border-radius: 0 var(--digi--global--border-radius--base) var(--digi--global--border-radius--base) 0;
-
-	--digi--navigation-pagination--button--page-button--padding: calc(#{var(--digi--gutter--medium)} - 1px) calc(#{var(--digi--gutter--largest)} - 1px);
-	--digi--navigation-pagination--button--page-button--padding--compressed: calc(#{var(--digi--gutter--medium)} - 1px) calc(#{var(--digi--gutter--medium)} - 1px);
-	--digi--navigation-pagination--button--page-button--margin: 0 2px;
-	--digi--navigation-pagination--button--page-button--width: 2.750rem; //44px
-	--digi--navigation-pagination--button--page-button--height: 2.750rem; //44px
-	// --digi--navigation-pagination--button--page-button--width--compressed: max-content;
-	--digi--navigation-pagination--button--page-button--border-radius: 0;
-
-	--digi--navigation-pagination--pages--margin: 0 0 var(--digi--global--spacing--smallest-4) 0; //4 eller 6px
-
-	--digi--navigation-pagination--result--pages--margin: var(--digi--margin--smaller) 0 0 0;
-	--digi--navigation-pagination--result--margin: 0;
-	--digi--navigation-pagination--result--strong--font-weight: 600;
-	--digi--navigation-pagination--result--text-align: center;
-
-	--digi--navigation-pagination--page-list--padding: 0;
-	--digi--navigation-pagination--page-list--margin: 0;
+@mixin digi-navigation-pagination--variables() {
+	--digi--navigation-pagination--button--padding: calc(#{var(--digi--gutter--small)} + 1px) var(--digi--gutter--largest-2);
+	--digi--navigation-pagination--button--icon--width: var(--digi--gutter--medium);
+	--digi--navigation-pagination--button--width: 8.750rem;
+	--digi--navigation-pagination--button--margin: 0.125rem;
+	--digi--navigation-pagination--button--display: flex;
+	--digi--navigation-pagination--button--justify-content--default: center;
+	--digi--navigation-pagination--button--keep-right--margin: 8.375rem;
+
+	--digi--navigation-pagination--button--previous-button--border-radius: var(--digi--global--border-radius--base) 0 0 var(--digi--global--border-radius--base);
+	--digi--navigation-pagination--button--next-button--border-radius: 0 var(--digi--global--border-radius--base) var(--digi--global--border-radius--base) 0;
+
+	--digi--navigation-pagination--button--page-button--padding: calc(#{var(--digi--gutter--medium)} - 1px) calc(#{var(--digi--gutter--largest)} - 1px);
+	--digi--navigation-pagination--button--page-button--padding--compressed: calc(#{var(--digi--gutter--medium)} - 1px) calc(#{var(--digi--gutter--medium)} - 1px);
+	--digi--navigation-pagination--button--page-button--margin: 0 2px;
+	--digi--navigation-pagination--button--page-button--width: 2.750rem; //44px
+	--digi--navigation-pagination--button--page-button--height: 2.750rem; //44px
+	// --digi--navigation-pagination--button--page-button--width--compressed: max-content;
+	--digi--navigation-pagination--button--page-button--border-radius: 0;
+
+	--digi--navigation-pagination--pages--margin: 0 0 var(--digi--global--spacing--smallest-4) 0; //4 eller 6px
+
+	--digi--navigation-pagination--result--pages--margin: var(--digi--margin--smaller) 0 0 0;
+	--digi--navigation-pagination--result--margin: 0;
+	--digi--navigation-pagination--result--strong--font-weight: 600;
+	--digi--navigation-pagination--result--text-align: center;
+
+	--digi--navigation-pagination--page-list--padding: 0;
+	--digi--navigation-pagination--page-list--margin: 0;
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_notification-alert.variables.scss

@@ -1,32 +1,32 @@
-@mixin digi-notification-alert--variables() {
-  --digi--notification-alert--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
-  --digi--notification-alert--heading--font-size: var(--digi--typography--heading-3--font-size--desktop);
-  --digi--notification-alert--heading--font-size--large: var(--digi--typography--heading-3--font-size--desktop-large);
-  --digi--notification-alert--icon--padding--large: var(--digi--gutter--largest);
-  --digi--notification-alert--icon--padding--medium: var(--digi--gutter--largest);
-  --digi--notification-alert--icon--padding--small: var(--digi--gutter--large);
-  --digi--notification-alert--icon--width--large: 2.25rem;
-  --digi--notification-alert--icon--width--medium: 1.4375rem;
-  --digi--notification-alert--icon--width--small: 1.4375rem;
-  --digi--notification-alert--max-width--large: 100%;
-  --digi--notification-alert--max-width--medium: 31.25rem;
-  --digi--notification-alert--max-width--small: 18.75rem;
-
-  --digi--notification-alert--border--informative: var(--digi--border-width--secondary) solid var(--digi--color--border--informative);
-  --digi--notification-alert--icon--color--informative: var(--digi--color--text--inverted);
-  --digi--notification-alert--icon--background--informative: var(--digi--color--background--informative);
-
-  --digi--notification-alert--border--success: var(--digi--border-width--secondary) solid var(--digi--color--border--success);
-  --digi--notification-alert--icon--color--success: var(--digi--color--text--inverted);
-  --digi--notification-alert--icon--background--success: var(--digi--color--background--success-1);
-
-  --digi--notification-alert--border--warning: var(--digi--border-width--secondary) solid var(--digi--color--border--warning);
-  --digi--notification-alert--icon--color--warning: var(--digi--color--text--primary);
-  --digi--notification-alert--icon--background--warning: var(--digi--color--background--warning-1);
-
-  --digi--notification-alert--border--danger: var(--digi--border-width--secondary) solid var(--digi--color--border--danger);
-  --digi--notification-alert--icon--color--danger: var(--digi--color--text--inverted);
-  --digi--notification-alert--icon--background--danger: var(--digi--color--background--danger-1);
+@mixin digi-notification-alert--variables() {
+  --digi--notification-alert--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
+  --digi--notification-alert--heading--font-size: var(--digi--typography--heading-3--font-size--desktop);
+  --digi--notification-alert--heading--font-size--large: var(--digi--typography--heading-3--font-size--desktop-large);
+  --digi--notification-alert--icon--padding--large: var(--digi--gutter--largest);
+  --digi--notification-alert--icon--padding--medium: var(--digi--gutter--largest);
+  --digi--notification-alert--icon--padding--small: var(--digi--gutter--large);
+  --digi--notification-alert--icon--width--large: 2.25rem;
+  --digi--notification-alert--icon--width--medium: 1.4375rem;
+  --digi--notification-alert--icon--width--small: 1.4375rem;
+  --digi--notification-alert--max-width--large: 100%;
+  --digi--notification-alert--max-width--medium: 31.25rem;
+  --digi--notification-alert--max-width--small: 18.75rem;
+
+  --digi--notification-alert--border--informative: var(--digi--border-width--secondary) solid var(--digi--color--border--informative);
+  --digi--notification-alert--icon--color--informative: var(--digi--color--text--inverted);
+  --digi--notification-alert--icon--background--informative: var(--digi--color--background--informative);
+
+  --digi--notification-alert--border--success: var(--digi--border-width--secondary) solid var(--digi--color--border--success);
+  --digi--notification-alert--icon--color--success: var(--digi--color--text--inverted);
+  --digi--notification-alert--icon--background--success: var(--digi--color--background--success-1);
+
+  --digi--notification-alert--border--warning: var(--digi--border-width--secondary) solid var(--digi--color--border--warning);
+  --digi--notification-alert--icon--color--warning: var(--digi--color--text--primary);
+  --digi--notification-alert--icon--background--warning: var(--digi--color--background--warning-1);
+
+  --digi--notification-alert--border--danger: var(--digi--border-width--secondary) solid var(--digi--color--border--danger);
+  --digi--notification-alert--icon--color--danger: var(--digi--color--text--inverted);
+  --digi--notification-alert--icon--background--danger: var(--digi--color--background--danger-1);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_notification-error-page.variables.scss

@@ -1,12 +1,12 @@
-@use '../../../global/styles/utilities' as *;
-
-@mixin digi-notification-error-page--variables {
-  --digi--notification-error-page--max-width: var(--digi--container-width--larger); 
-  --digi--notification-error-page--gutter: calc(var(--digi--container-gutter--larger) + 3rem);
-  --digi--notification-error-page--padding-top--tablet:238px;
-  --digi--notification-error-page--padding-top--desktop:144px;
-  --digi--notification-error-page--padding-top--mobile:48px;
-
+@use '../../../global/styles/utilities' as *;
+
+@mixin digi-notification-error-page--variables {
+  --digi--notification-error-page--max-width: var(--digi--container-width--larger); 
+  --digi--notification-error-page--gutter: calc(var(--digi--container-gutter--larger) + 3rem);
+  --digi--notification-error-page--padding-top--tablet:238px;
+  --digi--notification-error-page--padding-top--desktop:144px;
+  --digi--notification-error-page--padding-top--mobile:48px;
+
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_progress-indicator.variables.scss

@@ -1,48 +1,48 @@
-@mixin digi-progress-indicator--variables() {
-	--digi--progress-indicator--margin: 0 0 var(--digi--margin--medium);
-	--digi--progress-indicator--label--font-size: var(--digi--typography--label--font-size--desktop);
-	--digi--progress-indicator--label--margin: var(--digi--gutter--medium) 0;
-
-	--digi--progress-indicator--border-color: var(--digi--color--border--neutral-5);
-	--digi--progress-indicator--border-color--active: var(--digi--global--color--function--success--base);
-	--digi--progress-indicator--border-color--secondary--active: var(--digi--color--border--secondary);
-	--digi--progress-indicator--border-width: var(--digi--border-width--primary);
-
-	--digi--progress-indicator--gap: var(--digi--padding--largest);
-	--digi--progress-indicator--gap--medium: var(--digi--padding--largest);
-	--digi--progress-indicator--gap--large: var(--digi--padding--largest-3);
-	--digi--progress-indicator--gap--x-large: var(--digi--padding--largest-3);
-
-	--digi--progress-indicator--heading--font-size: var(--digi--typography--heading-2--font-size--desktop);
-	--digi--progress-indicator--heading--mobile--font-size: var(--digi--typography--heading-2--font-size--mobile);
-	--digi--progress-indicator--heading--font-weight: var(--digi--typography--heading-2--font-weight--desktop);
-	
-
-	--digi--progress-indicator--step--background: var(--digi--color--background--primary);
-	--digi--progress-indicator--step--background--active: var(--digi--global--color--function--success--base);
-	--digi--progress-indicator--step--background--secondary--active: var(--digi--color--background--inverted-1);
-	--digi--progress-indicator--step--size: var(--digi--global--spacing--base);
-	--digi--progress-indicator--step--size--large: 1.625rem;
-	--digi--progress-indicator--step--size--active: 1.625rem;
-	--digi--progress-indicator--step--size--active--large: 1.625rem;
-
-	--digi--progress-indicator--step--line--width: var(--digi--border-width--secondary);
-	--digi--progress-indicator--step--line--color: var(--digi--color--border--neutral-5);
-	--digi--progress-indicator--step--line--color--current: var(--digi--color--border--neutral-5);
-	--digi--progress-indicator--step--line--color--active: var(--digi--global--color--function--success--base);
-	--digi--progress-indicator--step--line--color--secondary--active: var(--digi--color--border--secondary);
-	--digi--progress-indicator--step--line--style: dashed;
-
-
-	--digi--progress-indicator--icon--width: 1rem;
-	--digi--progress-indicator--icon--height: 1rem;
-	--digi--progress-indicator--icon--color: var(--digi--color--text--inverted);
-
-	--digi--progress-indicator--icon-status--width: 1.75rem;
-	--digi--progress-indicator--icon-status--height: 1.75rem;
-	--digi--progress-indicator--icon--warning--color: var(--digi--color--background--warning-1);
-	--digi--progress-indicator--icon--error--color: var(--digi--color--background--danger-1);
-	--digi--progress-indicator--icon--error--background-color: var(--digi--color--background--danger-2);
+@mixin digi-progress-indicator--variables() {
+	--digi--progress-indicator--margin: 0 0 var(--digi--margin--medium);
+	--digi--progress-indicator--label--font-size: var(--digi--typography--label--font-size--desktop);
+	--digi--progress-indicator--label--margin: var(--digi--gutter--medium) 0;
+
+	--digi--progress-indicator--border-color: var(--digi--color--border--neutral-5);
+	--digi--progress-indicator--border-color--active: var(--digi--global--color--function--success--base);
+	--digi--progress-indicator--border-color--secondary--active: var(--digi--color--border--secondary);
+	--digi--progress-indicator--border-width: var(--digi--border-width--primary);
+
+	--digi--progress-indicator--gap: var(--digi--padding--largest);
+	--digi--progress-indicator--gap--medium: var(--digi--padding--largest);
+	--digi--progress-indicator--gap--large: var(--digi--padding--largest-3);
+	--digi--progress-indicator--gap--x-large: var(--digi--padding--largest-3);
+
+	--digi--progress-indicator--heading--font-size: var(--digi--typography--heading-2--font-size--desktop);
+	--digi--progress-indicator--heading--mobile--font-size: var(--digi--typography--heading-2--font-size--mobile);
+	--digi--progress-indicator--heading--font-weight: var(--digi--typography--heading-2--font-weight--desktop);
+	
+
+	--digi--progress-indicator--step--background: var(--digi--color--background--primary);
+	--digi--progress-indicator--step--background--active: var(--digi--global--color--function--success--base);
+	--digi--progress-indicator--step--background--secondary--active: var(--digi--color--background--inverted-1);
+	--digi--progress-indicator--step--size: var(--digi--global--spacing--base);
+	--digi--progress-indicator--step--size--large: 1.625rem;
+	--digi--progress-indicator--step--size--active: 1.625rem;
+	--digi--progress-indicator--step--size--active--large: 1.625rem;
+
+	--digi--progress-indicator--step--line--width: var(--digi--border-width--secondary);
+	--digi--progress-indicator--step--line--color: var(--digi--color--border--neutral-5);
+	--digi--progress-indicator--step--line--color--current: var(--digi--color--border--neutral-5);
+	--digi--progress-indicator--step--line--color--active: var(--digi--global--color--function--success--base);
+	--digi--progress-indicator--step--line--color--secondary--active: var(--digi--color--border--secondary);
+	--digi--progress-indicator--step--line--style: dashed;
+
+
+	--digi--progress-indicator--icon--width: 1rem;
+	--digi--progress-indicator--icon--height: 1rem;
+	--digi--progress-indicator--icon--color: var(--digi--color--text--inverted);
+
+	--digi--progress-indicator--icon-status--width: 1.75rem;
+	--digi--progress-indicator--icon-status--height: 1.75rem;
+	--digi--progress-indicator--icon--warning--color: var(--digi--color--background--warning-1);
+	--digi--progress-indicator--icon--error--color: var(--digi--color--background--danger-1);
+	--digi--progress-indicator--icon--error--background-color: var(--digi--color--background--danger-2);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_progress-list-item.variables.scss

@@ -1,17 +1,17 @@
-@mixin digi-progress-list-item--variables {
-	--digi--progress-list-item--indicator--color--primary: var(--digi--color--background--success-1);
-	--digi--progress-list-item--indicator--color--secondary: var(--digi--color--icons--secondary);
-	--digi--progress-list-item--indicator--color--tertiary: var(--digi--color--border--neutral-5);
-
-	--digi--progress-list-item--heading--font-size: var(--digi--typography--heading-2--font-size--desktop);
-	--digi--progress-list-item--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
-
-	--digi--process-list-item--indicator--border--width: var(--digi--border-width--secondary);
-
-	--digi-process-list-item--toggle--padding: 0 var(--digi--padding--medium);
-
-	--digi--progress-list-item---icon--size: 0.875rem;
-	--digi--progress-list-item--header--toggle-icon--transition: ease-in-out var(--digi--animation--duration--base) all;
+@mixin digi-progress-list-item--variables {
+	--digi--progress-list-item--indicator--color--primary: var(--digi--color--background--success-1);
+	--digi--progress-list-item--indicator--color--secondary: var(--digi--color--icons--secondary);
+	--digi--progress-list-item--indicator--color--tertiary: var(--digi--color--border--neutral-5);
+
+	--digi--progress-list-item--heading--font-size: var(--digi--typography--heading-2--font-size--desktop);
+	--digi--progress-list-item--heading--font-weight: var(--digi--typography--heading-3--font-weight--desktop);
+
+	--digi--process-list-item--indicator--border--width: var(--digi--border-width--secondary);
+
+	--digi-process-list-item--toggle--padding: 0 var(--digi--padding--medium);
+
+	--digi--progress-list-item---icon--size: 0.875rem;
+	--digi--progress-list-item--header--toggle-icon--transition: ease-in-out var(--digi--animation--duration--base) all;
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_progress-list.variables.scss

@@ -1,13 +1,13 @@
-@mixin digi-progress-list--variables {
-	--digi--progress-list--block--element--modifier--primary: var(--digi--brand--design-token);
-	--digi--progress-list--block--element--modifier--secondary: var(--digi--brand--design-token);
-	--digi--progress-list--block--element--modifier--tertiary: var(--digi--brand--design-token);
-
-	--digi--progress-list--content--padding-top: var(--digi--padding--medium);
-	
-	--digi--progress-list--heading--font-size: var(--digi--typography--heading-1--font-size--desktop);
-	--digi--progress-list--heading--font-weight: var(--digi--typography--heading-1--font-weight--desktop);
-	--digi--progress-list--heading--margin-bottom: var(--digi--margin--largest);
+@mixin digi-progress-list--variables {
+	--digi--progress-list--block--element--modifier--primary: var(--digi--brand--design-token);
+	--digi--progress-list--block--element--modifier--secondary: var(--digi--brand--design-token);
+	--digi--progress-list--block--element--modifier--tertiary: var(--digi--brand--design-token);
+
+	--digi--progress-list--content--padding-top: var(--digi--padding--medium);
+	
+	--digi--progress-list--heading--font-size: var(--digi--typography--heading-1--font-size--desktop);
+	--digi--progress-list--heading--font-weight: var(--digi--typography--heading-1--font-weight--desktop);
+	--digi--progress-list--heading--margin-bottom: var(--digi--margin--largest);
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_quote-quote-multi-container.variables.scss

@@ -1,4 +1,4 @@
-@mixin digi-quote-quote-multi-container--variables {
+@mixin digi-quote-quote-multi-container--variables {
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_quote-single.variables.scss

@@ -1,9 +1,9 @@
-@mixin digi-quote-single--variables() {
-  --digi--quote-single--background--primary: var(--digi--color--background--neutral-5);
-	--digi--quote-single--background--secondary: var(--digi--color--background--secondary);
-	--digi--quote-single--background--tertiary: var(--digi--color--background--primary);
-  //--digi--quote-single--border--color: var(--digi--color--border--secondary);
- 
+@mixin digi-quote-single--variables() {
+  --digi--quote-single--background--primary: var(--digi--color--background--neutral-5);
+	--digi--quote-single--background--secondary: var(--digi--color--background--secondary);
+	--digi--quote-single--background--tertiary: var(--digi--color--background--primary);
+  //--digi--quote-single--border--color: var(--digi--color--border--secondary);
+ 
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_tag-media.variables.scss

@@ -1,16 +1,16 @@
-@mixin digi-tag-media--variables {
-
-  --digi--tag-media--background-color: var(--digi--color--background--inverted-3);
-  --digi--tag-media--color--icon: var(--digi--color--text--inverted);
-  --digi--tag-media--width--icon: var(--digi--typography--body--font-size--desktop-large);
-  --digi--tag-media--color--text: var(--digi--color--text--inverted);
-  --digi--tag-media--text--font-weight: var(--digi--typography--description--font-weight--desktop);
-  --digi--tag-media--text--font-size: var(--digi--typography--tag--font-size--desktop);
-  --digi--tag-media--border-radius: var(--digi--global--border-radius--base);
-  --digi--tag-media--padding: 0 var(--digi--gutter--small);
-  --digi--tag-media--margin: var(--digi--gutter--small);
-  --digi--tag-media--height: 1.875rem;
-
+@mixin digi-tag-media--variables {
+
+  --digi--tag-media--background-color: var(--digi--color--background--inverted-3);
+  --digi--tag-media--color--icon: var(--digi--color--text--inverted);
+  --digi--tag-media--width--icon: var(--digi--typography--body--font-size--desktop-large);
+  --digi--tag-media--color--text: var(--digi--color--text--inverted);
+  --digi--tag-media--text--font-weight: var(--digi--typography--description--font-weight--desktop);
+  --digi--tag-media--text--font-size: var(--digi--typography--tag--font-size--desktop);
+  --digi--tag-media--border-radius: var(--digi--global--border-radius--base);
+  --digi--tag-media--padding: 0 var(--digi--gutter--small);
+  --digi--tag-media--margin: var(--digi--gutter--small);
+  --digi--tag-media--height: 1.875rem;
+
 }
 
 /** Do not touch! Autogenerated 

package/dist/collection/design-tokens/components/_tools-feedback-rating.variables.scss

@@ -1,4 +1,4 @@
-@mixin digi-tools-feedback-rating--variables {
+@mixin digi-tools-feedback-rating--variables {
 }
 
 /** Do not touch! Autogenerated