@kickstartds/ds-agency-premium 1.6.49 → 1.6.51
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/mosaic/mosaic.css +3 -0
- package/dist/components/page-wrapper/tokens.css +36 -12
- package/dist/components/section/section.css +3 -0
- package/dist/global.css +3 -10
- package/dist/tokens/themes.css +4 -4
- package/dist/tokens/tokens.css +36 -12
- package/dist/tokens/tokens.js +23 -12
- package/package.json +1 -1
|
@@ -23,6 +23,9 @@
|
|
|
23
23
|
font: var(--dsa-mosaic__copy--font, var(--dsa-rich-text--font, var(--ks-font-copy-m)));
|
|
24
24
|
color: var(--dsa-mosaic__copy--color, var(--dsa-rich-text--color, var(--ks-text-color-copy)));
|
|
25
25
|
}
|
|
26
|
+
.dsa-mosaic .c-storytelling__box__content {
|
|
27
|
+
max-width: var(--dsa-content--width_narrow);
|
|
28
|
+
}
|
|
26
29
|
.dsa-mosaic .c-storytelling__box__content[style^=color] .dsa-headline__headline,
|
|
27
30
|
.dsa-mosaic .c-storytelling__box__content[style^=color] .dsa-headline__subheadline {
|
|
28
31
|
color: inherit;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri, 20 Dec 2024
|
|
3
|
+
* Generated on Fri, 20 Dec 2024 12:59:19 GMT
|
|
4
4
|
*/
|
|
5
5
|
:root, [ks-theme] {
|
|
6
6
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -744,35 +744,40 @@
|
|
|
744
744
|
--ks-spacing-xxs-bp-factor-tablet: 1.5006;
|
|
745
745
|
--ks-spacing-xxs-bp-factor-laptop: 1.8383;
|
|
746
746
|
--ks-spacing-xxs-bp-factor-desktop: 2.2519;
|
|
747
|
-
--ks-spacing-xxs-bp-factor-
|
|
747
|
+
--ks-spacing-xxs-bp-factor-widescreen: 2.5;
|
|
748
|
+
--ks-spacing-xxs-bp-factor-tv: 3;
|
|
748
749
|
--ks-spacing-xs: var(--ks-spacing-xs-base);
|
|
749
750
|
--ks-spacing-xs-base: 0.4309rem;
|
|
750
751
|
--ks-spacing-xs-bp-factor-phone: 1.225;
|
|
751
752
|
--ks-spacing-xs-bp-factor-tablet: 1.5006;
|
|
752
753
|
--ks-spacing-xs-bp-factor-laptop: 1.8383;
|
|
753
754
|
--ks-spacing-xs-bp-factor-desktop: 2.2519;
|
|
754
|
-
--ks-spacing-xs-bp-factor-
|
|
755
|
+
--ks-spacing-xs-bp-factor-widescreen: 2.5;
|
|
756
|
+
--ks-spacing-xs-bp-factor-tv: 3;
|
|
755
757
|
--ks-spacing-s: var(--ks-spacing-s-base);
|
|
756
758
|
--ks-spacing-s-base: 0.614rem;
|
|
757
759
|
--ks-spacing-s-bp-factor-phone: 1.225;
|
|
758
760
|
--ks-spacing-s-bp-factor-tablet: 1.5006;
|
|
759
761
|
--ks-spacing-s-bp-factor-laptop: 1.8383;
|
|
760
762
|
--ks-spacing-s-bp-factor-desktop: 2.2519;
|
|
761
|
-
--ks-spacing-s-bp-factor-
|
|
763
|
+
--ks-spacing-s-bp-factor-widescreen: 2.5;
|
|
764
|
+
--ks-spacing-s-bp-factor-tv: 3;
|
|
762
765
|
--ks-spacing-m: var(--ks-spacing-m-base);
|
|
763
766
|
--ks-spacing-m-base: 0.875rem;
|
|
764
767
|
--ks-spacing-m-bp-factor-phone: 1.225;
|
|
765
768
|
--ks-spacing-m-bp-factor-tablet: 1.5006;
|
|
766
769
|
--ks-spacing-m-bp-factor-laptop: 1.8383;
|
|
767
770
|
--ks-spacing-m-bp-factor-desktop: 2.2519;
|
|
768
|
-
--ks-spacing-m-bp-factor-
|
|
771
|
+
--ks-spacing-m-bp-factor-widescreen: 2.5;
|
|
772
|
+
--ks-spacing-m-bp-factor-tv: 3;
|
|
769
773
|
--ks-spacing-l: var(--ks-spacing-l-base);
|
|
770
774
|
--ks-spacing-l-base: 1.2469rem;
|
|
771
775
|
--ks-spacing-l-bp-factor-phone: 1.225;
|
|
772
776
|
--ks-spacing-l-bp-factor-tablet: 1.5006;
|
|
773
777
|
--ks-spacing-l-bp-factor-laptop: 1.8383;
|
|
774
778
|
--ks-spacing-l-bp-factor-desktop: 2.2519;
|
|
775
|
-
--ks-spacing-l-bp-factor-
|
|
779
|
+
--ks-spacing-l-bp-factor-widescreen: 2.5;
|
|
780
|
+
--ks-spacing-l-bp-factor-tv: 3;
|
|
776
781
|
--ks-spacing-xl: var(--ks-spacing-xl-base);
|
|
777
782
|
--ks-spacing-xl-base: 1.7768rem;
|
|
778
783
|
--ks-spacing-xl-bp-factor-phone: 1.225;
|
|
@@ -786,7 +791,8 @@
|
|
|
786
791
|
--ks-spacing-xxl-bp-factor-tablet: 1.5006;
|
|
787
792
|
--ks-spacing-xxl-bp-factor-laptop: 1.8383;
|
|
788
793
|
--ks-spacing-xxl-bp-factor-desktop: 2.2519;
|
|
789
|
-
--ks-spacing-xxl-bp-factor-
|
|
794
|
+
--ks-spacing-xxl-bp-factor-widescreen: 2.5;
|
|
795
|
+
--ks-spacing-xxl-bp-factor-tv: 3;
|
|
790
796
|
--ks-spacing-stack-xs: var(--ks-spacing-xs);
|
|
791
797
|
--ks-spacing-stack-s: var(--ks-spacing-s);
|
|
792
798
|
--ks-spacing-stack-m: var(--ks-spacing-m);
|
|
@@ -947,7 +953,8 @@
|
|
|
947
953
|
--ks-font-size-display-bp-factor-tablet: 1.5;
|
|
948
954
|
--ks-font-size-display-bp-factor-laptop: 1.5;
|
|
949
955
|
--ks-font-size-display-bp-factor-desktop: 1.75;
|
|
950
|
-
--ks-font-size-display-bp-factor-
|
|
956
|
+
--ks-font-size-display-bp-factor-widescreen: 2.25;
|
|
957
|
+
--ks-font-size-display-bp-factor-tv: 2.75;
|
|
951
958
|
--ks-font-size-display-xxs-base: 0.68rem;
|
|
952
959
|
--ks-font-size-display-xs-base: 0.833rem;
|
|
953
960
|
--ks-font-size-display-s-base: 1.0204rem;
|
|
@@ -956,7 +963,8 @@
|
|
|
956
963
|
--ks-font-size-display-xl-base: 1.8758rem;
|
|
957
964
|
--ks-font-size-display-xxl-base: 2.2978rem;
|
|
958
965
|
--ks-font-size-copy-bp-factor-tablet: 1.125;
|
|
959
|
-
--ks-font-size-copy-bp-factor-
|
|
966
|
+
--ks-font-size-copy-bp-factor-widescreen: 1.35;
|
|
967
|
+
--ks-font-size-copy-bp-factor-tv: 1.65;
|
|
960
968
|
--ks-font-size-copy-xxs-base: 0.612rem;
|
|
961
969
|
--ks-font-size-copy-xs-base: 0.7497rem;
|
|
962
970
|
--ks-font-size-copy-s-base: 0.9184rem;
|
|
@@ -965,7 +973,8 @@
|
|
|
965
973
|
--ks-font-size-copy-xl-base: 1.6882rem;
|
|
966
974
|
--ks-font-size-copy-xxl-base: 2.068rem;
|
|
967
975
|
--ks-font-size-interface-bp-factor-tablet: 1.125;
|
|
968
|
-
--ks-font-size-interface-bp-factor-
|
|
976
|
+
--ks-font-size-interface-bp-factor-widescreen: 1.35;
|
|
977
|
+
--ks-font-size-interface-bp-factor-tv: 1.65;
|
|
969
978
|
--ks-font-size-interface-xxs-base: 0.544rem;
|
|
970
979
|
--ks-font-size-interface-xs-base: 0.6664rem;
|
|
971
980
|
--ks-font-size-interface-s-base: 0.8163rem;
|
|
@@ -974,7 +983,8 @@
|
|
|
974
983
|
--ks-font-size-interface-xl-base: 1.5006rem;
|
|
975
984
|
--ks-font-size-interface-xxl-base: 1.8383rem;
|
|
976
985
|
--ks-font-size-mono-bp-factor-tablet: 1.125;
|
|
977
|
-
--ks-font-size-mono-bp-factor-
|
|
986
|
+
--ks-font-size-mono-bp-factor-widescreen: 1.35;
|
|
987
|
+
--ks-font-size-mono-bp-factor-tv: 1.65;
|
|
978
988
|
--ks-font-size-mono-xxs-base: 0.612rem;
|
|
979
989
|
--ks-font-size-mono-xs-base: 0.7497rem;
|
|
980
990
|
--ks-font-size-mono-s-base: 0.9184rem;
|
|
@@ -1080,7 +1090,7 @@
|
|
|
1080
1090
|
--ks-spacing-inset: calc(var(--ks-spacing-inset-base) * var(--ks-spacing-inset-bp-factor, 1));
|
|
1081
1091
|
--ks-spacing-inset-squish: calc(var(--ks-spacing-inset-squish-base) * var(--ks-spacing-inset-squish-bp-factor, 1));
|
|
1082
1092
|
--ks-spacing-inset-stretch: calc(var(--ks-spacing-inset-stretch-base) * var(--ks-spacing-inset-stretch-bp-factor, 1));
|
|
1083
|
-
--ks-breakpoints: '{"phone":"36em","tablet":"48em","laptop":"62em","desktop":"75em","
|
|
1093
|
+
--ks-breakpoints: '{"phone":"36em","tablet":"48em","laptop":"62em","desktop":"75em","widescreen":"122em","tv":"162em"}';
|
|
1084
1094
|
}
|
|
1085
1095
|
|
|
1086
1096
|
:root, [ks-theme], [ks-inverted=false] {
|
|
@@ -2742,6 +2752,20 @@
|
|
|
2742
2752
|
}
|
|
2743
2753
|
}
|
|
2744
2754
|
@media (min-width: 122em) {
|
|
2755
|
+
:root {
|
|
2756
|
+
--ks-font-size-display-bp-factor: var(--ks-font-size-display-bp-factor-widescreen);
|
|
2757
|
+
--ks-font-size-copy-bp-factor: var(--ks-font-size-copy-bp-factor-widescreen);
|
|
2758
|
+
--ks-font-size-interface-bp-factor: var(--ks-font-size-interface-bp-factor-widescreen);
|
|
2759
|
+
--ks-font-size-mono-bp-factor: var(--ks-font-size-mono-bp-factor-widescreen);
|
|
2760
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-widescreen);
|
|
2761
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-widescreen);
|
|
2762
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-widescreen);
|
|
2763
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-widescreen);
|
|
2764
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-widescreen);
|
|
2765
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-widescreen);
|
|
2766
|
+
}
|
|
2767
|
+
}
|
|
2768
|
+
@media (min-width: 162em) {
|
|
2745
2769
|
:root {
|
|
2746
2770
|
--ks-font-size-display-bp-factor: var(--ks-font-size-display-bp-factor-tv);
|
|
2747
2771
|
--ks-font-size-copy-bp-factor: var(--ks-font-size-copy-bp-factor-tv);
|
|
@@ -116,6 +116,9 @@
|
|
|
116
116
|
background-color: var(--dsa-section--background-color_default, var(--ks-color-bg));
|
|
117
117
|
position: relative;
|
|
118
118
|
}
|
|
119
|
+
.l-section.dsa-section .l-section__container {
|
|
120
|
+
font: var(--ks-font-copy-m);
|
|
121
|
+
}
|
|
119
122
|
.l-section.dsa-section.l-section--gutter-large {
|
|
120
123
|
--l-section--gutter: var(--dsa-section--gutter_large);
|
|
121
124
|
}
|
package/dist/global.css
CHANGED
|
@@ -305,9 +305,9 @@ h3 {
|
|
|
305
305
|
--dsa-link--text-decoration_hover: underline;
|
|
306
306
|
--dsa-gradient--highlight: linear-gradient(135deg, var(--ks-color-primary) 0%, var(--ks-color-secondary) 100%);
|
|
307
307
|
--dsa-content--spacing: var(--ks-spacing-inset-l);
|
|
308
|
-
--dsa-content--width_narrow:
|
|
309
|
-
--dsa-content--width_default:
|
|
310
|
-
--dsa-content--width_wide:
|
|
308
|
+
--dsa-content--width_narrow: 34em;
|
|
309
|
+
--dsa-content--width_default: 50em;
|
|
310
|
+
--dsa-content--width_wide: 64em;
|
|
311
311
|
--dsa-content--width_max: 100vw;
|
|
312
312
|
--dsa-content--width_full: 100vw;
|
|
313
313
|
--dsa-logo--height: 2.25rem;
|
|
@@ -318,13 +318,6 @@ h3 {
|
|
|
318
318
|
--dsa-content--spacing: var(--ks-spacing-inset-xl);
|
|
319
319
|
}
|
|
320
320
|
}
|
|
321
|
-
@media (min-width: 122em) {
|
|
322
|
-
:root, [ks-inverted], [ks-theme] {
|
|
323
|
-
--dsa-content--width_narrow: 35vw;
|
|
324
|
-
--dsa-content--width_default: 45vw;
|
|
325
|
-
--dsa-content--width_wide: 55vw;
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
321
|
@media (min-width: 48em) {
|
|
329
322
|
:root, [ks-inverted], [ks-theme] {
|
|
330
323
|
--dsa-logo--height: 2.5rem;
|
package/dist/tokens/themes.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri, 20 Dec 2024
|
|
3
|
+
* Generated on Fri, 20 Dec 2024 12:59:22 GMT
|
|
4
4
|
*/
|
|
5
5
|
:root [ks-theme=business] {
|
|
6
6
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -2727,7 +2727,7 @@
|
|
|
2727
2727
|
}
|
|
2728
2728
|
/**
|
|
2729
2729
|
* Do not edit directly
|
|
2730
|
-
* Generated on Fri, 20 Dec 2024
|
|
2730
|
+
* Generated on Fri, 20 Dec 2024 12:59:26 GMT
|
|
2731
2731
|
*/
|
|
2732
2732
|
:root [ks-theme=google] {
|
|
2733
2733
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -5458,7 +5458,7 @@
|
|
|
5458
5458
|
}
|
|
5459
5459
|
/**
|
|
5460
5460
|
* Do not edit directly
|
|
5461
|
-
* Generated on Fri, 20 Dec 2024
|
|
5461
|
+
* Generated on Fri, 20 Dec 2024 12:59:24 GMT
|
|
5462
5462
|
*/
|
|
5463
5463
|
:root [ks-theme=ngo] {
|
|
5464
5464
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
|
@@ -8459,7 +8459,7 @@
|
|
|
8459
8459
|
}
|
|
8460
8460
|
/**
|
|
8461
8461
|
* Do not edit directly
|
|
8462
|
-
* Generated on Fri, 20 Dec 2024
|
|
8462
|
+
* Generated on Fri, 20 Dec 2024 12:59:28 GMT
|
|
8463
8463
|
*/
|
|
8464
8464
|
:root [ks-theme=telekom] {
|
|
8465
8465
|
--ks-background-color-accent-base: var(--ks-color-primary-to-bg-8-base);
|
package/dist/tokens/tokens.css
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri, 20 Dec 2024
|
|
3
|
+
* Generated on Fri, 20 Dec 2024 12:59:19 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
:root, [ks-theme] {
|
|
@@ -745,35 +745,40 @@
|
|
|
745
745
|
--ks-spacing-xxs-bp-factor-tablet: 1.5006;
|
|
746
746
|
--ks-spacing-xxs-bp-factor-laptop: 1.8383;
|
|
747
747
|
--ks-spacing-xxs-bp-factor-desktop: 2.2519;
|
|
748
|
-
--ks-spacing-xxs-bp-factor-
|
|
748
|
+
--ks-spacing-xxs-bp-factor-widescreen: 2.5;
|
|
749
|
+
--ks-spacing-xxs-bp-factor-tv: 3;
|
|
749
750
|
--ks-spacing-xs: var(--ks-spacing-xs-base);
|
|
750
751
|
--ks-spacing-xs-base: 0.4309rem;
|
|
751
752
|
--ks-spacing-xs-bp-factor-phone: 1.225;
|
|
752
753
|
--ks-spacing-xs-bp-factor-tablet: 1.5006;
|
|
753
754
|
--ks-spacing-xs-bp-factor-laptop: 1.8383;
|
|
754
755
|
--ks-spacing-xs-bp-factor-desktop: 2.2519;
|
|
755
|
-
--ks-spacing-xs-bp-factor-
|
|
756
|
+
--ks-spacing-xs-bp-factor-widescreen: 2.5;
|
|
757
|
+
--ks-spacing-xs-bp-factor-tv: 3;
|
|
756
758
|
--ks-spacing-s: var(--ks-spacing-s-base);
|
|
757
759
|
--ks-spacing-s-base: 0.614rem;
|
|
758
760
|
--ks-spacing-s-bp-factor-phone: 1.225;
|
|
759
761
|
--ks-spacing-s-bp-factor-tablet: 1.5006;
|
|
760
762
|
--ks-spacing-s-bp-factor-laptop: 1.8383;
|
|
761
763
|
--ks-spacing-s-bp-factor-desktop: 2.2519;
|
|
762
|
-
--ks-spacing-s-bp-factor-
|
|
764
|
+
--ks-spacing-s-bp-factor-widescreen: 2.5;
|
|
765
|
+
--ks-spacing-s-bp-factor-tv: 3;
|
|
763
766
|
--ks-spacing-m: var(--ks-spacing-m-base);
|
|
764
767
|
--ks-spacing-m-base: 0.875rem;
|
|
765
768
|
--ks-spacing-m-bp-factor-phone: 1.225;
|
|
766
769
|
--ks-spacing-m-bp-factor-tablet: 1.5006;
|
|
767
770
|
--ks-spacing-m-bp-factor-laptop: 1.8383;
|
|
768
771
|
--ks-spacing-m-bp-factor-desktop: 2.2519;
|
|
769
|
-
--ks-spacing-m-bp-factor-
|
|
772
|
+
--ks-spacing-m-bp-factor-widescreen: 2.5;
|
|
773
|
+
--ks-spacing-m-bp-factor-tv: 3;
|
|
770
774
|
--ks-spacing-l: var(--ks-spacing-l-base);
|
|
771
775
|
--ks-spacing-l-base: 1.2469rem;
|
|
772
776
|
--ks-spacing-l-bp-factor-phone: 1.225;
|
|
773
777
|
--ks-spacing-l-bp-factor-tablet: 1.5006;
|
|
774
778
|
--ks-spacing-l-bp-factor-laptop: 1.8383;
|
|
775
779
|
--ks-spacing-l-bp-factor-desktop: 2.2519;
|
|
776
|
-
--ks-spacing-l-bp-factor-
|
|
780
|
+
--ks-spacing-l-bp-factor-widescreen: 2.5;
|
|
781
|
+
--ks-spacing-l-bp-factor-tv: 3;
|
|
777
782
|
--ks-spacing-xl: var(--ks-spacing-xl-base);
|
|
778
783
|
--ks-spacing-xl-base: 1.7768rem;
|
|
779
784
|
--ks-spacing-xl-bp-factor-phone: 1.225;
|
|
@@ -787,7 +792,8 @@
|
|
|
787
792
|
--ks-spacing-xxl-bp-factor-tablet: 1.5006;
|
|
788
793
|
--ks-spacing-xxl-bp-factor-laptop: 1.8383;
|
|
789
794
|
--ks-spacing-xxl-bp-factor-desktop: 2.2519;
|
|
790
|
-
--ks-spacing-xxl-bp-factor-
|
|
795
|
+
--ks-spacing-xxl-bp-factor-widescreen: 2.5;
|
|
796
|
+
--ks-spacing-xxl-bp-factor-tv: 3;
|
|
791
797
|
--ks-spacing-stack-xs: var(--ks-spacing-xs);
|
|
792
798
|
--ks-spacing-stack-s: var(--ks-spacing-s);
|
|
793
799
|
--ks-spacing-stack-m: var(--ks-spacing-m);
|
|
@@ -948,7 +954,8 @@
|
|
|
948
954
|
--ks-font-size-display-bp-factor-tablet: 1.5;
|
|
949
955
|
--ks-font-size-display-bp-factor-laptop: 1.5;
|
|
950
956
|
--ks-font-size-display-bp-factor-desktop: 1.75;
|
|
951
|
-
--ks-font-size-display-bp-factor-
|
|
957
|
+
--ks-font-size-display-bp-factor-widescreen: 2.25;
|
|
958
|
+
--ks-font-size-display-bp-factor-tv: 2.75;
|
|
952
959
|
--ks-font-size-display-xxs-base: 0.68rem;
|
|
953
960
|
--ks-font-size-display-xs-base: 0.833rem;
|
|
954
961
|
--ks-font-size-display-s-base: 1.0204rem;
|
|
@@ -957,7 +964,8 @@
|
|
|
957
964
|
--ks-font-size-display-xl-base: 1.8758rem;
|
|
958
965
|
--ks-font-size-display-xxl-base: 2.2978rem;
|
|
959
966
|
--ks-font-size-copy-bp-factor-tablet: 1.125;
|
|
960
|
-
--ks-font-size-copy-bp-factor-
|
|
967
|
+
--ks-font-size-copy-bp-factor-widescreen: 1.35;
|
|
968
|
+
--ks-font-size-copy-bp-factor-tv: 1.65;
|
|
961
969
|
--ks-font-size-copy-xxs-base: 0.612rem;
|
|
962
970
|
--ks-font-size-copy-xs-base: 0.7497rem;
|
|
963
971
|
--ks-font-size-copy-s-base: 0.9184rem;
|
|
@@ -966,7 +974,8 @@
|
|
|
966
974
|
--ks-font-size-copy-xl-base: 1.6882rem;
|
|
967
975
|
--ks-font-size-copy-xxl-base: 2.068rem;
|
|
968
976
|
--ks-font-size-interface-bp-factor-tablet: 1.125;
|
|
969
|
-
--ks-font-size-interface-bp-factor-
|
|
977
|
+
--ks-font-size-interface-bp-factor-widescreen: 1.35;
|
|
978
|
+
--ks-font-size-interface-bp-factor-tv: 1.65;
|
|
970
979
|
--ks-font-size-interface-xxs-base: 0.544rem;
|
|
971
980
|
--ks-font-size-interface-xs-base: 0.6664rem;
|
|
972
981
|
--ks-font-size-interface-s-base: 0.8163rem;
|
|
@@ -975,7 +984,8 @@
|
|
|
975
984
|
--ks-font-size-interface-xl-base: 1.5006rem;
|
|
976
985
|
--ks-font-size-interface-xxl-base: 1.8383rem;
|
|
977
986
|
--ks-font-size-mono-bp-factor-tablet: 1.125;
|
|
978
|
-
--ks-font-size-mono-bp-factor-
|
|
987
|
+
--ks-font-size-mono-bp-factor-widescreen: 1.35;
|
|
988
|
+
--ks-font-size-mono-bp-factor-tv: 1.65;
|
|
979
989
|
--ks-font-size-mono-xxs-base: 0.612rem;
|
|
980
990
|
--ks-font-size-mono-xs-base: 0.7497rem;
|
|
981
991
|
--ks-font-size-mono-s-base: 0.9184rem;
|
|
@@ -1081,7 +1091,7 @@
|
|
|
1081
1091
|
--ks-spacing-inset: calc(var(--ks-spacing-inset-base) * var(--ks-spacing-inset-bp-factor, 1));
|
|
1082
1092
|
--ks-spacing-inset-squish: calc(var(--ks-spacing-inset-squish-base) * var(--ks-spacing-inset-squish-bp-factor, 1));
|
|
1083
1093
|
--ks-spacing-inset-stretch: calc(var(--ks-spacing-inset-stretch-base) * var(--ks-spacing-inset-stretch-bp-factor, 1));
|
|
1084
|
-
--ks-breakpoints: '{"phone":"36em","tablet":"48em","laptop":"62em","desktop":"75em","
|
|
1094
|
+
--ks-breakpoints: '{"phone":"36em","tablet":"48em","laptop":"62em","desktop":"75em","widescreen":"122em","tv":"162em"}';
|
|
1085
1095
|
}
|
|
1086
1096
|
:root, [ks-theme], [ks-inverted=false] {
|
|
1087
1097
|
--ks-background-color-accent: var(--ks-background-color-accent-base);
|
|
@@ -2740,6 +2750,20 @@
|
|
|
2740
2750
|
}
|
|
2741
2751
|
}
|
|
2742
2752
|
@media (min-width: 122em) {
|
|
2753
|
+
:root {
|
|
2754
|
+
--ks-font-size-display-bp-factor: var(--ks-font-size-display-bp-factor-widescreen);
|
|
2755
|
+
--ks-font-size-copy-bp-factor: var(--ks-font-size-copy-bp-factor-widescreen);
|
|
2756
|
+
--ks-font-size-interface-bp-factor: var(--ks-font-size-interface-bp-factor-widescreen);
|
|
2757
|
+
--ks-font-size-mono-bp-factor: var(--ks-font-size-mono-bp-factor-widescreen);
|
|
2758
|
+
--ks-spacing-xxs-bp-factor: var(--ks-spacing-xxs-bp-factor-widescreen);
|
|
2759
|
+
--ks-spacing-xs-bp-factor: var(--ks-spacing-xs-bp-factor-widescreen);
|
|
2760
|
+
--ks-spacing-s-bp-factor: var(--ks-spacing-s-bp-factor-widescreen);
|
|
2761
|
+
--ks-spacing-m-bp-factor: var(--ks-spacing-m-bp-factor-widescreen);
|
|
2762
|
+
--ks-spacing-l-bp-factor: var(--ks-spacing-l-bp-factor-widescreen);
|
|
2763
|
+
--ks-spacing-xxl-bp-factor: var(--ks-spacing-xxl-bp-factor-widescreen);
|
|
2764
|
+
}
|
|
2765
|
+
}
|
|
2766
|
+
@media (min-width: 162em) {
|
|
2743
2767
|
:root {
|
|
2744
2768
|
--ks-font-size-display-bp-factor: var(--ks-font-size-display-bp-factor-tv);
|
|
2745
2769
|
--ks-font-size-copy-bp-factor: var(--ks-font-size-copy-bp-factor-tv);
|
package/dist/tokens/tokens.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly
|
|
3
|
-
* Generated on Fri, 20 Dec 2024
|
|
3
|
+
* Generated on Fri, 20 Dec 2024 12:59:20 GMT
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
export const KsBackgroundColorAccentBase = "#230a2b";
|
|
@@ -272,7 +272,8 @@ export const KsBreakpointPhone = "36em";
|
|
|
272
272
|
export const KsBreakpointTablet = "48em";
|
|
273
273
|
export const KsBreakpointLaptop = "62em";
|
|
274
274
|
export const KsBreakpointDesktop = "75em";
|
|
275
|
-
export const
|
|
275
|
+
export const KsBreakpointWidescreen = "122em";
|
|
276
|
+
export const KsBreakpointTv = "162em";
|
|
276
277
|
export const KsColorFgBase = "#ffffff";
|
|
277
278
|
export const KsColorFgAlpha1Base = "rgba(255, 255, 255, 0.95)";
|
|
278
279
|
export const KsColorFgAlpha2Base = "rgba(255, 255, 255, 0.87)";
|
|
@@ -749,35 +750,40 @@ export const KsSpacingXxsBpFactorPhone = "1.225";
|
|
|
749
750
|
export const KsSpacingXxsBpFactorTablet = "1.5006";
|
|
750
751
|
export const KsSpacingXxsBpFactorLaptop = "1.8383";
|
|
751
752
|
export const KsSpacingXxsBpFactorDesktop = "2.2519";
|
|
752
|
-
export const
|
|
753
|
+
export const KsSpacingXxsBpFactorWidescreen = "2.5";
|
|
754
|
+
export const KsSpacingXxsBpFactorTv = "3";
|
|
753
755
|
export const KsSpacingXs = "0.4309rem";
|
|
754
756
|
export const KsSpacingXsBase = "0.4309rem";
|
|
755
757
|
export const KsSpacingXsBpFactorPhone = "1.225";
|
|
756
758
|
export const KsSpacingXsBpFactorTablet = "1.5006";
|
|
757
759
|
export const KsSpacingXsBpFactorLaptop = "1.8383";
|
|
758
760
|
export const KsSpacingXsBpFactorDesktop = "2.2519";
|
|
759
|
-
export const
|
|
761
|
+
export const KsSpacingXsBpFactorWidescreen = "2.5";
|
|
762
|
+
export const KsSpacingXsBpFactorTv = "3";
|
|
760
763
|
export const KsSpacingS = "0.614rem";
|
|
761
764
|
export const KsSpacingSBase = "0.614rem";
|
|
762
765
|
export const KsSpacingSBpFactorPhone = "1.225";
|
|
763
766
|
export const KsSpacingSBpFactorTablet = "1.5006";
|
|
764
767
|
export const KsSpacingSBpFactorLaptop = "1.8383";
|
|
765
768
|
export const KsSpacingSBpFactorDesktop = "2.2519";
|
|
766
|
-
export const
|
|
769
|
+
export const KsSpacingSBpFactorWidescreen = "2.5";
|
|
770
|
+
export const KsSpacingSBpFactorTv = "3";
|
|
767
771
|
export const KsSpacingM = "0.875rem";
|
|
768
772
|
export const KsSpacingMBase = "0.875rem";
|
|
769
773
|
export const KsSpacingMBpFactorPhone = "1.225";
|
|
770
774
|
export const KsSpacingMBpFactorTablet = "1.5006";
|
|
771
775
|
export const KsSpacingMBpFactorLaptop = "1.8383";
|
|
772
776
|
export const KsSpacingMBpFactorDesktop = "2.2519";
|
|
773
|
-
export const
|
|
777
|
+
export const KsSpacingMBpFactorWidescreen = "2.5";
|
|
778
|
+
export const KsSpacingMBpFactorTv = "3";
|
|
774
779
|
export const KsSpacingL = "1.2469rem";
|
|
775
780
|
export const KsSpacingLBase = "1.2469rem";
|
|
776
781
|
export const KsSpacingLBpFactorPhone = "1.225";
|
|
777
782
|
export const KsSpacingLBpFactorTablet = "1.5006";
|
|
778
783
|
export const KsSpacingLBpFactorLaptop = "1.8383";
|
|
779
784
|
export const KsSpacingLBpFactorDesktop = "2.2519";
|
|
780
|
-
export const
|
|
785
|
+
export const KsSpacingLBpFactorWidescreen = "2.5";
|
|
786
|
+
export const KsSpacingLBpFactorTv = "3";
|
|
781
787
|
export const KsSpacingXl = "1.7768rem";
|
|
782
788
|
export const KsSpacingXlBase = "1.7768rem";
|
|
783
789
|
export const KsSpacingXlBpFactorPhone = "1.225";
|
|
@@ -791,7 +797,8 @@ export const KsSpacingXxlBpFactorPhone = "1.225";
|
|
|
791
797
|
export const KsSpacingXxlBpFactorTablet = "1.5006";
|
|
792
798
|
export const KsSpacingXxlBpFactorLaptop = "1.8383";
|
|
793
799
|
export const KsSpacingXxlBpFactorDesktop = "2.2519";
|
|
794
|
-
export const
|
|
800
|
+
export const KsSpacingXxlBpFactorWidescreen = "2.5";
|
|
801
|
+
export const KsSpacingXxlBpFactorTv = "3";
|
|
795
802
|
export const KsSpacingStackXs = "0.4309rem";
|
|
796
803
|
export const KsSpacingStackS = "0.614rem";
|
|
797
804
|
export const KsSpacingStackM = "0.875rem";
|
|
@@ -952,7 +959,8 @@ export const KsFontSizeDisplayBpFactorPhone = 1.125;
|
|
|
952
959
|
export const KsFontSizeDisplayBpFactorTablet = 1.5;
|
|
953
960
|
export const KsFontSizeDisplayBpFactorLaptop = 1.5;
|
|
954
961
|
export const KsFontSizeDisplayBpFactorDesktop = 1.75;
|
|
955
|
-
export const
|
|
962
|
+
export const KsFontSizeDisplayBpFactorWidescreen = 2.25;
|
|
963
|
+
export const KsFontSizeDisplayBpFactorTv = 2.75;
|
|
956
964
|
export const KsFontSizeDisplayXxsBase = "0.68rem";
|
|
957
965
|
export const KsFontSizeDisplayXsBase = "0.833rem";
|
|
958
966
|
export const KsFontSizeDisplaySBase = "1.0204rem";
|
|
@@ -961,7 +969,8 @@ export const KsFontSizeDisplayLBase = "1.5313rem";
|
|
|
961
969
|
export const KsFontSizeDisplayXlBase = "1.8758rem";
|
|
962
970
|
export const KsFontSizeDisplayXxlBase = "2.2978rem";
|
|
963
971
|
export const KsFontSizeCopyBpFactorTablet = 1.125;
|
|
964
|
-
export const
|
|
972
|
+
export const KsFontSizeCopyBpFactorWidescreen = 1.35;
|
|
973
|
+
export const KsFontSizeCopyBpFactorTv = 1.65;
|
|
965
974
|
export const KsFontSizeCopyXxsBase = "0.612rem";
|
|
966
975
|
export const KsFontSizeCopyXsBase = "0.7497rem";
|
|
967
976
|
export const KsFontSizeCopySBase = "0.9184rem";
|
|
@@ -970,7 +979,8 @@ export const KsFontSizeCopyLBase = "1.3781rem";
|
|
|
970
979
|
export const KsFontSizeCopyXlBase = "1.6882rem";
|
|
971
980
|
export const KsFontSizeCopyXxlBase = "2.068rem";
|
|
972
981
|
export const KsFontSizeInterfaceBpFactorTablet = 1.125;
|
|
973
|
-
export const
|
|
982
|
+
export const KsFontSizeInterfaceBpFactorWidescreen = 1.35;
|
|
983
|
+
export const KsFontSizeInterfaceBpFactorTv = 1.65;
|
|
974
984
|
export const KsFontSizeInterfaceXxsBase = "0.544rem";
|
|
975
985
|
export const KsFontSizeInterfaceXsBase = "0.6664rem";
|
|
976
986
|
export const KsFontSizeInterfaceSBase = "0.8163rem";
|
|
@@ -979,7 +989,8 @@ export const KsFontSizeInterfaceLBase = "1.225rem";
|
|
|
979
989
|
export const KsFontSizeInterfaceXlBase = "1.5006rem";
|
|
980
990
|
export const KsFontSizeInterfaceXxlBase = "1.8383rem";
|
|
981
991
|
export const KsFontSizeMonoBpFactorTablet = 1.125;
|
|
982
|
-
export const
|
|
992
|
+
export const KsFontSizeMonoBpFactorWidescreen = 1.35;
|
|
993
|
+
export const KsFontSizeMonoBpFactorTv = 1.65;
|
|
983
994
|
export const KsFontSizeMonoXxsBase = "0.612rem";
|
|
984
995
|
export const KsFontSizeMonoXsBase = "0.7497rem";
|
|
985
996
|
export const KsFontSizeMonoSBase = "0.9184rem";
|