@tui/design-system 5.0.0-beta.1 → 5.0.0-beta.4

package/scss/variables/fonts/_ambit-bold-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: italic;
+	src: url('#{$fontpath}ambit-bold-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_ambit-bold.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: normal;
+	src: url('#{$fontpath}ambit-bold.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_ambit-fallback.scss

@@ -0,0 +1,21 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400 600;
+	font-family: '#{$app-prefix}AmbitFallbackFont';
+	src: local(arial);
+	size-adjust: 103.5%;
+	ascent-override: 83%;
+	descent-override: 18%;
+	line-gap-override: 10.8%;
+}
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}AmbitFallbackFont';
+	src: local('arial bold');
+	size-adjust: 103.5%;
+	ascent-override: 83%;
+	descent-override: 21.2%;
+	line-gap-override: 7.5%;
+}

package/scss/variables/fonts/_ambit-regular-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: italic;
+	src: url('#{$fontpath}ambit-regular-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_ambit-regular.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: normal;
+	src: url('#{$fontpath}ambit-regular.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_ambit-semibold-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 600;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: italic;
+	src: url('#{$fontpath}ambit-semibold-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_ambit-semibold.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 600;
+	font-family: '#{$app-prefix}Ambit';
+	font-style: normal;
+	src: url('#{$fontpath}ambit-semibold.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_brandon-fallback.scss

@@ -0,0 +1,22 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400 700;
+	font-family: '#{$app-prefix}BrandonFallbackFont';
+	src: local('verdana');
+	size-adjust: 85.5%;
+	ascent-override: 110.8%;
+	descent-override: 31.7%;
+	line-gap-override: 19.1%;
+}
+
+@font-face {
+	font-weight: 400 700;
+	font-family: '#{$app-prefix}BrandonFallbackFont';
+	font-style: italic;
+	src: local('verdana italic');
+	size-adjust: 85.5%;
+	ascent-override: 110.8%;
+	descent-override: 31.7%;
+	line-gap-override: 19.1%;
+}

package/scss/variables/fonts/_brandon-medium-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 600 700;
+	font-family: '#{$app-prefix}Brandon';
+	font-style: italic;
+	src: url('#{$fontpath}brandon-medium-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_brandon-medium.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 600 700;
+	font-family: '#{$app-prefix}Brandon';
+	font-style: normal;
+	src: url('#{$fontpath}brandon-medium.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_brandon-regular-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Brandon';
+	font-style: italic;
+	src: url('#{$fontpath}brandon-regular-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_brandon-regular.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Brandon';
+	font-style: normal;
+	src: url('#{$fontpath}brandon-regular.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_font-path.scss

@@ -0,0 +1,3 @@
+@use '../../variables/env-variables' as *;
+
+$fontpath: '#{$uilib-assets-base-url}v3/fonts/' !default;

package/scss/variables/fonts/_graphie-extralight.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Graphie';
+	font-style: normal;
+	src: url('#{$fontpath}graphie-extralight.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_graphie-fallback.scss

@@ -0,0 +1,11 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}GraphieFallbackFont';
+	src: local(verdana);
+	size-adjust: 87.5%;
+	ascent-override: 98%;
+	descent-override: 26.1%;
+	line-gap-override: 7.2%;
+}

package/scss/variables/fonts/_pastiche-grotesque-black.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400 900;
+	font-family: '#{$app-prefix}PasticheGrotesque';
+	font-style: normal;
+	src: url('#{$fontpath}pastiche-grotesque-black.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_pastiche-grotesque-fallback.scss

@@ -0,0 +1,11 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400 900;
+	font-family: '#{$app-prefix}PasticheGrotesqueFallbackFont';
+	src: local('arial black');
+	size-adjust: 92%;
+	ascent-override: 95.5%;
+	descent-override: 22.6%;
+	line-gap-override: 12.7%;
+}

package/scss/variables/fonts/_rondelle-black.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 700 900;
+	font-family: '#{$app-prefix}Rondelle';
+	font-style: normal;
+	src: url('#{$fontpath}rondelle-black.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_rondelle-book.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}Rondelle';
+	font-style: normal;
+	src: url('#{$fontpath}rondelle-book.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_rondelle-fallback.scss

@@ -0,0 +1,21 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}RondelleFallbackFont';
+	src: local('verdana');
+	size-adjust: 95%;
+	ascent-override: 81.6%;
+	descent-override: 23.2%;
+	line-gap-override: 24%;
+}
+
+@font-face {
+	font-weight: 700 900;
+	font-family: '#{$app-prefix}RondelleFallbackFont';
+	src: local('arial black');
+	size-adjust: 90%;
+	ascent-override: 81.5%;
+	descent-override: 30.1%;
+	line-gap-override: 25.3%;
+}

package/scss/variables/fonts/_tuitypelight-bold-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}TUITypeLight';
+	font-style: italic;
+	src: url('#{$fontpath}tuitypelight-bold-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_tuitypelight-bold.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}TUITypeLight';
+	font-style: normal;
+	src: url('#{$fontpath}tuitypelight-bold.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_tuitypelight-fallback.scss

@@ -0,0 +1,21 @@
+@use '../prefix' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}TUITypeLightFallbackFont';
+	src: local(arial);
+	size-adjust: 84.5%;
+	ascent-override: 101.1%;
+	descent-override: 16.5%;
+	line-gap-override: 17.5%;
+}
+
+@font-face {
+	font-weight: 700;
+	font-family: '#{$app-prefix}TUITypeLightFallbackFont';
+	src: local('arial bold');
+	size-adjust: 84.5%;
+	ascent-override: 101.1%;
+	descent-override: 16.5%;
+	line-gap-override: 17.5%;
+}

package/scss/variables/fonts/_tuitypelight-regular-italic.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}TUITypeLight';
+	font-style: italic;
+	src: url('#{$fontpath}tuitypelight-regular-italic.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables/fonts/_tuitypelight-regular.scss

@@ -0,0 +1,10 @@
+@use '../prefix' as *;
+@use './font-path' as *;
+
+@font-face {
+	font-weight: 400;
+	font-family: '#{$app-prefix}TUITypeLight';
+	font-style: normal;
+	src: url('#{$fontpath}tuitypelight-regular.subset.woff2') format('woff2');
+	font-display: swap;
+}

package/scss/variables.scss

@@ -0,0 +1,57 @@
+// root variables
+@forward 'variables/prefix';
+@forward 'variables/env-variables';
+@forward 'variables/aspect-ratios';
+@forward 'variables/assets';
+@forward 'variables/border-radius';
+@forward 'variables/colors';
+@forward 'variables/breakpoints';
+@forward 'variables/elevations';
+@forward 'variables/focus';
+@forward 'variables/grid';
+@forward 'variables/icons';
+@forward 'variables/layers';
+@forward 'variables/motion';
+@forward 'variables/spacing';
+@forward 'variables/strokes';
+@forward 'variables/typography';
+
+// component variables
+@forward 'lib/accordion/variables';
+@forward 'lib/active-tag/variables';
+@forward 'lib/breadcrumb/variables';
+@forward 'lib/alert/variables';
+@forward 'lib/button/variables';
+@forward 'lib/cards/card/variables';
+@forward 'lib/cards/search/variables';
+@forward 'lib/divider/variables';
+@forward 'lib/forms/form-row/variables';
+@forward 'lib/forms/input-checkbox/variables';
+@forward 'lib/forms/input-chip/variables';
+@forward 'lib/forms/input-count/variables';
+@forward 'lib/forms/input-radio/variables';
+@forward 'lib/forms/input-stepper/variables';
+@forward 'lib/forms/input-slider/variables';
+@forward 'lib/forms/input-text/variables';
+@forward 'lib/grid/variables';
+@forward 'lib/icon/variables';
+@forward 'lib/icon-button/variables';
+@forward 'lib/image/variables';
+@forward 'lib/info-tag/variables';
+@forward 'lib/link/variables';
+@forward 'lib/list/variables';
+@forward 'lib/loader/variables';
+@forward 'lib/media-button/variables';
+@forward 'lib/modal/variables';
+@forward 'lib/pagination/variables';
+@forward 'lib/price/variables';
+@forward 'lib/promo-tag/variables';
+@forward 'lib/ratings-reviews/numerical/variables';
+@forward 'lib/ratings-reviews/percentage/variables';
+@forward 'lib/ratings-reviews/range-bar/variables';
+@forward 'lib/ratings-reviews/range-icons/variables';
+@forward 'lib/scroller/variables';
+@forward 'lib/show-more-less/variables';
+@forward 'lib/skeleton/variables';
+@forward 'lib/tooltip/variables';
+@forward 'lib/typography/variables';