@wix/design-system-tokens 1.219.0 → 1.219.1

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 (23) hide show
  1. package/CHANGELOG.md +22 -4
  2. package/all.css +10 -0
  3. package/all.scss +10 -0
  4. package/all.st.css +20 -0
  5. package/component.st.css +20 -0
  6. package/odeditor/all.css +12 -2
  7. package/odeditor/all.scss +12 -2
  8. package/odeditor/all.st.css +22 -2
  9. package/odeditor/component.st.css +22 -2
  10. package/odeditor-dark/all.css +16 -6
  11. package/odeditor-dark/all.scss +16 -6
  12. package/odeditor-dark/all.st.css +27 -7
  13. package/odeditor-dark/component.st.css +25 -5
  14. package/odeditor-dark/semantic.st.css +2 -2
  15. package/package.json +2 -2
  16. package/studio/all.css +10 -0
  17. package/studio/all.scss +10 -0
  18. package/studio/all.st.css +20 -0
  19. package/studio/component.st.css +20 -0
  20. package/wixel/all.css +10 -0
  21. package/wixel/all.scss +10 -0
  22. package/wixel/all.st.css +20 -0
  23. package/wixel/component.st.css +20 -0
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## 1.219.1
2
+
3
+ ### Patch Changes
4
+
5
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-accordion-padding-horizontal-large` (16px) and `--wds-accordion-padding-horizontal-medium` (12px) component tokens in Studio 2.0 (odeditor-dark); the semantic `--wds-space-padding-horizontal-*` scale is unaffected.
6
+
7
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-badge-solid-neutral-success-label-color`, `--wds-badge-solid-neutral-danger-label-color` and `--wds-badge-solid-warning-light-label-color`: `--wds-color-text-standard-primary` in light themes, `--wds-color-text-standard-secondary` (white) in Studio 2.0 (odeditor-dark).
8
+
9
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Fix `--wds-illustration-color-6` in Studio 2.0 (odeditor-dark): it now resolves to `#002294` (blue) instead of `#EAEFFF`, matching the Figma illustrations library. Affects illustrations such as BookingsStrip and ImagePositionLeft whose detail shapes rendered too light in dark theme.
10
+
11
+ - [#16661](https://github.com/wix-private/wix-design-systems/pull/16661) [`286e414`](https://github.com/wix-private/wix-design-systems/commit/286e414c0fbcad2de68fb9187831368ed78bb798) - Surface overlay blur: `--wds-color-fill-surface-overlay-blur` in Studio 2.0 (odeditor-dark) changed from `rgba(33, 33, 34, 0.96)` to `rgba(33, 33, 34, 0.98)` — affects popovers and side panels.
12
+
13
+ - [#16660](https://github.com/wix-private/wix-design-systems/pull/16660) [`8539804`](https://github.com/wix-private/wix-design-systems/commit/853980426902e9a19758b2a9ddc6c6197cdaff5f) - Popover: `--wds-popover-border-fill` in Studio 2.0 (odeditor-dark) now resolves to `--wds-color-black-750` (`#2D2D2E`) instead of `--wds-color-black-700` (`#3A3A3B`).
14
+
15
+ - [#16611](https://github.com/wix-private/wix-design-systems/pull/16611) [`9990b46`](https://github.com/wix-private/wix-design-systems/commit/9990b463c8654f35201d80404f8e720fe04b55ac) - Modal help-button token changes in Harmony (odeditor) and Studio 2.0 (odeditor-dark): added `--wds-message-modal-help-button-icon-size` (`var(--wds-space-475)` in those themes, `var(--wds-space-400)` in the default theme, `var(--wds-space-600)` in Studio (studio) and Wixel (wixel)); `--wds-message-modal-help-button-size` changed from `var(--wds-space-700)` to `var(--wds-space-600)`; `--wds-announcement-modal-help-button-fill` changed from `var(--wds-color-fill-dark-secondary)` to `transparent`; added `--wds-message-modal-text-font-weight` (`var(--wds-font-weight-regular)` in those themes, `var(--wds-font-weight-medium)` everywhere else, matching their current rendering). No other tokens affected.
16
+
17
+ - [#16690](https://github.com/wix-private/wix-design-systems/pull/16690) [`dfbd2bb`](https://github.com/wix-private/wix-design-systems/commit/dfbd2bbc17fa0f0ef971b4934f0d04bc26739dc8) - Add `--wds-page-header-breadcrumbs-offset-small/medium/large` tokens, the negative inline-start offset Page.Header applies to a breadcrumb trail so the first crumb's text lines up with the page title. Values mirror each theme's own `--wds-breadcrumbs-padding-horizontal-*`: default `-6px`/`-9px`/`-15px`, Studio `-4px`/`-8px`/`-16px`, and `0` for Harmony (odeditor), Studio 2.0 (odeditor-dark) and Wixel, which keep their current rendering. No other tokens affected.
18
+
19
+ - [#16680](https://github.com/wix-private/wix-design-systems/pull/16680) [`1bcc73b`](https://github.com/wix-private/wix-design-systems/commit/1bcc73b176aae2a200e81d61865f2bd906f36608) - Add `--wds-top-banner-content-color` token: light content on themes with the purple banner fill, dark content on Harmony (odeditor)'s light fill.
20
+
1
21
  ## 1.219.0 - 2026-07-28
2
22
 
3
23
  ### Visual Breaking Changes
@@ -354,7 +374,7 @@
354
374
 
355
375
  ### Visual Breaking Changes
356
376
 
357
- - breaking(AddItem): add token [15282](https://github.com/wix-private/wix-design-systems/pull/15282)
377
+ - breaking(AddItem): add token [15282](https://github.com/wix-private/wix-design-systems/pull/15282)
358
378
  - breaking(TableListItem): update border color & radius [15278](https://github.com/wix-private/wix-design-systems/pull/15278)
359
379
  - breaking(SegmentedToggle): e3 container border radius [15280](https://github.com/wix-private/wix-design-systems/pull/15280)
360
380
  - breaking(NestableListItem): add tokens [15255](https://github.com/wix-private/wix-design-systems/pull/15255)
@@ -456,7 +476,7 @@
456
476
 
457
477
  ### Features
458
478
 
459
- - feat(Tooltip): tokenization [15155](https://github.com/wix-private/wix-design-systems/pull/15155)
479
+ - feat(Tooltip): tokenization [15155](https://github.com/wix-private/wix-design-systems/pull/15155)
460
480
 
461
481
  ## 1.124.0 - 2025-08-04
462
482
 
@@ -740,5 +760,3 @@
740
760
  ### Bug Fixes
741
761
 
742
762
  - fix(InputArea): fix vertical padding tokens adjusted to sum up to correct height [13204](https://github.com/wix-private/wix-design-systems/pull/13204)
743
-
744
-
package/all.css CHANGED
@@ -323,6 +323,9 @@
323
323
  --wds-radio-size: 16px;
324
324
  --wds-radio-dot-size: 10px;
325
325
  --wds-page-header-title-minimised-line-height: 30px;
326
+ --wds-page-header-breadcrumbs-offset-small: -6px;
327
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
328
+ --wds-page-header-breadcrumbs-offset-large: -15px;
326
329
  --wds-page-header-back-button-gap: 8px;
327
330
  --wds-message-modal-close-button-fill: transparent;
328
331
  --wds-marketing-layout-title-font-size-tiny: 20px;
@@ -1234,12 +1237,14 @@
1234
1237
  --wds-message-modal-top-controls-paddings: var(--wds-space-100);
1235
1238
  --wds-message-modal-top-controls-gap: var(--wds-space-50);
1236
1239
  --wds-message-modal-title-font-family: var(--wds-font-family-default);
1240
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-medium);
1237
1241
  --wds-message-modal-padding-vertical: var(--wds-space-400);
1238
1242
  --wds-message-modal-padding-horizontal: var(--wds-space-400);
1239
1243
  --wds-message-modal-illustration-margin-top: var(--wds-space-300);
1240
1244
  --wds-message-modal-illustration-margin-start: var(--wds-space-400);
1241
1245
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
1242
1246
  --wds-message-modal-help-button-size: var(--wds-space-500);
1247
+ --wds-message-modal-help-button-icon-size: var(--wds-space-400);
1243
1248
  --wds-message-modal-content-gap: var(--wds-space-200);
1244
1249
  --wds-message-modal-close-button-size: var(--wds-space-500);
1245
1250
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -1634,6 +1639,7 @@
1634
1639
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1635
1640
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1636
1641
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-primary);
1642
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary-light);
1637
1643
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1638
1644
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-small);
1639
1645
  --wds-tooltip-border-radius: var(--wds-border-radius-surface-overlay);
@@ -2187,6 +2193,9 @@
2187
2193
  --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
2188
2194
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2189
2195
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2196
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2197
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2198
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2190
2199
  --wds-badge-outline-warning-label-color: var(--wds-color-text-warning);
2191
2200
  --wds-badge-outline-warning-fill: var(--wds-color-fill-warning-tertiary);
2192
2201
  --wds-badge-outline-warning-border-color: var(--wds-color-border-warning-primary);
@@ -2233,6 +2242,7 @@
2233
2242
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-medium);
2234
2243
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2235
2244
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2245
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2236
2246
  --wds-accordion-padding-horizontal-large: var(--wds-space-padding-horizontal-large);
2237
2247
  --wds-accordion-inner-content-shadow-last: var(--wds-shadow-inner-300-top);
2238
2248
  --wds-accordion-inner-content-padding-bottom: var(--wds-space-padding-vertical-small);
package/all.scss CHANGED
@@ -106,6 +106,9 @@
106
106
  --wds-radio-size: 16px;
107
107
  --wds-radio-dot-size: 10px;
108
108
  --wds-page-header-title-minimised-line-height: 30px;
109
+ --wds-page-header-breadcrumbs-offset-small: -6px;
110
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
111
+ --wds-page-header-breadcrumbs-offset-large: -15px;
109
112
  --wds-page-header-back-button-gap: 8px;
110
113
  --wds-message-modal-close-button-fill: transparent;
111
114
  --wds-marketing-layout-title-font-size-tiny: 20px;
@@ -881,12 +884,14 @@
881
884
  --wds-message-modal-top-controls-paddings: var(--wds-space-100);
882
885
  --wds-message-modal-top-controls-gap: var(--wds-space-50);
883
886
  --wds-message-modal-title-font-family: var(--wds-font-family-default);
887
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-medium);
884
888
  --wds-message-modal-padding-vertical: var(--wds-space-400);
885
889
  --wds-message-modal-padding-horizontal: var(--wds-space-400);
886
890
  --wds-message-modal-illustration-margin-top: var(--wds-space-300);
887
891
  --wds-message-modal-illustration-margin-start: var(--wds-space-400);
888
892
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
889
893
  --wds-message-modal-help-button-size: var(--wds-space-500);
894
+ --wds-message-modal-help-button-icon-size: var(--wds-space-400);
890
895
  --wds-message-modal-content-gap: var(--wds-space-200);
891
896
  --wds-message-modal-close-button-size: var(--wds-space-500);
892
897
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -1616,6 +1621,7 @@
1616
1621
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1617
1622
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1618
1623
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-primary);
1624
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary-light);
1619
1625
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1620
1626
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-small);
1621
1627
  --wds-tooltip-border-radius: var(--wds-border-radius-surface-overlay);
@@ -2187,6 +2193,9 @@
2187
2193
  --wds-button-border-dark-secondary-active: var(--wds-color-fill-dark-primary);
2188
2194
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2189
2195
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2196
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2197
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2198
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2190
2199
  --wds-badge-outline-warning-label-color: var(--wds-color-text-warning);
2191
2200
  --wds-badge-outline-warning-fill: var(--wds-color-fill-warning-tertiary);
2192
2201
  --wds-badge-outline-warning-border-color: var(--wds-color-border-warning-primary);
@@ -2233,6 +2242,7 @@
2233
2242
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-medium);
2234
2243
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2235
2244
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2245
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2236
2246
  --wds-accordion-padding-horizontal-large: var(--wds-space-padding-horizontal-large);
2237
2247
  --wds-accordion-inner-content-shadow-last: var(--wds-shadow-inner-300-top);
2238
2248
  --wds-accordion-inner-content-padding-bottom: var(--wds-space-padding-vertical-small);
package/all.st.css CHANGED
@@ -12,6 +12,7 @@
12
12
  @property st-global(--wds-accordion-inner-content-shadow);
13
13
  @property st-global(--wds-accordion-inner-content-shadow-last);
14
14
  @property st-global(--wds-accordion-padding-horizontal-large);
15
+ @property st-global(--wds-accordion-padding-horizontal-medium);
15
16
  @property st-global(--wds-accordion-title-fill);
16
17
  @property st-global(--wds-accordion-title-fill-hover);
17
18
  @property st-global(--wds-accordion-title-font-line-height-medium);
@@ -121,6 +122,9 @@
121
122
  @property st-global(--wds-badge-size-medium);
122
123
  @property st-global(--wds-badge-size-small);
123
124
  @property st-global(--wds-badge-size-tiny);
125
+ @property st-global(--wds-badge-solid-neutral-danger-label-color);
126
+ @property st-global(--wds-badge-solid-neutral-success-label-color);
127
+ @property st-global(--wds-badge-solid-warning-light-label-color);
124
128
  @property st-global(--wds-border-radius-0);
125
129
  @property st-global(--wds-border-radius-100);
126
130
  @property st-global(--wds-border-radius-200);
@@ -1436,6 +1440,7 @@
1436
1440
  @property st-global(--wds-message-modal-close-button-icon-size);
1437
1441
  @property st-global(--wds-message-modal-close-button-size);
1438
1442
  @property st-global(--wds-message-modal-content-gap);
1443
+ @property st-global(--wds-message-modal-help-button-icon-size);
1439
1444
  @property st-global(--wds-message-modal-help-button-size);
1440
1445
  @property st-global(--wds-message-modal-illustration-content-gap);
1441
1446
  @property st-global(--wds-message-modal-illustration-margin-start);
@@ -1444,6 +1449,7 @@
1444
1449
  @property st-global(--wds-message-modal-padding-vertical);
1445
1450
  @property st-global(--wds-message-modal-text-font-line-height);
1446
1451
  @property st-global(--wds-message-modal-text-font-size);
1452
+ @property st-global(--wds-message-modal-text-font-weight);
1447
1453
  @property st-global(--wds-message-modal-title-font-family);
1448
1454
  @property st-global(--wds-message-modal-title-font-line-height);
1449
1455
  @property st-global(--wds-message-modal-title-font-size);
@@ -1465,6 +1471,9 @@
1465
1471
  @property st-global(--wds-notification-padding-vertical);
1466
1472
  @property st-global(--wds-number-input-icon-fill);
1467
1473
  @property st-global(--wds-page-header-back-button-gap);
1474
+ @property st-global(--wds-page-header-breadcrumbs-offset-large);
1475
+ @property st-global(--wds-page-header-breadcrumbs-offset-medium);
1476
+ @property st-global(--wds-page-header-breadcrumbs-offset-small);
1468
1477
  @property st-global(--wds-page-header-padding-horizontal);
1469
1478
  @property st-global(--wds-page-header-padding-horizontal-small);
1470
1479
  @property st-global(--wds-page-header-padding-vertical);
@@ -2221,6 +2230,7 @@
2221
2230
  @property st-global(--wds-tooltip-text-fill);
2222
2231
  @property st-global(--wds-top-banner-border-color);
2223
2232
  @property st-global(--wds-top-banner-border-radius);
2233
+ @property st-global(--wds-top-banner-content-color);
2224
2234
  @property st-global(--wds-top-banner-content-gap);
2225
2235
  @property st-global(--wds-top-banner-dismiss-gap);
2226
2236
  @property st-global(--wds-top-banner-fill);
@@ -2325,6 +2335,7 @@
2325
2335
  --wds-accordion-inner-content-shadow: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset, 0 -22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
2326
2336
  --wds-accordion-inner-content-shadow-last: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
2327
2337
  --wds-accordion-padding-horizontal-large: 24px;
2338
+ --wds-accordion-padding-horizontal-medium: 18px;
2328
2339
  --wds-accordion-title-fill: #000624;
2329
2340
  --wds-accordion-title-fill-hover: #000624;
2330
2341
  --wds-accordion-title-font-line-height-medium: 24px;
@@ -2434,6 +2445,9 @@
2434
2445
  --wds-badge-size-medium: 24px;
2435
2446
  --wds-badge-size-small: 18px;
2436
2447
  --wds-badge-size-tiny: 18px;
2448
+ --wds-badge-solid-neutral-danger-label-color: #44485f;
2449
+ --wds-badge-solid-neutral-success-label-color: #44485f;
2450
+ --wds-badge-solid-warning-light-label-color: #44485f;
2437
2451
  --wds-border-radius-0: 0px;
2438
2452
  --wds-border-radius-100: 2px;
2439
2453
  --wds-border-radius-200: 4px;
@@ -3749,6 +3763,7 @@
3749
3763
  --wds-message-modal-close-button-icon-size: 12px;
3750
3764
  --wds-message-modal-close-button-size: 30px;
3751
3765
  --wds-message-modal-content-gap: 12px;
3766
+ --wds-message-modal-help-button-icon-size: 24px;
3752
3767
  --wds-message-modal-help-button-size: 30px;
3753
3768
  --wds-message-modal-illustration-content-gap: 24px;
3754
3769
  --wds-message-modal-illustration-margin-start: 24px;
@@ -3757,6 +3772,7 @@
3757
3772
  --wds-message-modal-padding-vertical: 24px;
3758
3773
  --wds-message-modal-text-font-line-height: 24px;
3759
3774
  --wds-message-modal-text-font-size: 16px;
3775
+ --wds-message-modal-text-font-weight: 500;
3760
3776
  --wds-message-modal-title-font-family: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
3761
3777
  --wds-message-modal-title-font-line-height: 28px;
3762
3778
  --wds-message-modal-title-font-size: 21px;
@@ -3778,6 +3794,9 @@
3778
3794
  --wds-notification-padding-vertical: 9px;
3779
3795
  --wds-number-input-icon-fill: #116dff;
3780
3796
  --wds-page-header-back-button-gap: 8px;
3797
+ --wds-page-header-breadcrumbs-offset-large: -15px;
3798
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
3799
+ --wds-page-header-breadcrumbs-offset-small: -6px;
3781
3800
  --wds-page-header-padding-horizontal: 48px;
3782
3801
  --wds-page-header-padding-horizontal-small: 24px;
3783
3802
  --wds-page-header-padding-vertical: 24px;
@@ -4534,6 +4553,7 @@
4534
4553
  --wds-tooltip-text-fill: #ffffff;
4535
4554
  --wds-top-banner-border-color: rgba(255, 255, 255, 0);
4536
4555
  --wds-top-banner-border-radius: 0px;
4556
+ --wds-top-banner-content-color: #ffffff;
4537
4557
  --wds-top-banner-content-gap: 12px;
4538
4558
  --wds-top-banner-dismiss-gap: 12px;
4539
4559
  --wds-top-banner-fill: #c161f0;
package/component.st.css CHANGED
@@ -12,6 +12,7 @@
12
12
  @property st-global(--wds-accordion-inner-content-shadow);
13
13
  @property st-global(--wds-accordion-inner-content-shadow-last);
14
14
  @property st-global(--wds-accordion-padding-horizontal-large);
15
+ @property st-global(--wds-accordion-padding-horizontal-medium);
15
16
  @property st-global(--wds-accordion-title-fill);
16
17
  @property st-global(--wds-accordion-title-fill-hover);
17
18
  @property st-global(--wds-accordion-title-font-line-height-medium);
@@ -109,6 +110,9 @@
109
110
  @property st-global(--wds-badge-size-medium);
110
111
  @property st-global(--wds-badge-size-small);
111
112
  @property st-global(--wds-badge-size-tiny);
113
+ @property st-global(--wds-badge-solid-neutral-danger-label-color);
114
+ @property st-global(--wds-badge-solid-neutral-success-label-color);
115
+ @property st-global(--wds-badge-solid-warning-light-label-color);
112
116
  @property st-global(--wds-breadcrumbs-border-radius);
113
117
  @property st-global(--wds-breadcrumbs-divider-margin-horizontal);
114
118
  @property st-global(--wds-breadcrumbs-font-size-small);
@@ -855,6 +859,7 @@
855
859
  @property st-global(--wds-message-modal-close-button-icon-size);
856
860
  @property st-global(--wds-message-modal-close-button-size);
857
861
  @property st-global(--wds-message-modal-content-gap);
862
+ @property st-global(--wds-message-modal-help-button-icon-size);
858
863
  @property st-global(--wds-message-modal-help-button-size);
859
864
  @property st-global(--wds-message-modal-illustration-content-gap);
860
865
  @property st-global(--wds-message-modal-illustration-margin-start);
@@ -863,6 +868,7 @@
863
868
  @property st-global(--wds-message-modal-padding-vertical);
864
869
  @property st-global(--wds-message-modal-text-font-line-height);
865
870
  @property st-global(--wds-message-modal-text-font-size);
871
+ @property st-global(--wds-message-modal-text-font-weight);
866
872
  @property st-global(--wds-message-modal-title-font-family);
867
873
  @property st-global(--wds-message-modal-title-font-line-height);
868
874
  @property st-global(--wds-message-modal-title-font-size);
@@ -884,6 +890,9 @@
884
890
  @property st-global(--wds-notification-padding-vertical);
885
891
  @property st-global(--wds-number-input-icon-fill);
886
892
  @property st-global(--wds-page-header-back-button-gap);
893
+ @property st-global(--wds-page-header-breadcrumbs-offset-large);
894
+ @property st-global(--wds-page-header-breadcrumbs-offset-medium);
895
+ @property st-global(--wds-page-header-breadcrumbs-offset-small);
887
896
  @property st-global(--wds-page-header-padding-horizontal);
888
897
  @property st-global(--wds-page-header-padding-horizontal-small);
889
898
  @property st-global(--wds-page-header-padding-vertical);
@@ -1487,6 +1496,7 @@
1487
1496
  @property st-global(--wds-tooltip-text-fill);
1488
1497
  @property st-global(--wds-top-banner-border-color);
1489
1498
  @property st-global(--wds-top-banner-border-radius);
1499
+ @property st-global(--wds-top-banner-content-color);
1490
1500
  @property st-global(--wds-top-banner-content-gap);
1491
1501
  @property st-global(--wds-top-banner-dismiss-gap);
1492
1502
  @property st-global(--wds-top-banner-fill);
@@ -1589,6 +1599,7 @@
1589
1599
  --wds-accordion-inner-content-shadow: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset, 0 -22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
1590
1600
  --wds-accordion-inner-content-shadow-last: 0 22px 18px -18px rgba(0, 6, 36, .1) inset, 0 -8px 6px -6px rgba(0, 6, 36, .05) inset;
1591
1601
  --wds-accordion-padding-horizontal-large: 24px;
1602
+ --wds-accordion-padding-horizontal-medium: 18px;
1592
1603
  --wds-accordion-title-fill: #000624;
1593
1604
  --wds-accordion-title-fill-hover: #000624;
1594
1605
  --wds-accordion-title-font-line-height-medium: 24px;
@@ -1686,6 +1697,9 @@
1686
1697
  --wds-badge-size-medium: 24px;
1687
1698
  --wds-badge-size-small: 18px;
1688
1699
  --wds-badge-size-tiny: 18px;
1700
+ --wds-badge-solid-neutral-danger-label-color: #44485f;
1701
+ --wds-badge-solid-neutral-success-label-color: #44485f;
1702
+ --wds-badge-solid-warning-light-label-color: #44485f;
1689
1703
  --wds-breadcrumbs-border-radius: 1000px;
1690
1704
  --wds-breadcrumbs-divider-margin-horizontal: 8px;
1691
1705
  --wds-breadcrumbs-font-size-small: 14px;
@@ -2432,6 +2446,7 @@
2432
2446
  --wds-message-modal-close-button-icon-size: 12px;
2433
2447
  --wds-message-modal-close-button-size: 30px;
2434
2448
  --wds-message-modal-content-gap: 12px;
2449
+ --wds-message-modal-help-button-icon-size: 24px;
2435
2450
  --wds-message-modal-help-button-size: 30px;
2436
2451
  --wds-message-modal-illustration-content-gap: 24px;
2437
2452
  --wds-message-modal-illustration-margin-start: 24px;
@@ -2440,6 +2455,7 @@
2440
2455
  --wds-message-modal-padding-vertical: 24px;
2441
2456
  --wds-message-modal-text-font-line-height: 24px;
2442
2457
  --wds-message-modal-text-font-size: 16px;
2458
+ --wds-message-modal-text-font-weight: 500;
2443
2459
  --wds-message-modal-title-font-family: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
2444
2460
  --wds-message-modal-title-font-line-height: 28px;
2445
2461
  --wds-message-modal-title-font-size: 21px;
@@ -2461,6 +2477,9 @@
2461
2477
  --wds-notification-padding-vertical: 9px;
2462
2478
  --wds-number-input-icon-fill: #116dff;
2463
2479
  --wds-page-header-back-button-gap: 8px;
2480
+ --wds-page-header-breadcrumbs-offset-large: -15px;
2481
+ --wds-page-header-breadcrumbs-offset-medium: -9px;
2482
+ --wds-page-header-breadcrumbs-offset-small: -6px;
2464
2483
  --wds-page-header-padding-horizontal: 48px;
2465
2484
  --wds-page-header-padding-horizontal-small: 24px;
2466
2485
  --wds-page-header-padding-vertical: 24px;
@@ -3064,6 +3083,7 @@
3064
3083
  --wds-tooltip-text-fill: #ffffff;
3065
3084
  --wds-top-banner-border-color: rgba(255, 255, 255, 0);
3066
3085
  --wds-top-banner-border-radius: 0px;
3086
+ --wds-top-banner-content-color: #ffffff;
3067
3087
  --wds-top-banner-content-gap: 12px;
3068
3088
  --wds-top-banner-dismiss-gap: 12px;
3069
3089
  --wds-top-banner-fill: #c161f0;
package/odeditor/all.css CHANGED
@@ -371,6 +371,9 @@
371
371
  --wds-side-panel-control-layout-divider-border-width: false;
372
372
  --wds-section-helper-prefix-offset-margin: 0px;
373
373
  --wds-radio-dot-size: 4px;
374
+ --wds-page-header-breadcrumbs-offset-small: 0px;
375
+ --wds-page-header-breadcrumbs-offset-medium: 0px;
376
+ --wds-page-header-breadcrumbs-offset-large: 0px;
374
377
  --wds-marketing-layout-badge-top: auto;
375
378
  --wds-marketing-layout-badge-side: auto;
376
379
  --wds-marketing-layout-badge-position: static;
@@ -414,6 +417,7 @@
414
417
  --wds-avatar-group-gap-condensed: -2px;
415
418
  --wds-avatar-group-counter-background-blur: 4px;
416
419
  --wds-avatar-size-tiny: 20px;
420
+ --wds-announcement-modal-help-button-fill: transparent;
417
421
  --wds-announcement-modal-footnote-content-alignment: start;
418
422
  --wds-announcement-modal-close-button-icon-size: 8px;
419
423
  --wds-angle-input-knob-size: 6px;
@@ -1285,12 +1289,14 @@
1285
1289
  --wds-message-modal-title-font-size: var(--wds-font-size-800);
1286
1290
  --wds-message-modal-title-font-line-height: var(--wds-space-800);
1287
1291
  --wds-message-modal-title-font-family: var(--wds-font-family-display);
1292
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-regular);
1288
1293
  --wds-message-modal-padding-vertical: var(--wds-space-600);
1289
1294
  --wds-message-modal-padding-horizontal: var(--wds-space-600);
1290
1295
  --wds-message-modal-illustration-margin-top: var(--wds-space-600);
1291
1296
  --wds-message-modal-illustration-margin-start: var(--wds-space-600);
1292
1297
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
1293
- --wds-message-modal-help-button-size: var(--wds-space-700);
1298
+ --wds-message-modal-help-button-size: var(--wds-space-600);
1299
+ --wds-message-modal-help-button-icon-size: var(--wds-space-475);
1294
1300
  --wds-message-modal-content-gap: var(--wds-space-300);
1295
1301
  --wds-message-modal-close-button-size: var(--wds-space-600);
1296
1302
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -1771,6 +1777,7 @@
1771
1777
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1772
1778
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1773
1779
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-standard-secondary);
1780
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary);
1774
1781
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1775
1782
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-tiny);
1776
1783
  --wds-tooltip-background-fill: var(--wds-color-fill-surface-overlay-dark);
@@ -2185,6 +2192,9 @@
2185
2192
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2186
2193
  --wds-breadcrumbs-text-line-height-small: var(--wds-font-line-height-200);
2187
2194
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2195
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2196
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2197
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2188
2198
  --wds-badge-outline-urgent-border-color: var(--wds-color-border-urgent-primary);
2189
2199
  --wds-badge-outline-success-border-color: var(--wds-color-border-success-primary);
2190
2200
  --wds-badge-outline-standard-border-color: var(--wds-color-border-standard-primary);
@@ -2205,7 +2215,6 @@
2205
2215
  --wds-announcement-modal-title-font-weight: var(--wds-font-weight-heading-2);
2206
2216
  --wds-announcement-modal-title-font-size: var(--wds-font-size-heading-2);
2207
2217
  --wds-announcement-modal-text-font-size: var(--wds-font-size-body-small);
2208
- --wds-announcement-modal-help-button-fill: var(--wds-color-fill-dark-secondary);
2209
2218
  --wds-announcement-modal-close-button-fill: var(--wds-color-fill-dark-secondary);
2210
2219
  --wds-angle-input-ring-border: var(--wds-color-border-dark-secondary);
2211
2220
  --wds-angle-input-knob-fill: var(--wds-color-fill-standard-tertiary);
@@ -2223,6 +2232,7 @@
2223
2232
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-small);
2224
2233
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2225
2234
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2235
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2226
2236
  --wds-accordion-caret-fill-hover: var(--wds-color-text-standard-primary);
2227
2237
  --wds-accordion-caret-fill: var(--wds-color-text-standard-primary);
2228
2238
  --wds-accordion-background-fill-standard-hover: var(--wds-color-fill-dark-tertiary-active);
package/odeditor/all.scss CHANGED
@@ -131,6 +131,9 @@
131
131
  --wds-shadow-blur-0: 0px;
132
132
  --wds-section-helper-prefix-offset-margin: 0px;
133
133
  --wds-radio-dot-size: 4px;
134
+ --wds-page-header-breadcrumbs-offset-small: 0px;
135
+ --wds-page-header-breadcrumbs-offset-medium: 0px;
136
+ --wds-page-header-breadcrumbs-offset-large: 0px;
134
137
  --wds-marketing-layout-badge-top: auto;
135
138
  --wds-marketing-layout-badge-side: auto;
136
139
  --wds-marketing-layout-badge-position: static;
@@ -414,6 +417,7 @@
414
417
  --wds-avatar-size-tiny: 20px;
415
418
  --wds-avatar-group-gap-condensed: -2px;
416
419
  --wds-avatar-group-counter-background-blur: 4px;
420
+ --wds-announcement-modal-help-button-fill: transparent;
417
421
  --wds-announcement-modal-footnote-content-alignment: start;
418
422
  --wds-announcement-modal-close-button-icon-size: 8px;
419
423
  --wds-angle-input-knob-size: 6px;
@@ -947,12 +951,14 @@
947
951
  --wds-message-modal-title-font-size: var(--wds-font-size-800);
948
952
  --wds-message-modal-title-font-line-height: var(--wds-space-800);
949
953
  --wds-message-modal-title-font-family: var(--wds-font-family-display);
954
+ --wds-message-modal-text-font-weight: var(--wds-font-weight-regular);
950
955
  --wds-message-modal-padding-vertical: var(--wds-space-600);
951
956
  --wds-message-modal-padding-horizontal: var(--wds-space-600);
952
957
  --wds-message-modal-illustration-margin-top: var(--wds-space-600);
953
958
  --wds-message-modal-illustration-margin-start: var(--wds-space-600);
954
959
  --wds-message-modal-illustration-content-gap: var(--wds-space-400);
955
- --wds-message-modal-help-button-size: var(--wds-space-700);
960
+ --wds-message-modal-help-button-size: var(--wds-space-600);
961
+ --wds-message-modal-help-button-icon-size: var(--wds-space-475);
956
962
  --wds-message-modal-content-gap: var(--wds-space-300);
957
963
  --wds-message-modal-close-button-size: var(--wds-space-600);
958
964
  --wds-message-modal-close-button-icon-size: var(--wds-space-200);
@@ -1753,6 +1759,7 @@
1753
1759
  --wds-vertical-tabs-icon-fill-disabled: var(--wds-color-text-disabled);
1754
1760
  --wds-vertical-tabs-icon-fill-active: var(--wds-color-text-standard-primary);
1755
1761
  --wds-vertical-tabs-icon-fill: var(--wds-color-text-standard-secondary);
1762
+ --wds-top-banner-content-color: var(--wds-color-text-standard-primary);
1756
1763
  --wds-tooltip-text-fill: var(--wds-color-text-standard-primary-light);
1757
1764
  --wds-tooltip-label-font-size-medium: var(--wds-font-size-body-tiny);
1758
1765
  --wds-tooltip-background-fill: var(--wds-color-fill-surface-overlay-dark);
@@ -2185,6 +2192,9 @@
2185
2192
  --wds-button-border-dark-secondary: var(--wds-color-border-dark-primary);
2186
2193
  --wds-breadcrumbs-text-line-height-small: var(--wds-font-line-height-200);
2187
2194
  --wds-breadcrumbs-on-grey-text-fill-active: var(--wds-color-text-standard-primary);
2195
+ --wds-badge-solid-warning-light-label-color: var(--wds-color-text-standard-secondary);
2196
+ --wds-badge-solid-neutral-success-label-color: var(--wds-color-text-standard-secondary);
2197
+ --wds-badge-solid-neutral-danger-label-color: var(--wds-color-text-standard-secondary);
2188
2198
  --wds-badge-outline-urgent-border-color: var(--wds-color-border-urgent-primary);
2189
2199
  --wds-badge-outline-success-border-color: var(--wds-color-border-success-primary);
2190
2200
  --wds-badge-outline-standard-border-color: var(--wds-color-border-standard-primary);
@@ -2205,7 +2215,6 @@
2205
2215
  --wds-announcement-modal-title-font-weight: var(--wds-font-weight-heading-2);
2206
2216
  --wds-announcement-modal-title-font-size: var(--wds-font-size-heading-2);
2207
2217
  --wds-announcement-modal-text-font-size: var(--wds-font-size-body-small);
2208
- --wds-announcement-modal-help-button-fill: var(--wds-color-fill-dark-secondary);
2209
2218
  --wds-announcement-modal-close-button-fill: var(--wds-color-fill-dark-secondary);
2210
2219
  --wds-angle-input-ring-border: var(--wds-color-border-dark-secondary);
2211
2220
  --wds-angle-input-knob-fill: var(--wds-color-fill-standard-tertiary);
@@ -2223,6 +2232,7 @@
2223
2232
  --wds-accordion-title-font-size-medium: var(--wds-font-size-body-small);
2224
2233
  --wds-accordion-title-fill-hover: var(--wds-color-text-standard-primary);
2225
2234
  --wds-accordion-title-fill: var(--wds-color-text-standard-primary);
2235
+ --wds-accordion-padding-horizontal-medium: var(--wds-space-padding-horizontal-medium);
2226
2236
  --wds-accordion-caret-fill-hover: var(--wds-color-text-standard-primary);
2227
2237
  --wds-accordion-caret-fill: var(--wds-color-text-standard-primary);
2228
2238
  --wds-accordion-background-fill-standard-hover: var(--wds-color-fill-dark-tertiary-active);
package/odeditor/all.st.css CHANGED
@@ -12,6 +12,7 @@
12
12
  @property st-global(--wds-accordion-inner-content-shadow);
13
13
  @property st-global(--wds-accordion-inner-content-shadow-last);
14
14
  @property st-global(--wds-accordion-padding-horizontal-large);
15
+ @property st-global(--wds-accordion-padding-horizontal-medium);
15
16
  @property st-global(--wds-accordion-title-fill);
16
17
  @property st-global(--wds-accordion-title-fill-hover);
17
18
  @property st-global(--wds-accordion-title-font-line-height-medium);
@@ -128,6 +129,9 @@
128
129
  @property st-global(--wds-badge-size-medium);
129
130
  @property st-global(--wds-badge-size-small);
130
131
  @property st-global(--wds-badge-size-tiny);
132
+ @property st-global(--wds-badge-solid-neutral-danger-label-color);
133
+ @property st-global(--wds-badge-solid-neutral-success-label-color);
134
+ @property st-global(--wds-badge-solid-warning-light-label-color);
131
135
  @property st-global(--wds-border-radius-0);
132
136
  @property st-global(--wds-border-radius-100);
133
137
  @property st-global(--wds-border-radius-200);
@@ -1402,6 +1406,7 @@
1402
1406
  @property st-global(--wds-message-modal-close-button-icon-size);
1403
1407
  @property st-global(--wds-message-modal-close-button-size);
1404
1408
  @property st-global(--wds-message-modal-content-gap);
1409
+ @property st-global(--wds-message-modal-help-button-icon-size);
1405
1410
  @property st-global(--wds-message-modal-help-button-size);
1406
1411
  @property st-global(--wds-message-modal-illustration-content-gap);
1407
1412
  @property st-global(--wds-message-modal-illustration-margin-start);
@@ -1410,6 +1415,7 @@
1410
1415
  @property st-global(--wds-message-modal-padding-vertical);
1411
1416
  @property st-global(--wds-message-modal-text-font-line-height);
1412
1417
  @property st-global(--wds-message-modal-text-font-size);
1418
+ @property st-global(--wds-message-modal-text-font-weight);
1413
1419
  @property st-global(--wds-message-modal-title-font-family);
1414
1420
  @property st-global(--wds-message-modal-title-font-line-height);
1415
1421
  @property st-global(--wds-message-modal-title-font-size);
@@ -1441,6 +1447,9 @@
1441
1447
  @property st-global(--wds-padding-vertical-small);
1442
1448
  @property st-global(--wds-padding-vertical-tiny);
1443
1449
  @property st-global(--wds-page-header-back-button-gap);
1450
+ @property st-global(--wds-page-header-breadcrumbs-offset-large);
1451
+ @property st-global(--wds-page-header-breadcrumbs-offset-medium);
1452
+ @property st-global(--wds-page-header-breadcrumbs-offset-small);
1444
1453
  @property st-global(--wds-page-header-padding-horizontal);
1445
1454
  @property st-global(--wds-page-header-padding-horizontal-small);
1446
1455
  @property st-global(--wds-page-header-padding-vertical);
@@ -2211,6 +2220,7 @@
2211
2220
  @property st-global(--wds-tooltip-text-fill);
2212
2221
  @property st-global(--wds-top-banner-border-color);
2213
2222
  @property st-global(--wds-top-banner-border-radius);
2223
+ @property st-global(--wds-top-banner-content-color);
2214
2224
  @property st-global(--wds-top-banner-content-gap);
2215
2225
  @property st-global(--wds-top-banner-dismiss-gap);
2216
2226
  @property st-global(--wds-top-banner-fill);
@@ -2304,6 +2314,7 @@
2304
2314
  --wds-accordion-inner-content-shadow: none;
2305
2315
  --wds-accordion-inner-content-shadow-last: none;
2306
2316
  --wds-accordion-padding-horizontal-large: 16px;
2317
+ --wds-accordion-padding-horizontal-medium: 20px;
2307
2318
  --wds-accordion-title-fill: #151414;
2308
2319
  --wds-accordion-title-fill-hover: #151414;
2309
2320
  --wds-accordion-title-font-line-height-medium: 24px;
@@ -2344,7 +2355,7 @@
2344
2355
  --wds-announcement-modal-close-button-size: 24px;
2345
2356
  --wds-announcement-modal-content-gap: 12px;
2346
2357
  --wds-announcement-modal-footnote-content-alignment: start;
2347
- --wds-announcement-modal-help-button-fill: #f0efef;
2358
+ --wds-announcement-modal-help-button-fill: transparent;
2348
2359
  --wds-announcement-modal-help-button-icon-size: 18px;
2349
2360
  --wds-announcement-modal-help-button-size: 24px;
2350
2361
  --wds-announcement-modal-padding-horizontal: 96px;
@@ -2420,6 +2431,9 @@
2420
2431
  --wds-badge-size-medium: 28px;
2421
2432
  --wds-badge-size-small: 24px;
2422
2433
  --wds-badge-size-tiny: 20px;
2434
+ --wds-badge-solid-neutral-danger-label-color: #383838;
2435
+ --wds-badge-solid-neutral-success-label-color: #383838;
2436
+ --wds-badge-solid-warning-light-label-color: #383838;
2423
2437
  --wds-border-radius-0: 0px;
2424
2438
  --wds-border-radius-100: 2px;
2425
2439
  --wds-border-radius-200: 4px;
@@ -3694,7 +3708,8 @@
3694
3708
  --wds-message-modal-close-button-icon-size: 8px;
3695
3709
  --wds-message-modal-close-button-size: 24px;
3696
3710
  --wds-message-modal-content-gap: 12px;
3697
- --wds-message-modal-help-button-size: 28px;
3711
+ --wds-message-modal-help-button-icon-size: 18px;
3712
+ --wds-message-modal-help-button-size: 24px;
3698
3713
  --wds-message-modal-illustration-content-gap: 16px;
3699
3714
  --wds-message-modal-illustration-margin-start: 24px;
3700
3715
  --wds-message-modal-illustration-margin-top: 24px;
@@ -3702,6 +3717,7 @@
3702
3717
  --wds-message-modal-padding-vertical: 24px;
3703
3718
  --wds-message-modal-text-font-line-height: 18px;
3704
3719
  --wds-message-modal-text-font-size: 14px;
3720
+ --wds-message-modal-text-font-weight: 400;
3705
3721
  --wds-message-modal-title-font-family: "Madefor Display", Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
3706
3722
  --wds-message-modal-title-font-line-height: 32px;
3707
3723
  --wds-message-modal-title-font-size: 24px;
@@ -3733,6 +3749,9 @@
3733
3749
  --wds-padding-vertical-small: 24px;
3734
3750
  --wds-padding-vertical-tiny: 20px;
3735
3751
  --wds-page-header-back-button-gap: 8px;
3752
+ --wds-page-header-breadcrumbs-offset-large: 0px;
3753
+ --wds-page-header-breadcrumbs-offset-medium: 0px;
3754
+ --wds-page-header-breadcrumbs-offset-small: 0px;
3736
3755
  --wds-page-header-padding-horizontal: 48px;
3737
3756
  --wds-page-header-padding-horizontal-small: 24px;
3738
3757
  --wds-page-header-padding-vertical: 24px;
@@ -4503,6 +4522,7 @@
4503
4522
  --wds-tooltip-text-fill: #ffffff;
4504
4523
  --wds-top-banner-border-color: #ffffff;
4505
4524
  --wds-top-banner-border-radius: 8px;
4525
+ --wds-top-banner-content-color: #151414;
4506
4526
  --wds-top-banner-content-gap: 12px;
4507
4527
  --wds-top-banner-dismiss-gap: 20px;
4508
4528
  --wds-top-banner-fill: #e7e4fe;