@marioschmidt/design-system-components 1.0.79 → 1.2.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.
- package/dist/bds/bds.css +1 -1
- package/dist/bds/bds.esm.js +1 -1
- package/dist/bds/{p-30a9c996.entry.js → p-67bc59c5.entry.js} +2 -2
- package/dist/bds/p-Wtf1fKUK.js +3 -0
- package/dist/bds/p-Wtf1fKUK.js.map +1 -0
- package/dist/cjs/bds.cjs.js +1 -1
- package/dist/cjs/ds-button_2.cjs.entry.js +1 -1
- package/dist/cjs/index-B0IsCEmC.js +1398 -0
- package/dist/cjs/index-B0IsCEmC.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/index.js.map +1 -1
- package/dist/esm/bds.js +2 -2
- package/dist/esm/ds-button_2.entry.js +1 -1
- package/dist/esm/index-Wtf1fKUK.js +1391 -0
- package/dist/esm/index-Wtf1fKUK.js.map +1 -0
- package/dist/esm/loader.js +2 -2
- package/dist/www/build/bds.css +1 -1
- package/dist/www/build/bds.esm.js +1 -1
- package/dist/www/build/p-444f99b6.css +1 -0
- package/dist/www/build/{p-30a9c996.entry.js → p-67bc59c5.entry.js} +2 -2
- package/dist/www/build/p-Wtf1fKUK.js +3 -0
- package/dist/www/build/p-Wtf1fKUK.js.map +1 -0
- package/dist/www/css/README.md +74 -1
- package/dist/www/css/advertorial/components/_dsysdocs.css +10 -3
- package/dist/www/css/advertorial/components/article.css +17 -51
- package/dist/www/css/advertorial/components/audioplayer.css +2 -2
- package/dist/www/css/advertorial/components/avatar.css +3 -37
- package/dist/www/css/advertorial/components/badge.css +3 -11
- package/dist/www/css/advertorial/components/breadcrumb.css +6 -24
- package/dist/www/css/advertorial/components/breakingnews.css +2 -18
- package/dist/www/css/advertorial/components/button.css +7 -11
- package/dist/www/css/advertorial/components/card.css +2 -2
- package/dist/www/css/advertorial/components/carousel.css +2 -2
- package/dist/www/css/advertorial/components/chip.css +2 -2
- package/dist/www/css/advertorial/components/datepicker.css +4 -4
- package/dist/www/css/advertorial/components/drawers.css +2 -2
- package/dist/www/css/advertorial/components/dropdown.css +2 -2
- package/dist/www/css/advertorial/components/footer.css +6 -30
- package/dist/www/css/advertorial/components/icon.css +2 -2
- package/dist/www/css/advertorial/components/iconbutton.css +53 -0
- package/dist/www/css/advertorial/components/infoelement.css +2 -2
- package/dist/www/css/advertorial/components/inputfield.css +13 -8
- package/dist/www/css/advertorial/components/liveticker.css +2 -10
- package/dist/www/css/advertorial/components/mediaplayer.css +4 -20
- package/dist/www/css/advertorial/components/menu.css +6 -33
- package/dist/www/css/advertorial/components/newsticker.css +2 -18
- package/dist/www/css/advertorial/components/pagination.css +3 -3
- package/dist/www/css/advertorial/components/paywall.css +3 -12
- package/dist/www/css/advertorial/components/quote.css +2 -2
- package/dist/www/css/advertorial/components/radiobutton.css +2 -2
- package/dist/www/css/advertorial/components/search.css +2 -2
- package/dist/www/css/advertorial/components/sectiontitle.css +2 -2
- package/dist/www/css/advertorial/components/separator.css +2 -2
- package/dist/www/css/advertorial/components/skeletons.css +2 -2
- package/dist/www/css/advertorial/components/slider.css +2 -2
- package/dist/www/css/advertorial/components/specialnavi.css +2 -2
- package/dist/www/css/advertorial/components/spinner.css +2 -2
- package/dist/www/css/advertorial/components/tab.css +2 -18
- package/dist/www/css/advertorial/components/table.css +2 -2
- package/dist/www/css/advertorial/components/teaser.css +2 -42
- package/dist/www/css/advertorial/components/toggleswitch.css +2 -2
- package/dist/www/css/advertorial/components/video.css +2 -2
- package/dist/www/css/advertorial/theme.css +2 -2
- package/dist/www/css/advertorial/tokens.css +197 -336
- package/dist/www/css/bild/components/_dsysdoc.css +2 -6
- package/dist/www/css/bild/components/_dsysdocs.css +10 -3
- package/dist/www/css/bild/components/alert.css +2 -8
- package/dist/www/css/bild/components/article.css +17 -51
- package/dist/www/css/bild/components/audioplayer.css +2 -2
- package/dist/www/css/bild/components/avatar.css +12 -51
- package/dist/www/css/bild/components/badge.css +3 -11
- package/dist/www/css/bild/components/breadcrumb.css +14 -50
- package/dist/www/css/bild/components/breakingnews.css +11 -27
- package/dist/www/css/bild/components/button.css +37 -58
- package/dist/www/css/bild/components/card.css +4 -4
- package/dist/www/css/bild/components/carousel.css +2 -2
- package/dist/www/css/bild/components/chip.css +16 -22
- package/dist/www/css/bild/components/datepicker.css +4 -4
- package/dist/www/css/bild/components/drawers.css +2 -2
- package/dist/www/css/bild/components/dropdown.css +6 -6
- package/dist/www/css/bild/components/empties.css +6 -6
- package/dist/www/css/bild/components/footer.css +6 -30
- package/dist/www/css/bild/components/gallery.css +2 -2
- package/dist/www/css/bild/components/icon.css +2 -2
- package/dist/www/css/bild/components/iconbutton.css +53 -0
- package/dist/www/css/bild/components/infoelement.css +2 -2
- package/dist/www/css/bild/components/inputfield.css +16 -33
- package/dist/www/css/bild/components/kicker.css +6 -6
- package/dist/www/css/bild/components/liveticker.css +2 -10
- package/dist/www/css/bild/components/mediaplayer.css +26 -40
- package/dist/www/css/bild/components/menu.css +18 -46
- package/dist/www/css/bild/components/menuitem.css +8 -29
- package/dist/www/css/bild/components/newsticker.css +4 -20
- package/dist/www/css/bild/components/pagination.css +9 -10
- package/dist/www/css/bild/components/partnerlinks.css +12 -20
- package/dist/www/css/bild/components/paywall.css +3 -12
- package/dist/www/css/bild/components/quote.css +2 -2
- package/dist/www/css/bild/components/radiobutton.css +2 -2
- package/dist/www/css/bild/components/search.css +2 -2
- package/dist/www/css/bild/components/sectiontitle.css +2 -2
- package/dist/www/css/bild/components/selection.css +6 -23
- package/dist/www/css/bild/components/separator.css +2 -2
- package/dist/www/css/bild/components/skeletons.css +2 -2
- package/dist/www/css/bild/components/slider.css +4 -4
- package/dist/www/css/bild/components/specialnavi.css +2 -2
- package/dist/www/css/bild/components/spinner.css +2 -2
- package/dist/www/css/bild/components/subheader.css +3 -3
- package/dist/www/css/bild/components/tab.css +2 -24
- package/dist/www/css/bild/components/table.css +2 -2
- package/dist/www/css/bild/components/teaser.css +6 -46
- package/dist/www/css/bild/components/toggleswitch.css +2 -2
- package/dist/www/css/bild/components/video.css +2 -2
- package/dist/www/css/bild/theme.css +319 -209
- package/dist/www/css/bild/tokens.css +197 -336
- package/dist/www/css/bundles/advertorial.css +380 -706
- package/dist/www/css/bundles/bild.css +839 -1291
- package/dist/www/css/bundles/sportbild.css +846 -1311
- package/dist/www/css/shared/colorprimitive.css +91 -47
- package/dist/www/css/shared/fontprimitive.css +4 -2
- package/dist/www/css/shared/primitives.css +94 -47
- package/dist/www/css/shared/sizeprimitive.css +3 -2
- package/dist/www/css/shared/spaceprimitive.css +2 -2
- package/dist/www/css/sportbild/components/_dsysdoc.css +2 -6
- package/dist/www/css/sportbild/components/_dsysdocs.css +10 -3
- package/dist/www/css/sportbild/components/alert.css +2 -8
- package/dist/www/css/sportbild/components/article.css +17 -52
- package/dist/www/css/sportbild/components/audioplayer.css +2 -2
- package/dist/www/css/sportbild/components/avatar.css +12 -51
- package/dist/www/css/sportbild/components/badge.css +3 -11
- package/dist/www/css/sportbild/components/breadcrumb.css +14 -50
- package/dist/www/css/sportbild/components/breakingnews.css +6 -22
- package/dist/www/css/sportbild/components/button.css +37 -58
- package/dist/www/css/sportbild/components/card.css +4 -4
- package/dist/www/css/sportbild/components/carousel.css +2 -2
- package/dist/www/css/sportbild/components/chip.css +16 -22
- package/dist/www/css/sportbild/components/datepicker.css +4 -4
- package/dist/www/css/sportbild/components/drawers.css +2 -2
- package/dist/www/css/sportbild/components/dropdown.css +6 -6
- package/dist/www/css/sportbild/components/empties.css +6 -6
- package/dist/www/css/sportbild/components/footer.css +6 -30
- package/dist/www/css/sportbild/components/gallery.css +2 -2
- package/dist/www/css/sportbild/components/icon.css +2 -2
- package/dist/www/css/sportbild/components/iconbutton.css +53 -0
- package/dist/www/css/sportbild/components/infoelement.css +2 -2
- package/dist/www/css/sportbild/components/inputfield.css +16 -33
- package/dist/www/css/sportbild/components/kicker.css +6 -6
- package/dist/www/css/sportbild/components/liveticker.css +2 -10
- package/dist/www/css/sportbild/components/mediaplayer.css +26 -40
- package/dist/www/css/sportbild/components/menu.css +23 -53
- package/dist/www/css/sportbild/components/menuitem.css +8 -29
- package/dist/www/css/sportbild/components/newsticker.css +4 -21
- package/dist/www/css/sportbild/components/pagination.css +9 -10
- package/dist/www/css/sportbild/components/partnerlinks.css +12 -20
- package/dist/www/css/sportbild/components/paywall.css +3 -12
- package/dist/www/css/sportbild/components/quote.css +2 -2
- package/dist/www/css/sportbild/components/radiobutton.css +2 -2
- package/dist/www/css/sportbild/components/search.css +2 -2
- package/dist/www/css/sportbild/components/sectiontitle.css +2 -2
- package/dist/www/css/sportbild/components/selection.css +6 -23
- package/dist/www/css/sportbild/components/separator.css +2 -2
- package/dist/www/css/sportbild/components/skeletons.css +2 -2
- package/dist/www/css/sportbild/components/slider.css +4 -4
- package/dist/www/css/sportbild/components/specialnavi.css +2 -2
- package/dist/www/css/sportbild/components/spinner.css +2 -2
- package/dist/www/css/sportbild/components/subheader.css +3 -3
- package/dist/www/css/sportbild/components/tab.css +3 -25
- package/dist/www/css/sportbild/components/table.css +2 -2
- package/dist/www/css/sportbild/components/teaser.css +6 -51
- package/dist/www/css/sportbild/components/toggleswitch.css +2 -2
- package/dist/www/css/sportbild/components/video.css +2 -2
- package/dist/www/css/sportbild/theme.css +319 -209
- package/dist/www/css/sportbild/tokens.css +203 -346
- package/dist/www/index.html +1 -1
- package/package.json +1 -1
- package/dist/bds/p-V1LdMos7.js +0 -3
- package/dist/bds/p-V1LdMos7.js.map +0 -1
- package/dist/cjs/index-CrklIrqc.js +0 -1398
- package/dist/cjs/index-CrklIrqc.js.map +0 -1
- package/dist/esm/index-V1LdMos7.js +0 -1391
- package/dist/esm/index-V1LdMos7.js.map +0 -1
- package/dist/www/build/p-44d36d19.css +0 -1
- package/dist/www/build/p-V1LdMos7.js +0 -3
- package/dist/www/build/p-V1LdMos7.js.map +0 -1
- package/dist/www/css/advertorial/components/accordion.css +0 -29
- package/dist/www/css/bild/components/accordion.css +0 -29
- package/dist/www/css/bild/components/foldout.css +0 -34
- package/dist/www/css/bild/components/hey.css +0 -45
- package/dist/www/css/bild/components/socialsharebutton.css +0 -43
- package/dist/www/css/bild/components/textlink.css +0 -36
- package/dist/www/css/sportbild/components/accordion.css +0 -29
- package/dist/www/css/sportbild/components/foldout.css +0 -34
- package/dist/www/css/sportbild/components/hey.css +0 -45
- package/dist/www/css/sportbild/components/socialsharebutton.css +0 -43
- package/dist/www/css/sportbild/components/textlink.css +0 -36
- /package/dist/bds/{p-30a9c996.entry.js.map → p-67bc59c5.entry.js.map} +0 -0
- /package/dist/www/build/{p-30a9c996.entry.js.map → p-67bc59c5.entry.js.map} +0 -0
package/dist/www/css/README.md
CHANGED
|
@@ -16,6 +16,7 @@
|
|
|
16
16
|
- [📦 Bundle Options](#-bundle-options)
|
|
17
17
|
- [🎨 Token Categories](#-token-categories)
|
|
18
18
|
- [📱 Responsive Tokens](#-responsive-tokens)
|
|
19
|
+
- [🎚️ Density Tokens](#️-density-tokens)
|
|
19
20
|
- [🧩 Component Tokens](#-component-tokens)
|
|
20
21
|
- [✍️ Typography & Effects](#️-typography--effects)
|
|
21
22
|
- [💡 Usage Examples](#-usage-examples)
|
|
@@ -136,7 +137,7 @@ dist/css/
|
|
|
136
137
|
│
|
|
137
138
|
├── bild/ # Modular files
|
|
138
139
|
│ ├── theme.css # Semantic colors + Effects (light/dark)
|
|
139
|
-
│ ├── tokens.css #
|
|
140
|
+
│ ├── tokens.css # Breakpoints + Typography + Density
|
|
140
141
|
│ └── components/ # Component-specific tokens
|
|
141
142
|
│ ├── button.css
|
|
142
143
|
│ ├── article.css
|
|
@@ -380,6 +381,78 @@ Tokens only appear in media queries when values change:
|
|
|
380
381
|
|
|
381
382
|
---
|
|
382
383
|
|
|
384
|
+
## 🎚️ Density Tokens
|
|
385
|
+
|
|
386
|
+
Density tokens control spacing intensity across three modes: `default`, `dense`, and `spacious`.
|
|
387
|
+
|
|
388
|
+
### Semantic Density (tokens.css)
|
|
389
|
+
|
|
390
|
+
Semantic density tokens are included in `tokens.css` and define responsive spacing values:
|
|
391
|
+
|
|
392
|
+
```css
|
|
393
|
+
/* Constant spacing (no breakpoint dependency) */
|
|
394
|
+
[data-content-brand="bild"][data-density="default"] {
|
|
395
|
+
--density-stack-space-const-3-xs: var(--space-0-p-25-x, 2px);
|
|
396
|
+
--density-stack-space-const-sm: var(--space-1-x, 8px);
|
|
397
|
+
--density-stack-space-const-lg: var(--space-2-x, 16px);
|
|
398
|
+
}
|
|
399
|
+
|
|
400
|
+
/* Responsive spacing (breakpoint × density) */
|
|
401
|
+
[data-content-brand="bild"][data-density="default"] {
|
|
402
|
+
--density-xs-stack-space-resp-sm: var(--space-1-x, 8px);
|
|
403
|
+
--density-xs-stack-space-resp-md: var(--space-1-p-5-x, 12px);
|
|
404
|
+
}
|
|
405
|
+
|
|
406
|
+
@media (min-width: 600px) {
|
|
407
|
+
[data-content-brand="bild"][data-density="default"] {
|
|
408
|
+
--density-md-stack-space-resp-sm: var(--space-1-p-5-x, 12px);
|
|
409
|
+
--density-md-stack-space-resp-md: var(--space-2-x, 16px);
|
|
410
|
+
}
|
|
411
|
+
}
|
|
412
|
+
```
|
|
413
|
+
|
|
414
|
+
### Alias Chain: Breakpoint → Density → Primitive
|
|
415
|
+
|
|
416
|
+
Responsive breakpoint tokens reference density tokens, which in turn reference primitives:
|
|
417
|
+
|
|
418
|
+
```css
|
|
419
|
+
/* BreakpointMode → Density → Primitive */
|
|
420
|
+
--stack-space-resp-md: var(--density-xs-stack-space-resp-md);
|
|
421
|
+
↓
|
|
422
|
+
--density-xs-stack-space-resp-md: var(--space-1-p-5-x, 12px);
|
|
423
|
+
↓
|
|
424
|
+
--space-1-p-5-x: 12px;
|
|
425
|
+
```
|
|
426
|
+
|
|
427
|
+
This three-level chain enables:
|
|
428
|
+
- **Density switching** via `data-density` attribute without recompilation
|
|
429
|
+
- **Breakpoint switching** via native `@media` queries
|
|
430
|
+
- **Fallback values** for robustness
|
|
431
|
+
|
|
432
|
+
### Component Density Tokens
|
|
433
|
+
|
|
434
|
+
Component-specific density tokens (e.g., Button, InputField) are in component files:
|
|
435
|
+
|
|
436
|
+
```css
|
|
437
|
+
/* Component density tokens */
|
|
438
|
+
[data-content-brand="bild"][data-density="default"] {
|
|
439
|
+
--density-button-inline-space: var(--space-2-p-5-x, 20px);
|
|
440
|
+
--density-button-stack-space: var(--space-1-x, 8px);
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
[data-content-brand="bild"][data-density="dense"] {
|
|
444
|
+
--density-button-inline-space: var(--space-2-x, 16px);
|
|
445
|
+
--density-button-stack-space: var(--space-0-p-75-x, 6px);
|
|
446
|
+
}
|
|
447
|
+
|
|
448
|
+
[data-content-brand="bild"][data-density="spacious"] {
|
|
449
|
+
--density-button-inline-space: var(--space-3-x, 24px);
|
|
450
|
+
--density-button-stack-space: var(--space-1-p-5-x, 12px);
|
|
451
|
+
}
|
|
452
|
+
```
|
|
453
|
+
|
|
454
|
+
---
|
|
455
|
+
|
|
383
456
|
## 🧩 Component Tokens
|
|
384
457
|
|
|
385
458
|
### Structure per Component
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: _DSysDocs Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -21,8 +21,10 @@
|
|
|
21
21
|
--dsys-docs-width-size: 320px;
|
|
22
22
|
--main-content-stage-size: 320px;
|
|
23
23
|
--foundations-banner-height-size: var(--size-10-x, 80px);
|
|
24
|
+
--doc-label-resp-font-size: 10px;
|
|
24
25
|
--ds-caption-stack-space-0-p-5-x: var(--space-0-p-5-x, 4px);
|
|
25
26
|
--ds-caption-stack-space-1-x: var(--space-1-x, 8px);
|
|
27
|
+
--label-1-responsive-line-height: UNRESOLVED_VariableID:18038:10773;
|
|
26
28
|
--1-column-mobile: 320px;
|
|
27
29
|
--thin-banner-vertical-height-size: 558px;
|
|
28
30
|
--specs-font-family: var(--font-family-gotham, Gotham);
|
|
@@ -34,6 +36,7 @@
|
|
|
34
36
|
:host([data-content-brand="advertorial"]) {
|
|
35
37
|
--dsys-docs-width-size: 750px;
|
|
36
38
|
--main-content-stage-size: 750px;
|
|
39
|
+
--label-1-responsive-line-height: UNRESOLVED_VariableID:18038:10774;
|
|
37
40
|
}
|
|
38
41
|
}
|
|
39
42
|
|
|
@@ -44,8 +47,10 @@
|
|
|
44
47
|
--ds-main-container-space: var(--space-8-p-5-x, 68px);
|
|
45
48
|
--dsys-docs-width-size: 962px;
|
|
46
49
|
--main-content-stage-size: 962px;
|
|
50
|
+
--doc-label-resp-font-size: 15px;
|
|
47
51
|
--ds-caption-stack-space-0-p-5-x: var(--space-0-p-75-x, 6px);
|
|
48
52
|
--ds-caption-stack-space-1-x: var(--space-1-p-5-x, 12px);
|
|
53
|
+
--label-1-responsive-line-height: UNRESOLVED_VariableID:18038:10775;
|
|
49
54
|
--1-column-mobile: 930px;
|
|
50
55
|
--doc-header-height-size: 160px;
|
|
51
56
|
}
|
|
@@ -55,10 +60,12 @@
|
|
|
55
60
|
[data-content-brand="advertorial"],
|
|
56
61
|
:host([data-content-brand="advertorial"]) {
|
|
57
62
|
--dsys-docs-width-size: 1440px;
|
|
58
|
-
--main-content-stage-size:
|
|
63
|
+
--main-content-stage-size: 1024px;
|
|
59
64
|
--foundations-banner-height-size: var(--size-17-p-5-x, 140px);
|
|
65
|
+
--doc-label-resp-font-size: 17px;
|
|
60
66
|
--ds-caption-stack-space-0-p-5-x: var(--space-1-x, 8px);
|
|
61
67
|
--ds-caption-stack-space-1-x: var(--space-2-x, 16px);
|
|
68
|
+
--label-1-responsive-line-height: UNRESOLVED_VariableID:18038:10776;
|
|
62
69
|
--1-column-mobile: 656px;
|
|
63
70
|
--thin-banner-vertical-height-size: 186px;
|
|
64
71
|
--doc-header-height-size: 180px;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Article Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -22,90 +22,56 @@
|
|
|
22
22
|
line-height: var(--kicker-1-line-height);
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
[data-content-brand="advertorial"] .article-image-caption,
|
|
26
|
-
:host([data-content-brand="advertorial"]) .article-image-caption {
|
|
27
|
-
font-family: var(--body-font-family);
|
|
28
|
-
font-weight: var(--font-weight-bold, 700);
|
|
29
|
-
font-size: var(--article-image-caption-font-size);
|
|
30
|
-
line-height: var(--article-image-caption-line-height);
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
[data-content-brand="advertorial"] .article-headline,
|
|
34
|
-
:host([data-content-brand="advertorial"]) .article-headline {
|
|
35
|
-
font-family: var(--headline-font-family);
|
|
36
|
-
font-weight: 900;
|
|
37
|
-
font-size: var(--headline-2-font-size);
|
|
38
|
-
line-height: var(--headline-2-font-size);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
[data-content-brand="advertorial"] .article-meta-source,
|
|
42
|
-
:host([data-content-brand="advertorial"]) .article-meta-source {
|
|
43
|
-
font-family: var(--footnote-font-family);
|
|
44
|
-
font-weight: var(--footnote-font-weight-book);
|
|
45
|
-
font-size: 13px;
|
|
46
|
-
line-height: 19px;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
[data-content-brand="advertorial"] .article-time-stamp,
|
|
50
|
-
:host([data-content-brand="advertorial"]) .article-time-stamp {
|
|
51
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
52
|
-
font-weight: var(--font-weight-black, 800);
|
|
53
|
-
font-size: 12px;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
25
|
/* === BREAKPOINT TOKENS === */
|
|
57
26
|
|
|
58
27
|
[data-content-brand="advertorial"],
|
|
59
28
|
:host([data-content-brand="advertorial"]) {
|
|
60
29
|
--aricle-mobile-1-col-grid-image-margin-space: var(--space-0-x, 0px);
|
|
61
30
|
--article-top-margin-space: var(--stack-space-resp-sm);
|
|
62
|
-
--article-kicker-font-size: var(--kicker-1-font-size);
|
|
63
|
-
--article-headline-font-size: var(--headline-2-font-size);
|
|
64
|
-
--article-gallery-ateaser-width: 145px;
|
|
65
|
-
--article-image-caption-font-size: 13px;
|
|
66
|
-
--article-image-source-font-size: 13px;
|
|
67
|
-
--article-image-caption-line-height: 19.5px;
|
|
68
|
-
--article-image-source-line-height: 19px;
|
|
69
31
|
--article-content-stack-space: var(--stack-space-resp-lg);
|
|
70
32
|
--article-headings-stack-space: var(--space-1-p-5-x, 12px);
|
|
71
33
|
--article-image-landscape-inline-space: var(--space-0-x, 0px);
|
|
72
|
-
--article-meta-font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
73
|
-
--article-meta-font-size: 12px;
|
|
74
34
|
--article-content-inline-space: var(--space-2-x, 16px);
|
|
75
35
|
--article-headings-inline-space: var(--space-2-x, 16px);
|
|
76
36
|
--article-image-portait-inline-space: var(--space-0-x, 0px);
|
|
77
37
|
--article-image-container-stack-space: var(--stack-space-resp-sm);
|
|
78
38
|
--article-infobox-inline-space: var(--inline-space-resp-lg);
|
|
79
39
|
--article-infobox-stack-space: var(--stack-space-resp-lg);
|
|
40
|
+
--article-kicker-font-size: var(--kicker-1-font-size);
|
|
41
|
+
--article-headline-font-size: var(--headline-2-font-size);
|
|
42
|
+
--article-image-caption-font-size: 13px;
|
|
43
|
+
--article-image-source-font-size: 13px;
|
|
44
|
+
--article-meta-font-size: 12px;
|
|
45
|
+
--article-image-caption-line-height: 19.5px;
|
|
46
|
+
--article-image-source-line-height: 19px;
|
|
47
|
+
--article-meta-font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
80
48
|
}
|
|
81
49
|
|
|
82
50
|
@media (min-width: 600px) {
|
|
83
51
|
[data-content-brand="advertorial"],
|
|
84
52
|
:host([data-content-brand="advertorial"]) {
|
|
85
53
|
--aricle-mobile-1-col-grid-image-margin-space: var(--space-9-x, 72px);
|
|
86
|
-
--article-headline-font-size: var(--headline-1-font-size);
|
|
87
|
-
--article-gallery-ateaser-width: 260px;
|
|
88
54
|
--article-image-landscape-inline-space: var(--space-1-p-5-x, 12px);
|
|
89
|
-
--article-meta-font-size: 14px;
|
|
90
55
|
--article-content-inline-space: var(--space-9-x, 72px);
|
|
91
56
|
--article-headings-inline-space: var(--space-9-x, 72px);
|
|
92
57
|
--article-image-portait-inline-space: var(--space-9-x, 72px);
|
|
58
|
+
--article-headline-font-size: var(--headline-1-font-size);
|
|
59
|
+
--article-meta-font-size: 14px;
|
|
93
60
|
}
|
|
94
61
|
}
|
|
95
62
|
|
|
96
63
|
@media (min-width: 1024px) {
|
|
97
64
|
[data-content-brand="advertorial"],
|
|
98
65
|
:host([data-content-brand="advertorial"]) {
|
|
99
|
-
--article-gallery-ateaser-width: 300px;
|
|
100
|
-
--article-image-caption-font-size: 16px;
|
|
101
|
-
--article-image-source-font-size: 16px;
|
|
102
|
-
--article-image-caption-line-height: 24px;
|
|
103
|
-
--article-image-source-line-height: 24px;
|
|
104
66
|
--article-headings-stack-space: var(--space-2-x, 16px);
|
|
105
67
|
--article-image-landscape-inline-space: var(--space-2-x, 16px);
|
|
106
|
-
--article-meta-font-size: 16px;
|
|
107
68
|
--article-content-inline-space: 162px;
|
|
108
69
|
--article-headings-inline-space: var(--space-2-x, 16px);
|
|
109
70
|
--article-image-portait-inline-space: 162px;
|
|
71
|
+
--article-image-caption-font-size: 16px;
|
|
72
|
+
--article-image-source-font-size: 16px;
|
|
73
|
+
--article-meta-font-size: 16px;
|
|
74
|
+
--article-image-caption-line-height: 24px;
|
|
75
|
+
--article-image-source-line-height: 24px;
|
|
110
76
|
}
|
|
111
77
|
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: AudioPlayer Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Avatar Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -22,40 +22,6 @@
|
|
|
22
22
|
text-transform: uppercase;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
[data-content-brand="advertorial"] .avatar-default,
|
|
26
|
-
:host([data-content-brand="advertorial"]) .avatar-default {
|
|
27
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
28
|
-
font-weight: var(--font-weight-bold, 700);
|
|
29
|
-
font-size: 13px;
|
|
30
|
-
line-height: 21px;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
[data-content-brand="advertorial"] .avatar-hover,
|
|
34
|
-
:host([data-content-brand="advertorial"]) .avatar-hover {
|
|
35
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
36
|
-
font-weight: var(--label-font-weight-bold);
|
|
37
|
-
font-size: 13px;
|
|
38
|
-
line-height: 21px;
|
|
39
|
-
text-decoration: underline;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
[data-content-brand="advertorial"] .avatar-secondary-info,
|
|
43
|
-
:host([data-content-brand="advertorial"]) .avatar-secondary-info {
|
|
44
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
45
|
-
font-weight: var(--label-font-weight-book);
|
|
46
|
-
font-size: 13px;
|
|
47
|
-
line-height: 21px;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
[data-content-brand="advertorial"] .avatar-secondary-info-hover,
|
|
51
|
-
:host([data-content-brand="advertorial"]) .avatar-secondary-info-hover {
|
|
52
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
53
|
-
font-weight: var(--label-font-weight-book);
|
|
54
|
-
font-size: 13px;
|
|
55
|
-
line-height: 21px;
|
|
56
|
-
text-decoration: underline;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
25
|
/* === BREAKPOINT TOKENS === */
|
|
60
26
|
|
|
61
27
|
[data-content-brand="advertorial"],
|
|
@@ -63,7 +29,7 @@
|
|
|
63
29
|
--avatar-label-font-size: 13px;
|
|
64
30
|
--avatar-article-size: var(--size-const-md);
|
|
65
31
|
--avatar-author-page-size: var(--size-12-x, 96px);
|
|
66
|
-
--avatar-font-family: var(--font-family
|
|
32
|
+
--avatar-font-family: var(--body-font-family);
|
|
67
33
|
--avatar-label-line-height: 21px;
|
|
68
34
|
--avatar-lane-gap-space: var(--space-2-x, 16px);
|
|
69
35
|
--app-avatar-font-family: var(--title-font-family);
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Badge Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -16,20 +16,12 @@
|
|
|
16
16
|
|
|
17
17
|
[data-content-brand="advertorial"] .video-ad-badge,
|
|
18
18
|
:host([data-content-brand="advertorial"]) .video-ad-badge {
|
|
19
|
-
font-family: var(--font-family
|
|
19
|
+
font-family: var(--body-font-family);
|
|
20
20
|
font-weight: var(--font-weight-book, 400);
|
|
21
21
|
font-size: 14px;
|
|
22
22
|
text-transform: uppercase;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
[data-content-brand="advertorial"] .video-time-badge,
|
|
26
|
-
:host([data-content-brand="advertorial"]) .video-time-badge {
|
|
27
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
28
|
-
font-weight: var(--label-font-weight-book);
|
|
29
|
-
font-size: 16px;
|
|
30
|
-
line-height: 21px;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
25
|
/* === BREAKPOINT TOKENS === */
|
|
34
26
|
|
|
35
27
|
[data-content-brand="advertorial"],
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Breadcrumb Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -16,41 +16,23 @@
|
|
|
16
16
|
|
|
17
17
|
[data-content-brand="advertorial"] .breadcrumb,
|
|
18
18
|
:host([data-content-brand="advertorial"]) .breadcrumb {
|
|
19
|
-
font-family: var(--font-family
|
|
20
|
-
font-weight: var(--font-weight-bold
|
|
19
|
+
font-family: var(--body-font-family);
|
|
20
|
+
font-weight: var(--body-font-weight-bold);
|
|
21
21
|
font-size: var(--breadcrumb-font-size);
|
|
22
22
|
line-height: var(--breadcrumb-line-height);
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
[data-content-brand="advertorial"] .breadcrumb-link,
|
|
26
|
-
:host([data-content-brand="advertorial"]) .breadcrumb-link {
|
|
27
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
28
|
-
font-weight: var(--font-weight-bold, 700);
|
|
29
|
-
font-size: 15px;
|
|
30
|
-
line-height: 15px;
|
|
31
|
-
text-decoration: underline;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
[data-content-brand="advertorial"] .breadcrumb-link-hover,
|
|
35
|
-
:host([data-content-brand="advertorial"]) .breadcrumb-link-hover {
|
|
36
|
-
font-family: var(--font-family-lucida-grande, Lucida Grande);
|
|
37
|
-
font-weight: var(--body-font-weight-bold);
|
|
38
|
-
font-size: 15px;
|
|
39
|
-
line-height: 15px;
|
|
40
|
-
text-decoration: underline;
|
|
41
|
-
}
|
|
42
|
-
|
|
43
25
|
/* === BREAKPOINT TOKENS === */
|
|
44
26
|
|
|
45
27
|
[data-content-brand="advertorial"],
|
|
46
28
|
:host([data-content-brand="advertorial"]) {
|
|
47
29
|
--breadcrumb-font-size: 15px;
|
|
48
|
-
--breadcrumb-font-family: var(--font-family
|
|
30
|
+
--breadcrumb-font-family: var(--body-font-family);
|
|
49
31
|
--breadcrumb-arrow-left-inline-space-1: 3px;
|
|
50
32
|
--breadcrumb-arrow-right-inline-space-2: 5px;
|
|
51
33
|
--breadcrumb-inline-space: var(--grid-space-resp-base);
|
|
52
34
|
--breadcrumb-line-height: 15px;
|
|
53
|
-
--breadcrumb-font-weight: var(--font-weight-bold
|
|
35
|
+
--breadcrumb-font-weight: var(--body-font-weight-bold);
|
|
54
36
|
--breadcrumb-stack-space: 14px;
|
|
55
37
|
}
|
|
56
38
|
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: BreakingNews Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -23,22 +23,6 @@
|
|
|
23
23
|
text-transform: uppercase;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
[data-content-brand="advertorial"] .breaking-news-upper-title,
|
|
27
|
-
:host([data-content-brand="advertorial"]) .breaking-news-upper-title {
|
|
28
|
-
font-family: var(--title-font-family);
|
|
29
|
-
font-weight: var(--title-font-weight);
|
|
30
|
-
font-size: 13px;
|
|
31
|
-
line-height: 13px;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
[data-content-brand="advertorial"] .breaking-news-lower-title,
|
|
35
|
-
:host([data-content-brand="advertorial"]) .breaking-news-lower-title {
|
|
36
|
-
font-family: var(--title-font-family);
|
|
37
|
-
font-weight: var(--title-font-weight);
|
|
38
|
-
font-size: 23px;
|
|
39
|
-
line-height: 21px;
|
|
40
|
-
}
|
|
41
|
-
|
|
42
26
|
/* === BREAKPOINT TOKENS === */
|
|
43
27
|
|
|
44
28
|
[data-content-brand="advertorial"],
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Button Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
--density-button-stack-space: var(--space-1-x, 8px);
|
|
25
25
|
--density-button-label-font-size: 17px;
|
|
26
26
|
--density-button-inline-space: var(--space-2-p-5-x, 20px);
|
|
27
|
+
--density-button-height-size: var(--size-5-x, 40px);
|
|
27
28
|
|
|
28
29
|
}
|
|
29
30
|
|
|
@@ -37,6 +38,7 @@
|
|
|
37
38
|
--density-button-stack-space: var(--space-0-p-75-x, 6px);
|
|
38
39
|
--density-button-label-font-size: 15px;
|
|
39
40
|
--density-button-inline-space: var(--space-2-x, 16px);
|
|
41
|
+
--density-button-height-size: var(--size-4-p-5-x, 36px);
|
|
40
42
|
|
|
41
43
|
}
|
|
42
44
|
|
|
@@ -50,6 +52,7 @@
|
|
|
50
52
|
--density-button-stack-space: var(--space-1-p-5-x, 12px);
|
|
51
53
|
--density-button-label-font-size: 19px;
|
|
52
54
|
--density-button-inline-space: var(--space-3-x, 24px);
|
|
55
|
+
--density-button-height-size: var(--size-6-x, 48px);
|
|
53
56
|
|
|
54
57
|
}
|
|
55
58
|
|
|
@@ -61,18 +64,10 @@
|
|
|
61
64
|
font-weight: 700;
|
|
62
65
|
font-size: var(--button-label-font-size);
|
|
63
66
|
line-height: var(--button-label-line-height);
|
|
64
|
-
letter-spacing: var(--letter-
|
|
67
|
+
letter-spacing: var(--letter-space-positive-sm);
|
|
65
68
|
text-transform: uppercase;
|
|
66
69
|
}
|
|
67
70
|
|
|
68
|
-
[data-content-brand="advertorial"] .partner-link-button-label,
|
|
69
|
-
:host([data-content-brand="advertorial"]) .partner-link-button-label {
|
|
70
|
-
font-family: var(--label-font-family);
|
|
71
|
-
font-weight: var(--label-font-weight-book);
|
|
72
|
-
font-size: var(--partner-link-button-label-font-size);
|
|
73
|
-
line-height: 16px;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
71
|
/* === BREAKPOINT TOKENS === */
|
|
77
72
|
|
|
78
73
|
[data-content-brand="advertorial"],
|
|
@@ -89,6 +84,7 @@
|
|
|
89
84
|
--button-stack-space: var(--density-button-stack-space);
|
|
90
85
|
--button-border-radius: var(--border-radius-md);
|
|
91
86
|
--button-label-font-family: var(--label-font-family);
|
|
87
|
+
--button-height-size: var(--density-button-height-size);
|
|
92
88
|
}
|
|
93
89
|
|
|
94
90
|
@media (min-width: 1024px) {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Card Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Carousel Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Chip Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Datepicker Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -16,7 +16,7 @@
|
|
|
16
16
|
|
|
17
17
|
[data-content-brand="advertorial"],
|
|
18
18
|
:host([data-content-brand="advertorial"]) {
|
|
19
|
-
--datepicker-item-day-width-size: 44px;
|
|
20
|
-
--datepicker-item-height-size: 44px;
|
|
19
|
+
--datepicker-item-day-width-size: var(--size-5-p-5-x, 44px);
|
|
20
|
+
--datepicker-item-height-size: var(--size-5-p-5-x, 44px);
|
|
21
21
|
--datepicker-item-year-width-size: 77px;
|
|
22
22
|
}
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Drawers Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Do not edit directly, this file was auto-generated.
|
|
3
3
|
*
|
|
4
|
-
* BILD Design System Tokens v1.0
|
|
4
|
+
* BILD Design System Tokens v1.2.0
|
|
5
5
|
* Generated by Style Dictionary v4.2.0
|
|
6
6
|
*
|
|
7
7
|
* Brand: Advertorial | Bundle: Dropdown Component Tokens
|
|
8
8
|
*
|
|
9
|
-
* Copyright (c)
|
|
9
|
+
* Copyright (c) 2026 Axel Springer Deutschland GmbH
|
|
10
10
|
* Proprietary and confidential. All rights reserved.
|
|
11
11
|
*
|
|
12
12
|
* Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/css.md
|