@db-ux/core-foundations 4.5.2 → 4.5.4

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 (19) hide show
  1. package/CHANGELOG.md +10 -1
  2. package/build/styles/_screen-sizes.scss +3 -3
  3. package/build/styles/absolute.css +11 -11
  4. package/build/styles/defaults/default-elevation.css +1 -1
  5. package/build/styles/defaults/default-elevation.scss +1 -1
  6. package/build/styles/defaults/default-required.css +1 -1
  7. package/build/styles/defaults/default-root.css +1 -1
  8. package/build/styles/density/classes/all.css +27 -27
  9. package/build/styles/density/classes/expressive.css +9 -9
  10. package/build/styles/density/classes/functional.css +9 -9
  11. package/build/styles/density/classes/regular.css +9 -9
  12. package/build/styles/helpers/_focus.scss +1 -1
  13. package/build/styles/helpers/classes/all.css +1 -1
  14. package/build/styles/helpers/classes/focus.css +1 -1
  15. package/build/styles/index.css +11 -11
  16. package/build/styles/relative.css +11 -11
  17. package/build/styles/rollup.css +11 -11
  18. package/build/styles/webpack.css +11 -11
  19. package/package.json +2 -2
package/build/styles/density/classes/all.css CHANGED
@@ -142,7 +142,7 @@
142
142
  /* stylelint-disable-next-line media-query-no-invalid */
143
143
  /* stylelint-disable-next-line at-rule-empty-line-before */
144
144
  }
145
- @media screen and (width <= 48em) {
145
+ @media (width <= 48em) {
146
146
  .db-density-expressive,
147
147
  [data-density=expressive] {
148
148
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-mobile-3xs);
@@ -156,7 +156,7 @@
156
156
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-mobile-3xl);
157
157
  }
158
158
  }
159
- @media screen and (48em < width <= 64em) {
159
+ @media (48em < width <= 64em) {
160
160
  .db-density-expressive,
161
161
  [data-density=expressive] {
162
162
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-tablet-3xs);
@@ -170,7 +170,7 @@
170
170
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-tablet-3xl);
171
171
  }
172
172
  }
173
- @media screen and (64em < width) {
173
+ @media (64em < width) {
174
174
  .db-density-expressive,
175
175
  [data-density=expressive] {
176
176
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-desktop-3xs);
@@ -218,7 +218,7 @@
218
218
  /* stylelint-disable-next-line media-query-no-invalid */
219
219
  /* stylelint-disable-next-line at-rule-empty-line-before */
220
220
  }
221
- @media screen and (width <= 48em) {
221
+ @media (width <= 48em) {
222
222
  .db-density-regular,
223
223
  [data-density=regular] {
224
224
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
@@ -232,7 +232,7 @@
232
232
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
233
233
  }
234
234
  }
235
- @media screen and (48em < width <= 64em) {
235
+ @media (48em < width <= 64em) {
236
236
  .db-density-regular,
237
237
  [data-density=regular] {
238
238
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
@@ -246,7 +246,7 @@
246
246
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
247
247
  }
248
248
  }
249
- @media screen and (64em < width) {
249
+ @media (64em < width) {
250
250
  .db-density-regular,
251
251
  [data-density=regular] {
252
252
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
@@ -294,7 +294,7 @@
294
294
  /* stylelint-disable-next-line media-query-no-invalid */
295
295
  /* stylelint-disable-next-line at-rule-empty-line-before */
296
296
  }
297
- @media screen and (width <= 48em) {
297
+ @media (width <= 48em) {
298
298
  .db-density-functional,
299
299
  [data-density=functional] {
300
300
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-mobile-3xs);
@@ -308,7 +308,7 @@
308
308
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-mobile-3xl);
309
309
  }
310
310
  }
311
- @media screen and (48em < width <= 64em) {
311
+ @media (48em < width <= 64em) {
312
312
  .db-density-functional,
313
313
  [data-density=functional] {
314
314
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-tablet-3xs);
@@ -322,7 +322,7 @@
322
322
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-tablet-3xl);
323
323
  }
324
324
  }
325
- @media screen and (64em < width) {
325
+ @media (64em < width) {
326
326
  .db-density-functional,
327
327
  [data-density=functional] {
328
328
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-desktop-3xs);
@@ -352,7 +352,7 @@
352
352
  /* stylelint-disable-next-line media-query-no-invalid */
353
353
  /* stylelint-disable-next-line at-rule-empty-line-before */
354
354
  }
355
- @media screen and (width <= 48em) {
355
+ @media (width <= 48em) {
356
356
  .db-density-expressive,
357
357
  [data-density=expressive] {
358
358
  --db-type-headline-3xs: var(--db-typography-expressive-mobile-headline-3xs);
@@ -384,7 +384,7 @@
384
384
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-headline-3xl);
385
385
  }
386
386
  }
387
- @media screen and (48em < width <= 64em) {
387
+ @media (48em < width <= 64em) {
388
388
  .db-density-expressive,
389
389
  [data-density=expressive] {
390
390
  --db-type-headline-3xs: var(--db-typography-expressive-tablet-headline-3xs);
@@ -416,7 +416,7 @@
416
416
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-headline-3xl);
417
417
  }
418
418
  }
419
- @media screen and (64em < width) {
419
+ @media (64em < width) {
420
420
  .db-density-expressive,
421
421
  [data-density=expressive] {
422
422
  --db-type-headline-3xs: var(--db-typography-expressive-desktop-headline-3xs);
@@ -464,7 +464,7 @@
464
464
  /* stylelint-disable-next-line media-query-no-invalid */
465
465
  /* stylelint-disable-next-line at-rule-empty-line-before */
466
466
  }
467
- @media screen and (width <= 48em) {
467
+ @media (width <= 48em) {
468
468
  .db-density-expressive,
469
469
  [data-density=expressive] {
470
470
  --db-type-body-3xs: var(--db-typography-expressive-mobile-body-3xs);
@@ -496,7 +496,7 @@
496
496
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-body-3xl);
497
497
  }
498
498
  }
499
- @media screen and (48em < width <= 64em) {
499
+ @media (48em < width <= 64em) {
500
500
  .db-density-expressive,
501
501
  [data-density=expressive] {
502
502
  --db-type-body-3xs: var(--db-typography-expressive-tablet-body-3xs);
@@ -528,7 +528,7 @@
528
528
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-body-3xl);
529
529
  }
530
530
  }
531
- @media screen and (64em < width) {
531
+ @media (64em < width) {
532
532
  .db-density-expressive,
533
533
  [data-density=expressive] {
534
534
  --db-type-body-3xs: var(--db-typography-expressive-desktop-body-3xs);
@@ -576,7 +576,7 @@
576
576
  /* stylelint-disable-next-line media-query-no-invalid */
577
577
  /* stylelint-disable-next-line at-rule-empty-line-before */
578
578
  }
579
- @media screen and (width <= 48em) {
579
+ @media (width <= 48em) {
580
580
  .db-density-regular,
581
581
  [data-density=regular] {
582
582
  --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
@@ -608,7 +608,7 @@
608
608
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
609
609
  }
610
610
  }
611
- @media screen and (48em < width <= 64em) {
611
+ @media (48em < width <= 64em) {
612
612
  .db-density-regular,
613
613
  [data-density=regular] {
614
614
  --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
@@ -640,7 +640,7 @@
640
640
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
641
641
  }
642
642
  }
643
- @media screen and (64em < width) {
643
+ @media (64em < width) {
644
644
  .db-density-regular,
645
645
  [data-density=regular] {
646
646
  --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
@@ -688,7 +688,7 @@
688
688
  /* stylelint-disable-next-line media-query-no-invalid */
689
689
  /* stylelint-disable-next-line at-rule-empty-line-before */
690
690
  }
691
- @media screen and (width <= 48em) {
691
+ @media (width <= 48em) {
692
692
  .db-density-regular,
693
693
  [data-density=regular] {
694
694
  --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
@@ -720,7 +720,7 @@
720
720
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
721
721
  }
722
722
  }
723
- @media screen and (48em < width <= 64em) {
723
+ @media (48em < width <= 64em) {
724
724
  .db-density-regular,
725
725
  [data-density=regular] {
726
726
  --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
@@ -752,7 +752,7 @@
752
752
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
753
753
  }
754
754
  }
755
- @media screen and (64em < width) {
755
+ @media (64em < width) {
756
756
  .db-density-regular,
757
757
  [data-density=regular] {
758
758
  --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
@@ -800,7 +800,7 @@
800
800
  /* stylelint-disable-next-line media-query-no-invalid */
801
801
  /* stylelint-disable-next-line at-rule-empty-line-before */
802
802
  }
803
- @media screen and (width <= 48em) {
803
+ @media (width <= 48em) {
804
804
  .db-density-functional,
805
805
  [data-density=functional] {
806
806
  --db-type-headline-3xs: var(--db-typography-functional-mobile-headline-3xs);
@@ -832,7 +832,7 @@
832
832
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-headline-3xl);
833
833
  }
834
834
  }
835
- @media screen and (48em < width <= 64em) {
835
+ @media (48em < width <= 64em) {
836
836
  .db-density-functional,
837
837
  [data-density=functional] {
838
838
  --db-type-headline-3xs: var(--db-typography-functional-tablet-headline-3xs);
@@ -864,7 +864,7 @@
864
864
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-headline-3xl);
865
865
  }
866
866
  }
867
- @media screen and (64em < width) {
867
+ @media (64em < width) {
868
868
  .db-density-functional,
869
869
  [data-density=functional] {
870
870
  --db-type-headline-3xs: var(--db-typography-functional-desktop-headline-3xs);
@@ -912,7 +912,7 @@
912
912
  /* stylelint-disable-next-line media-query-no-invalid */
913
913
  /* stylelint-disable-next-line at-rule-empty-line-before */
914
914
  }
915
- @media screen and (width <= 48em) {
915
+ @media (width <= 48em) {
916
916
  .db-density-functional,
917
917
  [data-density=functional] {
918
918
  --db-type-body-3xs: var(--db-typography-functional-mobile-body-3xs);
@@ -944,7 +944,7 @@
944
944
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-body-3xl);
945
945
  }
946
946
  }
947
- @media screen and (48em < width <= 64em) {
947
+ @media (48em < width <= 64em) {
948
948
  .db-density-functional,
949
949
  [data-density=functional] {
950
950
  --db-type-body-3xs: var(--db-typography-functional-tablet-body-3xs);
@@ -976,7 +976,7 @@
976
976
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-body-3xl);
977
977
  }
978
978
  }
979
- @media screen and (64em < width) {
979
+ @media (64em < width) {
980
980
  .db-density-functional,
981
981
  [data-density=functional] {
982
982
  --db-type-body-3xs: var(--db-typography-functional-desktop-body-3xs);
package/build/styles/density/classes/expressive.css CHANGED
@@ -136,7 +136,7 @@
136
136
  /* stylelint-disable-next-line media-query-no-invalid */
137
137
  /* stylelint-disable-next-line at-rule-empty-line-before */
138
138
  }
139
- @media screen and (width <= 48em) {
139
+ @media (width <= 48em) {
140
140
  .db-density-expressive,
141
141
  [data-density=expressive] {
142
142
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-mobile-3xs);
@@ -150,7 +150,7 @@
150
150
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-mobile-3xl);
151
151
  }
152
152
  }
153
- @media screen and (48em < width <= 64em) {
153
+ @media (48em < width <= 64em) {
154
154
  .db-density-expressive,
155
155
  [data-density=expressive] {
156
156
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-tablet-3xs);
@@ -164,7 +164,7 @@
164
164
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-expressive-tablet-3xl);
165
165
  }
166
166
  }
167
- @media screen and (64em < width) {
167
+ @media (64em < width) {
168
168
  .db-density-expressive,
169
169
  [data-density=expressive] {
170
170
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-expressive-desktop-3xs);
@@ -198,7 +198,7 @@
198
198
  /* stylelint-disable-next-line media-query-no-invalid */
199
199
  /* stylelint-disable-next-line at-rule-empty-line-before */
200
200
  }
201
- @media screen and (width <= 48em) {
201
+ @media (width <= 48em) {
202
202
  .db-density-expressive,
203
203
  [data-density=expressive] {
204
204
  --db-type-headline-3xs: var(--db-typography-expressive-mobile-headline-3xs);
@@ -230,7 +230,7 @@
230
230
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-headline-3xl);
231
231
  }
232
232
  }
233
- @media screen and (48em < width <= 64em) {
233
+ @media (48em < width <= 64em) {
234
234
  .db-density-expressive,
235
235
  [data-density=expressive] {
236
236
  --db-type-headline-3xs: var(--db-typography-expressive-tablet-headline-3xs);
@@ -262,7 +262,7 @@
262
262
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-headline-3xl);
263
263
  }
264
264
  }
265
- @media screen and (64em < width) {
265
+ @media (64em < width) {
266
266
  .db-density-expressive,
267
267
  [data-density=expressive] {
268
268
  --db-type-headline-3xs: var(--db-typography-expressive-desktop-headline-3xs);
@@ -310,7 +310,7 @@
310
310
  /* stylelint-disable-next-line media-query-no-invalid */
311
311
  /* stylelint-disable-next-line at-rule-empty-line-before */
312
312
  }
313
- @media screen and (width <= 48em) {
313
+ @media (width <= 48em) {
314
314
  .db-density-expressive,
315
315
  [data-density=expressive] {
316
316
  --db-type-body-3xs: var(--db-typography-expressive-mobile-body-3xs);
@@ -342,7 +342,7 @@
342
342
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-mobile-body-3xl);
343
343
  }
344
344
  }
345
- @media screen and (48em < width <= 64em) {
345
+ @media (48em < width <= 64em) {
346
346
  .db-density-expressive,
347
347
  [data-density=expressive] {
348
348
  --db-type-body-3xs: var(--db-typography-expressive-tablet-body-3xs);
@@ -374,7 +374,7 @@
374
374
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-expressive-tablet-body-3xl);
375
375
  }
376
376
  }
377
- @media screen and (64em < width) {
377
+ @media (64em < width) {
378
378
  .db-density-expressive,
379
379
  [data-density=expressive] {
380
380
  --db-type-body-3xs: var(--db-typography-expressive-desktop-body-3xs);
package/build/styles/density/classes/functional.css CHANGED
@@ -140,7 +140,7 @@
140
140
  /* stylelint-disable-next-line media-query-no-invalid */
141
141
  /* stylelint-disable-next-line at-rule-empty-line-before */
142
142
  }
143
- @media screen and (width <= 48em) {
143
+ @media (width <= 48em) {
144
144
  .db-density-functional,
145
145
  [data-density=functional] {
146
146
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-mobile-3xs);
@@ -154,7 +154,7 @@
154
154
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-mobile-3xl);
155
155
  }
156
156
  }
157
- @media screen and (48em < width <= 64em) {
157
+ @media (48em < width <= 64em) {
158
158
  .db-density-functional,
159
159
  [data-density=functional] {
160
160
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-tablet-3xs);
@@ -168,7 +168,7 @@
168
168
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-functional-tablet-3xl);
169
169
  }
170
170
  }
171
- @media screen and (64em < width) {
171
+ @media (64em < width) {
172
172
  .db-density-functional,
173
173
  [data-density=functional] {
174
174
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-functional-desktop-3xs);
@@ -206,7 +206,7 @@
206
206
  /* stylelint-disable-next-line media-query-no-invalid */
207
207
  /* stylelint-disable-next-line at-rule-empty-line-before */
208
208
  }
209
- @media screen and (width <= 48em) {
209
+ @media (width <= 48em) {
210
210
  .db-density-functional,
211
211
  [data-density=functional] {
212
212
  --db-type-headline-3xs: var(--db-typography-functional-mobile-headline-3xs);
@@ -238,7 +238,7 @@
238
238
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-headline-3xl);
239
239
  }
240
240
  }
241
- @media screen and (48em < width <= 64em) {
241
+ @media (48em < width <= 64em) {
242
242
  .db-density-functional,
243
243
  [data-density=functional] {
244
244
  --db-type-headline-3xs: var(--db-typography-functional-tablet-headline-3xs);
@@ -270,7 +270,7 @@
270
270
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-headline-3xl);
271
271
  }
272
272
  }
273
- @media screen and (64em < width) {
273
+ @media (64em < width) {
274
274
  .db-density-functional,
275
275
  [data-density=functional] {
276
276
  --db-type-headline-3xs: var(--db-typography-functional-desktop-headline-3xs);
@@ -318,7 +318,7 @@
318
318
  /* stylelint-disable-next-line media-query-no-invalid */
319
319
  /* stylelint-disable-next-line at-rule-empty-line-before */
320
320
  }
321
- @media screen and (width <= 48em) {
321
+ @media (width <= 48em) {
322
322
  .db-density-functional,
323
323
  [data-density=functional] {
324
324
  --db-type-body-3xs: var(--db-typography-functional-mobile-body-3xs);
@@ -350,7 +350,7 @@
350
350
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-mobile-body-3xl);
351
351
  }
352
352
  }
353
- @media screen and (48em < width <= 64em) {
353
+ @media (48em < width <= 64em) {
354
354
  .db-density-functional,
355
355
  [data-density=functional] {
356
356
  --db-type-body-3xs: var(--db-typography-functional-tablet-body-3xs);
@@ -382,7 +382,7 @@
382
382
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-functional-tablet-body-3xl);
383
383
  }
384
384
  }
385
- @media screen and (64em < width) {
385
+ @media (64em < width) {
386
386
  .db-density-functional,
387
387
  [data-density=functional] {
388
388
  --db-type-body-3xs: var(--db-typography-functional-desktop-body-3xs);
package/build/styles/density/classes/regular.css CHANGED
@@ -138,7 +138,7 @@
138
138
  /* stylelint-disable-next-line media-query-no-invalid */
139
139
  /* stylelint-disable-next-line at-rule-empty-line-before */
140
140
  }
141
- @media screen and (width <= 48em) {
141
+ @media (width <= 48em) {
142
142
  .db-density-regular,
143
143
  [data-density=regular] {
144
144
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
@@ -152,7 +152,7 @@
152
152
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
153
153
  }
154
154
  }
155
- @media screen and (48em < width <= 64em) {
155
+ @media (48em < width <= 64em) {
156
156
  .db-density-regular,
157
157
  [data-density=regular] {
158
158
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
@@ -166,7 +166,7 @@
166
166
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
167
167
  }
168
168
  }
169
- @media screen and (64em < width) {
169
+ @media (64em < width) {
170
170
  .db-density-regular,
171
171
  [data-density=regular] {
172
172
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
@@ -202,7 +202,7 @@
202
202
  /* stylelint-disable-next-line media-query-no-invalid */
203
203
  /* stylelint-disable-next-line at-rule-empty-line-before */
204
204
  }
205
- @media screen and (width <= 48em) {
205
+ @media (width <= 48em) {
206
206
  .db-density-regular,
207
207
  [data-density=regular] {
208
208
  --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
@@ -234,7 +234,7 @@
234
234
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
235
235
  }
236
236
  }
237
- @media screen and (48em < width <= 64em) {
237
+ @media (48em < width <= 64em) {
238
238
  .db-density-regular,
239
239
  [data-density=regular] {
240
240
  --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
@@ -266,7 +266,7 @@
266
266
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
267
267
  }
268
268
  }
269
- @media screen and (64em < width) {
269
+ @media (64em < width) {
270
270
  .db-density-regular,
271
271
  [data-density=regular] {
272
272
  --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
@@ -314,7 +314,7 @@
314
314
  /* stylelint-disable-next-line media-query-no-invalid */
315
315
  /* stylelint-disable-next-line at-rule-empty-line-before */
316
316
  }
317
- @media screen and (width <= 48em) {
317
+ @media (width <= 48em) {
318
318
  .db-density-regular,
319
319
  [data-density=regular] {
320
320
  --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
@@ -346,7 +346,7 @@
346
346
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
347
347
  }
348
348
  }
349
- @media screen and (48em < width <= 64em) {
349
+ @media (48em < width <= 64em) {
350
350
  .db-density-regular,
351
351
  [data-density=regular] {
352
352
  --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
@@ -378,7 +378,7 @@
378
378
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
379
379
  }
380
380
  }
381
- @media screen and (64em < width) {
381
+ @media (64em < width) {
382
382
  .db-density-regular,
383
383
  [data-density=regular] {
384
384
  --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
package/build/styles/helpers/_focus.scss CHANGED
@@ -11,7 +11,7 @@
11
11
  box-shadow: 0 0 0 #{variables.$db-border-width-xs}
12
12
  var(--db-focus-box-shadow-bg-color, transparent);
13
13
 
14
- @media screen and (prefers-reduced-motion: no-preference) {
14
+ @media (prefers-reduced-motion: no-preference) {
15
15
  // stylelint-disable-next-line no-invalid-position-declaration
16
16
  transition:
17
17
  outline #{variables.$db-transition-duration-extra-fast},
package/build/styles/helpers/classes/all.css CHANGED
@@ -39,7 +39,7 @@
39
39
  outline-offset: var(--db-border-width-xs);
40
40
  box-shadow: 0 0 0 var(--db-border-width-xs) var(--db-focus-box-shadow-bg-color, transparent);
41
41
  }
42
- @media screen and (prefers-reduced-motion: no-preference) {
42
+ @media (prefers-reduced-motion: no-preference) {
43
43
  .db-focus-default:not([data-disable-focus=true]),
44
44
  [data-focus=default]:not([data-disable-focus=true]) {
45
45
  transition: outline var(--db-transition-duration-extra-fast), box-shadow var(--db-transition-duration-extra-fast);
package/build/styles/helpers/classes/focus.css CHANGED
@@ -39,7 +39,7 @@
39
39
  outline-offset: var(--db-border-width-xs);
40
40
  box-shadow: 0 0 0 var(--db-border-width-xs) var(--db-focus-box-shadow-bg-color, transparent);
41
41
  }
42
- @media screen and (prefers-reduced-motion: no-preference) {
42
+ @media (prefers-reduced-motion: no-preference) {
43
43
  .db-focus-default:not([data-disable-focus=true]),
44
44
  [data-focus=default]:not([data-disable-focus=true]) {
45
45
  transition: outline var(--db-transition-duration-extra-fast), box-shadow var(--db-transition-duration-extra-fast);
package/build/styles/index.css CHANGED
@@ -219,7 +219,7 @@ select,
219
219
  outline-offset: var(--db-border-width-xs);
220
220
  box-shadow: 0 0 0 var(--db-border-width-xs) var(--db-focus-box-shadow-bg-color, transparent);
221
221
  }
222
- @media screen and (prefers-reduced-motion: no-preference) {
222
+ @media (prefers-reduced-motion: no-preference) {
223
223
  :not([data-disable-focus=true]):is(a,
224
224
  button,
225
225
  input,
@@ -358,7 +358,7 @@ code {
358
358
  /* stylelint-disable-next-line media-query-no-invalid */
359
359
  /* stylelint-disable-next-line at-rule-empty-line-before */
360
360
  }
361
- @media screen and (width <= 48em) {
361
+ @media (width <= 48em) {
362
362
  :root,
363
363
  :host {
364
364
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-mobile-3xs);
@@ -372,7 +372,7 @@ code {
372
372
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-mobile-3xl);
373
373
  }
374
374
  }
375
- @media screen and (48em < width <= 64em) {
375
+ @media (48em < width <= 64em) {
376
376
  :root,
377
377
  :host {
378
378
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-tablet-3xs);
@@ -386,7 +386,7 @@ code {
386
386
  --db-spacing-responsive-3xl: var(--db-spacing-responsive-regular-tablet-3xl);
387
387
  }
388
388
  }
389
- @media screen and (64em < width) {
389
+ @media (64em < width) {
390
390
  :root,
391
391
  :host {
392
392
  --db-spacing-responsive-3xs: var(--db-spacing-responsive-regular-desktop-3xs);
@@ -422,7 +422,7 @@ code {
422
422
  /* stylelint-disable-next-line media-query-no-invalid */
423
423
  /* stylelint-disable-next-line at-rule-empty-line-before */
424
424
  }
425
- @media screen and (width <= 48em) {
425
+ @media (width <= 48em) {
426
426
  :root,
427
427
  :host {
428
428
  --db-type-headline-3xs: var(--db-typography-regular-mobile-headline-3xs);
@@ -454,7 +454,7 @@ code {
454
454
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-headline-3xl);
455
455
  }
456
456
  }
457
- @media screen and (48em < width <= 64em) {
457
+ @media (48em < width <= 64em) {
458
458
  :root,
459
459
  :host {
460
460
  --db-type-headline-3xs: var(--db-typography-regular-tablet-headline-3xs);
@@ -486,7 +486,7 @@ code {
486
486
  --db-base-headline-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-headline-3xl);
487
487
  }
488
488
  }
489
- @media screen and (64em < width) {
489
+ @media (64em < width) {
490
490
  :root,
491
491
  :host {
492
492
  --db-type-headline-3xs: var(--db-typography-regular-desktop-headline-3xs);
@@ -534,7 +534,7 @@ code {
534
534
  /* stylelint-disable-next-line media-query-no-invalid */
535
535
  /* stylelint-disable-next-line at-rule-empty-line-before */
536
536
  }
537
- @media screen and (width <= 48em) {
537
+ @media (width <= 48em) {
538
538
  :root,
539
539
  :host {
540
540
  --db-type-body-3xs: var(--db-typography-regular-mobile-body-3xs);
@@ -566,7 +566,7 @@ code {
566
566
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-mobile-body-3xl);
567
567
  }
568
568
  }
569
- @media screen and (48em < width <= 64em) {
569
+ @media (48em < width <= 64em) {
570
570
  :root,
571
571
  :host {
572
572
  --db-type-body-3xs: var(--db-typography-regular-tablet-body-3xs);
@@ -598,7 +598,7 @@ code {
598
598
  --db-base-body-icon-font-size-3xl: var(--db-base-icon-font-size-regular-tablet-body-3xl);
599
599
  }
600
600
  }
601
- @media screen and (64em < width) {
601
+ @media (64em < width) {
602
602
  :root,
603
603
  :host {
604
604
  --db-type-body-3xs: var(--db-typography-regular-desktop-body-3xs);
@@ -643,7 +643,7 @@ code {
643
643
  box-shadow: var(--db-elevation-md);
644
644
  /* stylelint-disable-next-line a11y/selector-pseudo-class-focus */
645
645
  }
646
- @media screen and (prefers-reduced-motion: no-preference) {
646
+ @media (prefers-reduced-motion: no-preference) {
647
647
  .db-interactive-elevation,
648
648
  [data-interactive=elevation] {
649
649
  transition: box-shadow var(--db-transition-duration-fast) var(--db-transition-timing-functional);