@db-ux/core-foundations 4.5.4 → 4.6.0

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.
Files changed (111) hide show
  1. package/CHANGELOG.md +10 -0
  2. package/README.md +16 -69
  3. package/agent/_instructions.md +84 -0
  4. package/agent/tailwind/Variables.md +11 -9
  5. package/build/styles/bundle.css +4820 -0
  6. package/build/styles/{index.scss → bundle.scss} +5 -0
  7. package/build/styles/colors/_default-color-mappings.scss +3461 -3472
  8. package/build/styles/colors/_placeholder.scss +155 -159
  9. package/build/styles/colors/classes/all.css +2499 -2601
  10. package/build/styles/colors/classes/blue.css +147 -185
  11. package/build/styles/colors/classes/brand.css +147 -185
  12. package/build/styles/colors/classes/burgundy.css +147 -185
  13. package/build/styles/colors/classes/critical.css +147 -185
  14. package/build/styles/colors/classes/cyan.css +147 -185
  15. package/build/styles/colors/classes/green.css +147 -185
  16. package/build/styles/colors/classes/informational.css +147 -185
  17. package/build/styles/colors/classes/light-green.css +147 -185
  18. package/build/styles/colors/classes/neutral.css +147 -185
  19. package/build/styles/colors/classes/orange.css +147 -185
  20. package/build/styles/colors/classes/pink.css +147 -185
  21. package/build/styles/colors/classes/red.css +147 -185
  22. package/build/styles/colors/classes/successful.css +147 -185
  23. package/build/styles/colors/classes/turquoise.css +147 -185
  24. package/build/styles/colors/classes/violet.css +147 -185
  25. package/build/styles/colors/classes/warning.css +147 -185
  26. package/build/styles/colors/classes/yellow.css +147 -185
  27. package/build/styles/defaults/default-code.css +97 -97
  28. package/build/styles/defaults/default-container-properties.css +1 -0
  29. package/build/styles/defaults/default-container-variables.css +1 -0
  30. package/build/styles/defaults/default-elevation.css +1 -1
  31. package/build/styles/defaults/default-fonts.css +1 -1
  32. package/build/styles/defaults/default-icons.css +1 -1
  33. package/build/styles/defaults/default-properties.css +1 -0
  34. package/build/styles/defaults/default-required.css +1 -1
  35. package/build/styles/defaults/default-required.scss +13 -16
  36. package/build/styles/defaults/default-root.css +97 -97
  37. package/build/styles/defaults/default-variables.css +1 -0
  38. package/build/styles/density/_scaling-placeholder.scss +51 -54
  39. package/build/styles/density/_typography-placeholder.scss +54 -60
  40. package/build/styles/density/classes/all.css +759 -907
  41. package/build/styles/density/classes/expressive.css +255 -377
  42. package/build/styles/density/classes/functional.css +255 -377
  43. package/build/styles/density/classes/regular.css +255 -377
  44. package/build/styles/fonts/_font-sizes.scss +10 -16
  45. package/build/styles/fonts/absolute.scss +1 -1
  46. package/build/styles/fonts/classes/all.css +54 -214
  47. package/build/styles/fonts/classes/body/2xl.css +3 -95
  48. package/build/styles/fonts/classes/body/2xs.css +3 -95
  49. package/build/styles/fonts/classes/body/3xl.css +3 -95
  50. package/build/styles/fonts/classes/body/3xs.css +3 -95
  51. package/build/styles/fonts/classes/body/all.css +27 -151
  52. package/build/styles/fonts/classes/body/lg.css +3 -95
  53. package/build/styles/fonts/classes/body/md.css +3 -95
  54. package/build/styles/fonts/classes/body/sm.css +3 -95
  55. package/build/styles/fonts/classes/body/xl.css +3 -95
  56. package/build/styles/fonts/classes/body/xs.css +3 -95
  57. package/build/styles/fonts/classes/headline/2xl.css +3 -95
  58. package/build/styles/fonts/classes/headline/2xs.css +3 -95
  59. package/build/styles/fonts/classes/headline/3xl.css +3 -95
  60. package/build/styles/fonts/classes/headline/3xs.css +3 -95
  61. package/build/styles/fonts/classes/headline/all.css +27 -151
  62. package/build/styles/fonts/classes/headline/lg.css +3 -95
  63. package/build/styles/fonts/classes/headline/md.css +3 -95
  64. package/build/styles/fonts/classes/headline/sm.css +3 -95
  65. package/build/styles/fonts/classes/headline/xl.css +3 -95
  66. package/build/styles/fonts/classes/headline/xs.css +3 -95
  67. package/build/styles/fonts/relative.scss +1 -1
  68. package/build/styles/fonts/rollup.scss +1 -1
  69. package/build/styles/fonts/webpack.scss +1 -1
  70. package/build/styles/helpers/_index.scss +0 -1
  71. package/build/styles/helpers/classes/all.css +0 -34
  72. package/build/styles/helpers/classes/divider.css +0 -34
  73. package/build/styles/helpers/classes/focus.css +0 -34
  74. package/build/styles/icons/absolute.css +1 -1
  75. package/build/styles/icons/absolute.scss +1 -1
  76. package/build/styles/icons/relative.css +1 -1
  77. package/build/styles/icons/relative.scss +1 -1
  78. package/build/styles/icons/rollup.css +1 -1
  79. package/build/styles/icons/rollup.scss +1 -1
  80. package/build/styles/icons/webpack.css +1 -1
  81. package/build/styles/icons/webpack.scss +1 -1
  82. package/build/styles/theme/absolute.css +1 -0
  83. package/build/styles/theme/relative.css +1 -0
  84. package/build/styles/{defaults/default-theme.scss → theme/relative.scss} +3 -6
  85. package/build/styles/theme/rollup.css +1 -0
  86. package/build/styles/theme/webpack.css +1 -0
  87. package/build/tailwind/theme/colors.css +1 -2953
  88. package/build/tailwind/theme/colors.scss +1 -10
  89. package/build/tailwind/theme/dimensions.css +77 -160
  90. package/package.json +4 -4
  91. package/build/styles/absolute.css +0 -10635
  92. package/build/styles/defaults/default-theme.css +0 -97
  93. package/build/styles/helpers/_layer.scss +0 -1
  94. package/build/styles/index.css +0 -4907
  95. package/build/styles/relative.css +0 -10635
  96. package/build/styles/relative.scss +0 -4
  97. package/build/styles/rollup.css +0 -10635
  98. package/build/styles/webpack.css +0 -10635
  99. package/build/tailwind/theme/_variables.scss +0 -77
  100. package/build/tailwind/theme/dimensions.scss +0 -17
  101. /package/build/styles/defaults/{_default-container-properties.scss → default-container-properties.scss} +0 -0
  102. /package/build/styles/defaults/{_default-container-variables.scss → default-container-variables.scss} +0 -0
  103. /package/build/styles/defaults/{_default-properties.scss → default-properties.scss} +0 -0
  104. /package/build/styles/defaults/{_default-variables.scss → default-variables.scss} +0 -0
  105. /package/build/styles/{_absolute.assets-paths.scss → theme/_absolute.assets-paths.scss} +0 -0
  106. /package/build/styles/{_default.assets-paths.scss → theme/_default.assets-paths.scss} +0 -0
  107. /package/build/styles/{_rollup.assets-paths.scss → theme/_rollup.assets-paths.scss} +0 -0
  108. /package/build/styles/{_webpack.assets-paths.scss → theme/_webpack.assets-paths.scss} +0 -0
  109. /package/build/styles/{absolute.scss → theme/absolute.scss} +0 -0
  110. /package/build/styles/{rollup.scss → theme/rollup.scss} +0 -0
  111. /package/build/styles/{webpack.scss → theme/webpack.scss} +0 -0
@@ -1,64 +1,4 @@
1
1
  /* Variants for adaptive components like input, select, notification, ... */
2
- @layer variables {}
3
-
4
- @layer variables {}
5
-
6
- @layer variables {}
7
-
8
- @layer variables {}
9
-
10
- @layer variables {}
11
-
12
- @layer variables {}
13
-
14
- @layer variables {}
15
-
16
- @layer variables {}
17
-
18
- @layer variables {}
19
-
20
- @layer variables {}
21
-
22
- @layer variables {}
23
-
24
- @layer variables {}
25
-
26
- @layer variables {}
27
-
28
- @layer variables {}
29
-
30
- @layer variables {}
31
-
32
- @layer variables {}
33
-
34
- @layer variables {}
35
-
36
- @layer variables {}
37
-
38
- @layer variables {}
39
-
40
- @layer variables {}
41
-
42
- @layer variables {}
43
-
44
- @layer variables {}
45
-
46
- @layer variables {}
47
-
48
- @layer variables {}
49
-
50
- @layer variables {}
51
-
52
- @layer variables {}
53
-
54
- @layer variables {}
55
-
56
- @layer variables {}
57
-
58
- @layer variables {}
59
-
60
- @layer variables {}
61
-
62
2
  .db-density-regular,
63
3
  [data-density=regular] {
64
4
  font: var(--db-type-body-md);
@@ -67,351 +7,289 @@
67
7
  .db-density-regular,
68
8
  [data-density=regular] {
69
9
  font: var(--db-type-body-md);
70
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
10
+ /* Those variables are only for components to calculate heights and change icons */
11
+ --db-icon-font-weight: var(--db-base-body-icon-weight-md);
12
+ --db-icon-font-size: var(--db-base-body-icon-font-size-md);
71
13
  }
72
- @layer variables {
73
- .db-density-regular,
74
- [data-density=regular] {
75
- /* Those variables are only for components to calculate heights and change icons */
76
- --db-icon-font-weight: var(--db-base-body-icon-weight-md);
77
- --db-icon-font-size: var(--db-base-body-icon-font-size-md);
78
- }
79
- }
80
-
81
- @layer variables {}
82
-
83
- @layer variables {}
84
-
85
- @layer variables {}
86
-
87
- @layer variables {}
88
-
89
- @layer variables {}
90
-
91
- @layer variables {}
92
-
93
- @layer variables {}
94
-
95
- @layer variables {}
96
-
97
- @layer variables {}
98
-
99
- @layer variables {}
100
-
101
- @layer variables {}
102
-
103
- @layer variables {}
104
-
105
- @layer variables {}
106
-
107
- @layer variables {}
108
14
 
109
15
  .db-density-regular,
110
16
  [data-density=regular] {
111
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
17
+ --db-sizing-3xs: var(--db-sizing-regular-3xs);
18
+ --db-sizing-2xs: var(--db-sizing-regular-2xs);
19
+ --db-sizing-xs: var(--db-sizing-regular-xs);
20
+ --db-sizing-sm: var(--db-sizing-regular-sm);
21
+ --db-sizing-md: var(--db-sizing-regular-md);
22
+ --db-sizing-lg: var(--db-sizing-regular-lg);
23
+ --db-sizing-xl: var(--db-sizing-regular-xl);
24
+ --db-sizing-2xl: var(--db-sizing-regular-2xl);
25
+ --db-sizing-3xl: var(--db-sizing-regular-3xl);
26
+ --db-spacing-fixed-3xs: var(--db-spacing-fixed-regular-3xs);
27
+ --db-spacing-fixed-2xs: var(--db-spacing-fixed-regular-2xs);
28
+ --db-spacing-fixed-xs: var(--db-spacing-fixed-regular-xs);
29
+ --db-spacing-fixed-sm: var(--db-spacing-fixed-regular-sm);
30
+ --db-spacing-fixed-md: var(--db-spacing-fixed-regular-md);
31
+ --db-spacing-fixed-lg: var(--db-spacing-fixed-regular-lg);
32
+ --db-spacing-fixed-xl: var(--db-spacing-fixed-regular-xl);
33
+ --db-spacing-fixed-2xl: var(--db-spacing-fixed-regular-2xl);
34
+ --db-spacing-fixed-3xl: var(--db-spacing-fixed-regular-3xl);
35
+ /* stylelint-disable-next-line media-query-no-invalid */
36
+ /* stylelint-disable-next-line at-rule-empty-line-before */
37
+ /* stylelint-disable-next-line media-query-no-invalid */
38
+ /* stylelint-disable-next-line at-rule-empty-line-before */
39
+ /* stylelint-disable-next-line media-query-no-invalid */
40
+ /* stylelint-disable-next-line at-rule-empty-line-before */
112
41
  }
113
- @layer variables {
42
+ @media (width <= 48em) {
114
43
  .db-density-regular,
115
44
  [data-density=regular] {
116
- --db-sizing-3xs: var(--db-sizing-regular-3xs);
117
- --db-sizing-2xs: var(--db-sizing-regular-2xs);
118
- --db-sizing-xs: var(--db-sizing-regular-xs);
119
- --db-sizing-sm: var(--db-sizing-regular-sm);
120
- --db-sizing-md: var(--db-sizing-regular-md);
121
- --db-sizing-lg: var(--db-sizing-regular-lg);
122
- --db-sizing-xl: var(--db-sizing-regular-xl);
123
- --db-sizing-2xl: var(--db-sizing-regular-2xl);
124
- --db-sizing-3xl: var(--db-sizing-regular-3xl);
125
- --db-spacing-fixed-3xs: var(--db-spacing-fixed-regular-3xs);
126
- --db-spacing-fixed-2xs: var(--db-spacing-fixed-regular-2xs);
127
- --db-spacing-fixed-xs: var(--db-spacing-fixed-regular-xs);
128
- --db-spacing-fixed-sm: var(--db-spacing-fixed-regular-sm);
129
- --db-spacing-fixed-md: var(--db-spacing-fixed-regular-md);
130
- --db-spacing-fixed-lg: var(--db-spacing-fixed-regular-lg);
131
- --db-spacing-fixed-xl: var(--db-spacing-fixed-regular-xl);
132
- --db-spacing-fixed-2xl: var(--db-spacing-fixed-regular-2xl);
133
- --db-spacing-fixed-3xl: var(--db-spacing-fixed-regular-3xl);
134
- /* stylelint-disable-next-line media-query-no-invalid */
135
- /* stylelint-disable-next-line at-rule-empty-line-before */
136
- /* stylelint-disable-next-line media-query-no-invalid */
137
- /* stylelint-disable-next-line at-rule-empty-line-before */
138
- /* stylelint-disable-next-line media-query-no-invalid */
139
- /* stylelint-disable-next-line at-rule-empty-line-before */
140
- }
141
- @media (width <= 48em) {
142
- .db-density-regular,
143
- [data-density=regular] {
144
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
145
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-mobile-2xs);
146
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-mobile-xs);
147
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-mobile-sm);
148
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-mobile-md);
149
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-mobile-lg);
150
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-mobile-xl);
151
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-mobile-2xl);
152
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
153
- }
45
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
46
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-mobile-2xs);
47
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-mobile-xs);
48
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-mobile-sm);
49
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-mobile-md);
50
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-mobile-lg);
51
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-mobile-xl);
52
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-mobile-2xl);
53
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
154
54
  }
155
- @media (48em < width <= 64em) {
156
- .db-density-regular,
157
- [data-density=regular] {
158
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
159
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-tablet-2xs);
160
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-tablet-xs);
161
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-tablet-sm);
162
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-tablet-md);
163
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-tablet-lg);
164
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-tablet-xl);
165
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-tablet-2xl);
166
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
167
- }
55
+ }
56
+ @media (48em < width <= 64em) {
57
+ .db-density-regular,
58
+ [data-density=regular] {
59
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
60
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-tablet-2xs);
61
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-tablet-xs);
62
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-tablet-sm);
63
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-tablet-md);
64
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-tablet-lg);
65
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-tablet-xl);
66
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-tablet-2xl);
67
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
168
68
  }
169
- @media (64em < width) {
170
- .db-density-regular,
171
- [data-density=regular] {
172
- --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
173
- --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-desktop-2xs);
174
- --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-desktop-xs);
175
- --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-desktop-sm);
176
- --db-spacing-responsive-md: var(--db-spacing-responsive-regular-desktop-md);
177
- --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-desktop-lg);
178
- --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-desktop-xl);
179
- --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-desktop-2xl);
180
- --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-desktop-3xl);
181
- }
69
+ }
70
+ @media (64em < width) {
71
+ .db-density-regular,
72
+ [data-density=regular] {
73
+ --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
74
+ --db-spacing-responsive-2xs: var(--db-spacing-responsive-regular-desktop-2xs);
75
+ --db-spacing-responsive-xs: var(--db-spacing-responsive-regular-desktop-xs);
76
+ --db-spacing-responsive-sm: var(--db-spacing-responsive-regular-desktop-sm);
77
+ --db-spacing-responsive-md: var(--db-spacing-responsive-regular-desktop-md);
78
+ --db-spacing-responsive-lg: var(--db-spacing-responsive-regular-desktop-lg);
79
+ --db-spacing-responsive-xl: var(--db-spacing-responsive-regular-desktop-xl);
80
+ --db-spacing-responsive-2xl: var(--db-spacing-responsive-regular-desktop-2xl);
81
+ --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-desktop-3xl);
182
82
  }
183
83
  }
184
84
 
185
- @layer variables {}
186
-
187
- @layer variables {}
188
-
189
- @layer variables {}
190
-
191
85
  .db-density-regular,
192
86
  [data-density=regular] {
193
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
87
+ /* stylelint-disable-next-line media-query-no-invalid */
88
+ /* stylelint-disable-next-line at-rule-empty-line-before */
89
+ /* stylelint-disable-next-line media-query-no-invalid */
90
+ /* stylelint-disable-next-line at-rule-empty-line-before */
91
+ /* stylelint-disable-next-line media-query-no-invalid */
92
+ /* stylelint-disable-next-line at-rule-empty-line-before */
194
93
  }
195
- @layer variables {
94
+ @media (width <= 48em) {
196
95
  .db-density-regular,
197
96
  [data-density=regular] {
198
- /* stylelint-disable-next-line media-query-no-invalid */
199
- /* stylelint-disable-next-line at-rule-empty-line-before */
200
- /* stylelint-disable-next-line media-query-no-invalid */
201
- /* stylelint-disable-next-line at-rule-empty-line-before */
202
- /* stylelint-disable-next-line media-query-no-invalid */
203
- /* stylelint-disable-next-line at-rule-empty-line-before */
204
- }
205
- @media (width <= 48em) {
206
- .db-density-regular,
207
- [data-density=regular] {
208
- --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
209
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-headline-3xs);
210
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-headline-3xs);
211
- --db-type-headline-2xs: var(--db-typography-regular-mobile-headline-2xs);
212
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-headline-2xs);
213
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-headline-2xs);
214
- --db-type-headline-xs: var(--db-typography-regular-mobile-headline-xs);
215
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-headline-xs);
216
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-headline-xs);
217
- --db-type-headline-sm: var(--db-typography-regular-mobile-headline-sm);
218
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-headline-sm);
219
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-headline-sm);
220
- --db-type-headline-md: var(--db-typography-regular-mobile-headline-md);
221
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-mobile-headline-md);
222
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-headline-md);
223
- --db-type-headline-lg: var(--db-typography-regular-mobile-headline-lg);
224
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-headline-lg);
225
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-headline-lg);
226
- --db-type-headline-xl: var(--db-typography-regular-mobile-headline-xl);
227
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-headline-xl);
228
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-headline-xl);
229
- --db-type-headline-2xl: var(--db-typography-regular-mobile-headline-2xl);
230
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-headline-2xl);
231
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-headline-2xl);
232
- --db-type-headline-3xl: var(--db-typography-regular-mobile-headline-3xl);
233
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-headline-3xl);
234
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
235
- }
97
+ --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
98
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-headline-3xs);
99
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-headline-3xs);
100
+ --db-type-headline-2xs: var(--db-typography-regular-mobile-headline-2xs);
101
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-headline-2xs);
102
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-headline-2xs);
103
+ --db-type-headline-xs: var(--db-typography-regular-mobile-headline-xs);
104
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-headline-xs);
105
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-headline-xs);
106
+ --db-type-headline-sm: var(--db-typography-regular-mobile-headline-sm);
107
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-headline-sm);
108
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-headline-sm);
109
+ --db-type-headline-md: var(--db-typography-regular-mobile-headline-md);
110
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-mobile-headline-md);
111
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-headline-md);
112
+ --db-type-headline-lg: var(--db-typography-regular-mobile-headline-lg);
113
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-headline-lg);
114
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-headline-lg);
115
+ --db-type-headline-xl: var(--db-typography-regular-mobile-headline-xl);
116
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-headline-xl);
117
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-headline-xl);
118
+ --db-type-headline-2xl: var(--db-typography-regular-mobile-headline-2xl);
119
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-headline-2xl);
120
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-headline-2xl);
121
+ --db-type-headline-3xl: var(--db-typography-regular-mobile-headline-3xl);
122
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-headline-3xl);
123
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
236
124
  }
237
- @media (48em < width <= 64em) {
238
- .db-density-regular,
239
- [data-density=regular] {
240
- --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
241
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-headline-3xs);
242
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-headline-3xs);
243
- --db-type-headline-2xs: var(--db-typography-regular-tablet-headline-2xs);
244
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-headline-2xs);
245
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-headline-2xs);
246
- --db-type-headline-xs: var(--db-typography-regular-tablet-headline-xs);
247
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-headline-xs);
248
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-headline-xs);
249
- --db-type-headline-sm: var(--db-typography-regular-tablet-headline-sm);
250
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-headline-sm);
251
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-headline-sm);
252
- --db-type-headline-md: var(--db-typography-regular-tablet-headline-md);
253
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-tablet-headline-md);
254
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-headline-md);
255
- --db-type-headline-lg: var(--db-typography-regular-tablet-headline-lg);
256
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-headline-lg);
257
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-headline-lg);
258
- --db-type-headline-xl: var(--db-typography-regular-tablet-headline-xl);
259
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-headline-xl);
260
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-headline-xl);
261
- --db-type-headline-2xl: var(--db-typography-regular-tablet-headline-2xl);
262
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-headline-2xl);
263
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-headline-2xl);
264
- --db-type-headline-3xl: var(--db-typography-regular-tablet-headline-3xl);
265
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-headline-3xl);
266
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
267
- }
125
+ }
126
+ @media (48em < width <= 64em) {
127
+ .db-density-regular,
128
+ [data-density=regular] {
129
+ --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
130
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-headline-3xs);
131
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-headline-3xs);
132
+ --db-type-headline-2xs: var(--db-typography-regular-tablet-headline-2xs);
133
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-headline-2xs);
134
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-headline-2xs);
135
+ --db-type-headline-xs: var(--db-typography-regular-tablet-headline-xs);
136
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-headline-xs);
137
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-headline-xs);
138
+ --db-type-headline-sm: var(--db-typography-regular-tablet-headline-sm);
139
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-headline-sm);
140
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-headline-sm);
141
+ --db-type-headline-md: var(--db-typography-regular-tablet-headline-md);
142
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-tablet-headline-md);
143
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-headline-md);
144
+ --db-type-headline-lg: var(--db-typography-regular-tablet-headline-lg);
145
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-headline-lg);
146
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-headline-lg);
147
+ --db-type-headline-xl: var(--db-typography-regular-tablet-headline-xl);
148
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-headline-xl);
149
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-headline-xl);
150
+ --db-type-headline-2xl: var(--db-typography-regular-tablet-headline-2xl);
151
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-headline-2xl);
152
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-headline-2xl);
153
+ --db-type-headline-3xl: var(--db-typography-regular-tablet-headline-3xl);
154
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-headline-3xl);
155
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
268
156
  }
269
- @media (64em < width) {
270
- .db-density-regular,
271
- [data-density=regular] {
272
- --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
273
- --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-headline-3xs);
274
- --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-headline-3xs);
275
- --db-type-headline-2xs: var(--db-typography-regular-desktop-headline-2xs);
276
- --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-headline-2xs);
277
- --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-headline-2xs);
278
- --db-type-headline-xs: var(--db-typography-regular-desktop-headline-xs);
279
- --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-headline-xs);
280
- --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-headline-xs);
281
- --db-type-headline-sm: var(--db-typography-regular-desktop-headline-sm);
282
- --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-headline-sm);
283
- --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-headline-sm);
284
- --db-type-headline-md: var(--db-typography-regular-desktop-headline-md);
285
- --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-desktop-headline-md);
286
- --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-headline-md);
287
- --db-type-headline-lg: var(--db-typography-regular-desktop-headline-lg);
288
- --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-headline-lg);
289
- --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-headline-lg);
290
- --db-type-headline-xl: var(--db-typography-regular-desktop-headline-xl);
291
- --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-headline-xl);
292
- --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-headline-xl);
293
- --db-type-headline-2xl: var(--db-typography-regular-desktop-headline-2xl);
294
- --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-headline-2xl);
295
- --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-headline-2xl);
296
- --db-type-headline-3xl: var(--db-typography-regular-desktop-headline-3xl);
297
- --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-headline-3xl);
298
- --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-headline-3xl);
299
- }
157
+ }
158
+ @media (64em < width) {
159
+ .db-density-regular,
160
+ [data-density=regular] {
161
+ --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
162
+ --db-base-headline-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-headline-3xs);
163
+ --db-base-headline-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-headline-3xs);
164
+ --db-type-headline-2xs: var(--db-typography-regular-desktop-headline-2xs);
165
+ --db-base-headline-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-headline-2xs);
166
+ --db-base-headline-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-headline-2xs);
167
+ --db-type-headline-xs: var(--db-typography-regular-desktop-headline-xs);
168
+ --db-base-headline-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-headline-xs);
169
+ --db-base-headline-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-headline-xs);
170
+ --db-type-headline-sm: var(--db-typography-regular-desktop-headline-sm);
171
+ --db-base-headline-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-headline-sm);
172
+ --db-base-headline-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-headline-sm);
173
+ --db-type-headline-md: var(--db-typography-regular-desktop-headline-md);
174
+ --db-base-headline-icon-weight-md: var(--db-base-icon-weight-regular-desktop-headline-md);
175
+ --db-base-headline-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-headline-md);
176
+ --db-type-headline-lg: var(--db-typography-regular-desktop-headline-lg);
177
+ --db-base-headline-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-headline-lg);
178
+ --db-base-headline-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-headline-lg);
179
+ --db-type-headline-xl: var(--db-typography-regular-desktop-headline-xl);
180
+ --db-base-headline-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-headline-xl);
181
+ --db-base-headline-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-headline-xl);
182
+ --db-type-headline-2xl: var(--db-typography-regular-desktop-headline-2xl);
183
+ --db-base-headline-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-headline-2xl);
184
+ --db-base-headline-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-headline-2xl);
185
+ --db-type-headline-3xl: var(--db-typography-regular-desktop-headline-3xl);
186
+ --db-base-headline-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-headline-3xl);
187
+ --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-headline-3xl);
300
188
  }
301
189
  }
302
190
 
303
191
  .db-density-regular,
304
192
  [data-density=regular] {
305
- /* stylelint-disable-next-line at-rule-prelude-no-invalid,layer-name-pattern */
193
+ /* stylelint-disable-next-line media-query-no-invalid */
194
+ /* stylelint-disable-next-line at-rule-empty-line-before */
195
+ /* stylelint-disable-next-line media-query-no-invalid */
196
+ /* stylelint-disable-next-line at-rule-empty-line-before */
197
+ /* stylelint-disable-next-line media-query-no-invalid */
198
+ /* stylelint-disable-next-line at-rule-empty-line-before */
306
199
  }
307
- @layer variables {
200
+ @media (width <= 48em) {
308
201
  .db-density-regular,
309
202
  [data-density=regular] {
310
- /* stylelint-disable-next-line media-query-no-invalid */
311
- /* stylelint-disable-next-line at-rule-empty-line-before */
312
- /* stylelint-disable-next-line media-query-no-invalid */
313
- /* stylelint-disable-next-line at-rule-empty-line-before */
314
- /* stylelint-disable-next-line media-query-no-invalid */
315
- /* stylelint-disable-next-line at-rule-empty-line-before */
203
+ --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
204
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-body-3xs);
205
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-body-3xs);
206
+ --db-type-body-2xs: var(--db-typography-regular-mobile-body-2xs);
207
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-body-2xs);
208
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-body-2xs);
209
+ --db-type-body-xs: var(--db-typography-regular-mobile-body-xs);
210
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-body-xs);
211
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-body-xs);
212
+ --db-type-body-sm: var(--db-typography-regular-mobile-body-sm);
213
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-body-sm);
214
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-body-sm);
215
+ --db-type-body-md: var(--db-typography-regular-mobile-body-md);
216
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-mobile-body-md);
217
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-body-md);
218
+ --db-type-body-lg: var(--db-typography-regular-mobile-body-lg);
219
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-body-lg);
220
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-body-lg);
221
+ --db-type-body-xl: var(--db-typography-regular-mobile-body-xl);
222
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-body-xl);
223
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-body-xl);
224
+ --db-type-body-2xl: var(--db-typography-regular-mobile-body-2xl);
225
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-body-2xl);
226
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-body-2xl);
227
+ --db-type-body-3xl: var(--db-typography-regular-mobile-body-3xl);
228
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-body-3xl);
229
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
316
230
  }
317
- @media (width <= 48em) {
318
- .db-density-regular,
319
- [data-density=regular] {
320
- --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
321
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-mobile-body-3xs);
322
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-mobile-body-3xs);
323
- --db-type-body-2xs: var(--db-typography-regular-mobile-body-2xs);
324
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-mobile-body-2xs);
325
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-mobile-body-2xs);
326
- --db-type-body-xs: var(--db-typography-regular-mobile-body-xs);
327
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-mobile-body-xs);
328
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-mobile-body-xs);
329
- --db-type-body-sm: var(--db-typography-regular-mobile-body-sm);
330
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-mobile-body-sm);
331
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-mobile-body-sm);
332
- --db-type-body-md: var(--db-typography-regular-mobile-body-md);
333
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-mobile-body-md);
334
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-mobile-body-md);
335
- --db-type-body-lg: var(--db-typography-regular-mobile-body-lg);
336
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-mobile-body-lg);
337
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-mobile-body-lg);
338
- --db-type-body-xl: var(--db-typography-regular-mobile-body-xl);
339
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-mobile-body-xl);
340
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-mobile-body-xl);
341
- --db-type-body-2xl: var(--db-typography-regular-mobile-body-2xl);
342
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-mobile-body-2xl);
343
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-mobile-body-2xl);
344
- --db-type-body-3xl: var(--db-typography-regular-mobile-body-3xl);
345
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-mobile-body-3xl);
346
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
347
- }
348
- }
349
- @media (48em < width <= 64em) {
350
- .db-density-regular,
351
- [data-density=regular] {
352
- --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
353
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-body-3xs);
354
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-body-3xs);
355
- --db-type-body-2xs: var(--db-typography-regular-tablet-body-2xs);
356
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-body-2xs);
357
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-body-2xs);
358
- --db-type-body-xs: var(--db-typography-regular-tablet-body-xs);
359
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-body-xs);
360
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-body-xs);
361
- --db-type-body-sm: var(--db-typography-regular-tablet-body-sm);
362
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-body-sm);
363
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-body-sm);
364
- --db-type-body-md: var(--db-typography-regular-tablet-body-md);
365
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-tablet-body-md);
366
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-body-md);
367
- --db-type-body-lg: var(--db-typography-regular-tablet-body-lg);
368
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-body-lg);
369
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-body-lg);
370
- --db-type-body-xl: var(--db-typography-regular-tablet-body-xl);
371
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-body-xl);
372
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-body-xl);
373
- --db-type-body-2xl: var(--db-typography-regular-tablet-body-2xl);
374
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-body-2xl);
375
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-body-2xl);
376
- --db-type-body-3xl: var(--db-typography-regular-tablet-body-3xl);
377
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-body-3xl);
378
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
379
- }
231
+ }
232
+ @media (48em < width <= 64em) {
233
+ .db-density-regular,
234
+ [data-density=regular] {
235
+ --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
236
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-tablet-body-3xs);
237
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-tablet-body-3xs);
238
+ --db-type-body-2xs: var(--db-typography-regular-tablet-body-2xs);
239
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-tablet-body-2xs);
240
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-tablet-body-2xs);
241
+ --db-type-body-xs: var(--db-typography-regular-tablet-body-xs);
242
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-tablet-body-xs);
243
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-tablet-body-xs);
244
+ --db-type-body-sm: var(--db-typography-regular-tablet-body-sm);
245
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-tablet-body-sm);
246
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-tablet-body-sm);
247
+ --db-type-body-md: var(--db-typography-regular-tablet-body-md);
248
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-tablet-body-md);
249
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-tablet-body-md);
250
+ --db-type-body-lg: var(--db-typography-regular-tablet-body-lg);
251
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-tablet-body-lg);
252
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-tablet-body-lg);
253
+ --db-type-body-xl: var(--db-typography-regular-tablet-body-xl);
254
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-tablet-body-xl);
255
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-tablet-body-xl);
256
+ --db-type-body-2xl: var(--db-typography-regular-tablet-body-2xl);
257
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-tablet-body-2xl);
258
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-tablet-body-2xl);
259
+ --db-type-body-3xl: var(--db-typography-regular-tablet-body-3xl);
260
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-tablet-body-3xl);
261
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
380
262
  }
381
- @media (64em < width) {
382
- .db-density-regular,
383
- [data-density=regular] {
384
- --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
385
- --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-body-3xs);
386
- --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-body-3xs);
387
- --db-type-body-2xs: var(--db-typography-regular-desktop-body-2xs);
388
- --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-body-2xs);
389
- --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-body-2xs);
390
- --db-type-body-xs: var(--db-typography-regular-desktop-body-xs);
391
- --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-body-xs);
392
- --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-body-xs);
393
- --db-type-body-sm: var(--db-typography-regular-desktop-body-sm);
394
- --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-body-sm);
395
- --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-body-sm);
396
- --db-type-body-md: var(--db-typography-regular-desktop-body-md);
397
- --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-desktop-body-md);
398
- --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-body-md);
399
- --db-type-body-lg: var(--db-typography-regular-desktop-body-lg);
400
- --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-body-lg);
401
- --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-body-lg);
402
- --db-type-body-xl: var(--db-typography-regular-desktop-body-xl);
403
- --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-body-xl);
404
- --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-body-xl);
405
- --db-type-body-2xl: var(--db-typography-regular-desktop-body-2xl);
406
- --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-body-2xl);
407
- --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-body-2xl);
408
- --db-type-body-3xl: var(--db-typography-regular-desktop-body-3xl);
409
- --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-body-3xl);
410
- --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-body-3xl);
411
- }
263
+ }
264
+ @media (64em < width) {
265
+ .db-density-regular,
266
+ [data-density=regular] {
267
+ --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
268
+ --db-base-body-icon-weight-3xs: var(--db-base-icon-weight-regular-desktop-body-3xs);
269
+ --db-base-body-icon-font-size-3xs: var(--db-base-icon-font-size-regular-desktop-body-3xs);
270
+ --db-type-body-2xs: var(--db-typography-regular-desktop-body-2xs);
271
+ --db-base-body-icon-weight-2xs: var(--db-base-icon-weight-regular-desktop-body-2xs);
272
+ --db-base-body-icon-font-size-2xs: var(--db-base-icon-font-size-regular-desktop-body-2xs);
273
+ --db-type-body-xs: var(--db-typography-regular-desktop-body-xs);
274
+ --db-base-body-icon-weight-xs: var(--db-base-icon-weight-regular-desktop-body-xs);
275
+ --db-base-body-icon-font-size-xs: var(--db-base-icon-font-size-regular-desktop-body-xs);
276
+ --db-type-body-sm: var(--db-typography-regular-desktop-body-sm);
277
+ --db-base-body-icon-weight-sm: var(--db-base-icon-weight-regular-desktop-body-sm);
278
+ --db-base-body-icon-font-size-sm: var(--db-base-icon-font-size-regular-desktop-body-sm);
279
+ --db-type-body-md: var(--db-typography-regular-desktop-body-md);
280
+ --db-base-body-icon-weight-md: var(--db-base-icon-weight-regular-desktop-body-md);
281
+ --db-base-body-icon-font-size-md: var(--db-base-icon-font-size-regular-desktop-body-md);
282
+ --db-type-body-lg: var(--db-typography-regular-desktop-body-lg);
283
+ --db-base-body-icon-weight-lg: var(--db-base-icon-weight-regular-desktop-body-lg);
284
+ --db-base-body-icon-font-size-lg: var(--db-base-icon-font-size-regular-desktop-body-lg);
285
+ --db-type-body-xl: var(--db-typography-regular-desktop-body-xl);
286
+ --db-base-body-icon-weight-xl: var(--db-base-icon-weight-regular-desktop-body-xl);
287
+ --db-base-body-icon-font-size-xl: var(--db-base-icon-font-size-regular-desktop-body-xl);
288
+ --db-type-body-2xl: var(--db-typography-regular-desktop-body-2xl);
289
+ --db-base-body-icon-weight-2xl: var(--db-base-icon-weight-regular-desktop-body-2xl);
290
+ --db-base-body-icon-font-size-2xl: var(--db-base-icon-font-size-regular-desktop-body-2xl);
291
+ --db-type-body-3xl: var(--db-typography-regular-desktop-body-3xl);
292
+ --db-base-body-icon-weight-3xl: var(--db-base-icon-weight-regular-desktop-body-3xl);
293
+ --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-desktop-body-3xl);
412
294
  }
413
295
  }
414
-
415
- @layer variables {}
416
-
417
- @layer variables {}