@wix/design-system-tokens 1.228.0 → 1.229.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.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,23 @@
1
+ ## 1.229.1
2
+
3
+ ### Patch Changes
4
+
5
+ - [#17016](https://github.com/wix-private/wix-design-systems/pull/17016) [`0efc09e`](https://github.com/wix-private/wix-design-systems/commit/0efc09eb29ee7a30c54cf47229632543ee43f8df) - StarsRatingBar: unfilled stars now use a dedicated `--wds-stars-rating-bar-unfilled-star-color` token instead of the shared `--wds-color-black-500` primitive directly. In `odeditor-dark` (Studio 2.0) it resolves to `black.400` instead of `black.500`, fixing insufficient contrast against dark surfaces — most visible for read-only ratings. Every other theme aliases to the unchanged `black.500`, so nothing else visually changes, including `odeditor` (Harmony). Other components consuming `--wds-color-black-500` directly are unaffected.
6
+
7
+ ## 1.229.0
8
+
9
+ ### Minor Changes
10
+
11
+ - [#17058](https://github.com/wix-private/wix-design-systems/pull/17058) [`ae2f816`](https://github.com/wix-private/wix-design-systems/commit/ae2f816ded3bc53b5a2c57907f1bba6146a41c0c) - Add CalendarPanel divider tokens `--wds-calendar-panel-presets-border-width`, `--wds-calendar-panel-presets-border-fill`, `--wds-calendar-panel-footer-border-width` and `--wds-calendar-panel-footer-border-fill`: `1px` of `--wds-color-border-dark-secondary` in every theme except Harmony (odeditor), where the width is `0px` and the fill is transparent.
12
+
13
+ - [#17058](https://github.com/wix-private/wix-design-systems/pull/17058) [`ae2f816`](https://github.com/wix-private/wix-design-systems/commit/ae2f816ded3bc53b5a2c57907f1bba6146a41c0c) - Add `--wds-calendar-day-today-inset-width`, the width of the surface-colored inset ring around today's date in Calendar: `3px` in every theme, `0px` in Harmony (odeditor).
14
+
15
+ - [#17077](https://github.com/wix-private/wix-design-systems/pull/17077) [`a2c8bd4`](https://github.com/wix-private/wix-design-systems/commit/a2c8bd46ec39d09b22e17f1a6dce72f832c5ffd9) - **Visual breaking change:** `--wds-text-button-font-size-tiny` in Harmony (odeditor) changed from `10px` to `12px`, matching the small size.
16
+
17
+ ### Patch Changes
18
+
19
+ - [#17048](https://github.com/wix-private/wix-design-systems/pull/17048) [`9b3198d`](https://github.com/wix-private/wix-design-systems/commit/9b3198d029dc31119db5788930cae0432b3237a1) - Added a `calendar` token group controlling the day fills (hover, today, selected, selected hover, range, range edge), the weekday label color, the gap between days, the grid padding per size, and the border radius of range days. Only Harmony (odeditor) diverges, with dark selected fills, grey hover/range/today fills, a muted weekday label, 2px gaps, tighter padding and fully rounded range days; every other theme keeps its current values.
20
+
1
21
  ## 1.228.0
2
22
 
3
23
  ### Minor Changes
package/all.css CHANGED
@@ -476,6 +476,8 @@
476
476
  --wds-card-header-suffix-align: center;
477
477
  --wds-card-divider-opacity: 1;
478
478
  --wds-card-base-shadow: none;
479
+ --wds-calendar-day-today-inset-width: 3px;
480
+ --wds-calendar-day-range-edge-border-radius: 50%;
479
481
  --wds-button-outline-hover: transparent;
480
482
  --wds-button-icon-offset-tiny: 12px;
481
483
  --wds-button-icon-offset-small: 12px;
@@ -1161,6 +1163,7 @@
1161
1163
  --wds-statistics-widget-padding-vertical-large: var(--wds-space-300);
1162
1164
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-400);
1163
1165
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-400);
1166
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
1164
1167
  --wds-social-preview-content-padding-vertical: var(--wds-space-150);
1165
1168
  --wds-social-preview-content-padding-horizontal: var(--wds-space-200);
1166
1169
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-200);
@@ -1704,6 +1707,14 @@
1704
1707
  --wds-card-content-padding-medium: var(--wds-space-400);
1705
1708
  --wds-card-content-padding-large: var(--wds-space-600);
1706
1709
  --wds-card-border: var(--wds-border-radius-400);
1710
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1711
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1712
+ --wds-calendar-padding-small: var(--wds-space-300);
1713
+ --wds-calendar-padding-medium: var(--wds-space-400);
1714
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1715
+ --wds-calendar-day-gap: var(--wds-space-0);
1716
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1717
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1707
1718
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1708
1719
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1709
1720
  --wds-button-size-x-tiny: var(--wds-space-300);
@@ -2376,6 +2387,13 @@
2376
2387
  --wds-card-subtitle-font-size: var(--wds-font-size-body-medium);
2377
2388
  --wds-card-subtitle-color: var(--wds-color-text-standard-secondary);
2378
2389
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2390
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2391
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2392
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2393
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2394
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2395
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2396
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2379
2397
  --wds-button-text-hover: var(--wds-color-text-standard-primary-light);
2380
2398
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
2381
2399
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
package/all.scss CHANGED
@@ -449,6 +449,8 @@
449
449
  --wds-card-gallery-item-action-button-min-width: 84px;
450
450
  --wds-card-divider-opacity: 1;
451
451
  --wds-card-base-shadow: none;
452
+ --wds-calendar-day-today-inset-width: 3px;
453
+ --wds-calendar-day-range-edge-border-radius: 50%;
452
454
  --wds-button-outline-hover: transparent;
453
455
  --wds-button-icon-offset-tiny: 12px;
454
456
  --wds-button-icon-offset-small: 12px;
@@ -716,6 +718,7 @@
716
718
  --wds-statistics-widget-padding-vertical-large: var(--wds-space-300);
717
719
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-400);
718
720
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-400);
721
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
719
722
  --wds-space-viewport-spacing: var(--wds-space-800);
720
723
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-50);
721
724
  --wds-space-padding-vertical-x-tiny: var(--wds-space-100);
@@ -1692,6 +1695,14 @@
1692
1695
  --wds-card-content-padding-medium: var(--wds-space-400);
1693
1696
  --wds-card-content-padding-large: var(--wds-space-600);
1694
1697
  --wds-card-border: var(--wds-border-radius-400);
1698
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1699
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1700
+ --wds-calendar-padding-small: var(--wds-space-300);
1701
+ --wds-calendar-padding-medium: var(--wds-space-400);
1702
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1703
+ --wds-calendar-day-gap: var(--wds-space-0);
1704
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1705
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1695
1706
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1696
1707
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1697
1708
  --wds-button-size-x-tiny: var(--wds-space-300);
@@ -2376,6 +2387,13 @@
2376
2387
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
2377
2388
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-medium);
2378
2389
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2390
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2391
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2392
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2393
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2394
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2395
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2396
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2379
2397
  --wds-button-text-hover: var(--wds-color-text-standard-primary-light);
2380
2398
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
2381
2399
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
package/all.st.css CHANGED
@@ -333,6 +333,23 @@
333
333
  @property st-global(--wds-button-text-hover);
334
334
  @property st-global(--wds-button-text-standard-primary);
335
335
  @property st-global(--wds-button-text-standard-primary-hover);
336
+ @property st-global(--wds-calendar-day-fill-hover);
337
+ @property st-global(--wds-calendar-day-fill-range);
338
+ @property st-global(--wds-calendar-day-fill-range-edge);
339
+ @property st-global(--wds-calendar-day-fill-selected);
340
+ @property st-global(--wds-calendar-day-fill-selected-hover);
341
+ @property st-global(--wds-calendar-day-fill-today);
342
+ @property st-global(--wds-calendar-day-gap);
343
+ @property st-global(--wds-calendar-day-range-border-radius);
344
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
345
+ @property st-global(--wds-calendar-day-today-inset-width);
346
+ @property st-global(--wds-calendar-padding-medium);
347
+ @property st-global(--wds-calendar-padding-small);
348
+ @property st-global(--wds-calendar-panel-footer-border-fill);
349
+ @property st-global(--wds-calendar-panel-footer-border-width);
350
+ @property st-global(--wds-calendar-panel-presets-border-fill);
351
+ @property st-global(--wds-calendar-panel-presets-border-width);
352
+ @property st-global(--wds-calendar-weekday-label-color);
336
353
  @property st-global(--wds-card-base-shadow);
337
354
  @property st-global(--wds-card-border);
338
355
  @property st-global(--wds-card-border-radius);
@@ -2202,6 +2219,7 @@
2202
2219
  @property st-global(--wds-space-padding-vertical-x-tiny);
2203
2220
  @property st-global(--wds-space-padding-vertical-xx-tiny);
2204
2221
  @property st-global(--wds-space-viewport-spacing);
2222
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
2205
2223
  @property st-global(--wds-statistics-widget-description-font-line-height);
2206
2224
  @property st-global(--wds-statistics-widget-description-font-size);
2207
2225
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2963,6 +2981,23 @@
2963
2981
  --wds-button-text-hover: #ffffff;
2964
2982
  --wds-button-text-standard-primary: #000624;
2965
2983
  --wds-button-text-standard-primary-hover: #000624;
2984
+ --wds-calendar-day-fill-hover: #e7f0ff;
2985
+ --wds-calendar-day-fill-range: #e7f0ff;
2986
+ --wds-calendar-day-fill-range-edge: #e7f0ff;
2987
+ --wds-calendar-day-fill-selected: #116dff;
2988
+ --wds-calendar-day-fill-selected-hover: #0f62e6;
2989
+ --wds-calendar-day-fill-today: #eceff3;
2990
+ --wds-calendar-day-gap: 0px;
2991
+ --wds-calendar-day-range-border-radius: 0px;
2992
+ --wds-calendar-day-range-edge-border-radius: 50%;
2993
+ --wds-calendar-day-today-inset-width: 3px;
2994
+ --wds-calendar-padding-medium: 24px;
2995
+ --wds-calendar-padding-small: 18px;
2996
+ --wds-calendar-panel-footer-border-fill: #dfe5eb;
2997
+ --wds-calendar-panel-footer-border-width: 1px;
2998
+ --wds-calendar-panel-presets-border-fill: #dfe5eb;
2999
+ --wds-calendar-panel-presets-border-width: 1px;
3000
+ --wds-calendar-weekday-label-color: #000624;
2966
3001
  --wds-card-base-shadow: none;
2967
3002
  --wds-card-border: 8px;
2968
3003
  --wds-card-border-radius: 8px;
@@ -4832,6 +4867,7 @@
4832
4867
  --wds-space-padding-vertical-x-tiny: 6px;
4833
4868
  --wds-space-padding-vertical-xx-tiny: 3px;
4834
4869
  --wds-space-viewport-spacing: 48px;
4870
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
4835
4871
  --wds-statistics-widget-description-font-line-height: 18px;
4836
4872
  --wds-statistics-widget-description-font-size: 14px;
4837
4873
  --wds-statistics-widget-description-info-gap: 6px;
package/component.st.css CHANGED
@@ -294,6 +294,23 @@
294
294
  @property st-global(--wds-button-text-hover);
295
295
  @property st-global(--wds-button-text-standard-primary);
296
296
  @property st-global(--wds-button-text-standard-primary-hover);
297
+ @property st-global(--wds-calendar-day-fill-hover);
298
+ @property st-global(--wds-calendar-day-fill-range);
299
+ @property st-global(--wds-calendar-day-fill-range-edge);
300
+ @property st-global(--wds-calendar-day-fill-selected);
301
+ @property st-global(--wds-calendar-day-fill-selected-hover);
302
+ @property st-global(--wds-calendar-day-fill-today);
303
+ @property st-global(--wds-calendar-day-gap);
304
+ @property st-global(--wds-calendar-day-range-border-radius);
305
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
306
+ @property st-global(--wds-calendar-day-today-inset-width);
307
+ @property st-global(--wds-calendar-padding-medium);
308
+ @property st-global(--wds-calendar-padding-small);
309
+ @property st-global(--wds-calendar-panel-footer-border-fill);
310
+ @property st-global(--wds-calendar-panel-footer-border-width);
311
+ @property st-global(--wds-calendar-panel-presets-border-fill);
312
+ @property st-global(--wds-calendar-panel-presets-border-width);
313
+ @property st-global(--wds-calendar-weekday-label-color);
297
314
  @property st-global(--wds-card-base-shadow);
298
315
  @property st-global(--wds-card-border);
299
316
  @property st-global(--wds-card-border-radius);
@@ -1463,6 +1480,7 @@
1463
1480
  @property st-global(--wds-social-post-preview-content-padding-vertical);
1464
1481
  @property st-global(--wds-social-preview-content-padding-horizontal);
1465
1482
  @property st-global(--wds-social-preview-content-padding-vertical);
1483
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
1466
1484
  @property st-global(--wds-statistics-widget-description-font-line-height);
1467
1485
  @property st-global(--wds-statistics-widget-description-font-size);
1468
1486
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2183,6 +2201,23 @@
2183
2201
  --wds-button-text-hover: #ffffff;
2184
2202
  --wds-button-text-standard-primary: #000624;
2185
2203
  --wds-button-text-standard-primary-hover: #000624;
2204
+ --wds-calendar-day-fill-hover: #e7f0ff;
2205
+ --wds-calendar-day-fill-range: #e7f0ff;
2206
+ --wds-calendar-day-fill-range-edge: #e7f0ff;
2207
+ --wds-calendar-day-fill-selected: #116dff;
2208
+ --wds-calendar-day-fill-selected-hover: #0f62e6;
2209
+ --wds-calendar-day-fill-today: #eceff3;
2210
+ --wds-calendar-day-gap: 0px;
2211
+ --wds-calendar-day-range-border-radius: 0px;
2212
+ --wds-calendar-day-range-edge-border-radius: 50%;
2213
+ --wds-calendar-day-today-inset-width: 3px;
2214
+ --wds-calendar-padding-medium: 24px;
2215
+ --wds-calendar-padding-small: 18px;
2216
+ --wds-calendar-panel-footer-border-fill: #dfe5eb;
2217
+ --wds-calendar-panel-footer-border-width: 1px;
2218
+ --wds-calendar-panel-presets-border-fill: #dfe5eb;
2219
+ --wds-calendar-panel-presets-border-width: 1px;
2220
+ --wds-calendar-weekday-label-color: #000624;
2186
2221
  --wds-card-base-shadow: none;
2187
2222
  --wds-card-border: 8px;
2188
2223
  --wds-card-border-radius: 8px;
@@ -3352,6 +3387,7 @@
3352
3387
  --wds-social-post-preview-content-padding-vertical: 12px;
3353
3388
  --wds-social-preview-content-padding-horizontal: 12px;
3354
3389
  --wds-social-preview-content-padding-vertical: 9px;
3390
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
3355
3391
  --wds-statistics-widget-description-font-line-height: 18px;
3356
3392
  --wds-statistics-widget-description-font-size: 14px;
3357
3393
  --wds-statistics-widget-description-info-gap: 6px;
package/odeditor/all.css CHANGED
@@ -503,6 +503,7 @@
503
503
  --wds-card-header-suffix-align: flex-start;
504
504
  --wds-card-divider-opacity: 0;
505
505
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
506
+ --wds-calendar-padding-medium: 18px;
506
507
  --wds-button-border-ai-secondary-mask: none;
507
508
  --wds-breadcrumbs-height-medium: 26px;
508
509
  --wds-badge-outline-warning-light-border-color: #c78634;
@@ -1188,6 +1189,7 @@
1188
1189
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
1189
1190
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
1190
1191
  --wds-statistics-widget-description-info-gap: var(--wds-space-50);
1192
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
1191
1193
  --wds-social-preview-content-padding-vertical: var(--wds-space-200);
1192
1194
  --wds-social-preview-content-padding-horizontal: var(--wds-space-300);
1193
1195
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-300);
@@ -1843,6 +1845,21 @@
1843
1845
  --wds-card-content-padding-medium: var(--wds-space-300);
1844
1846
  --wds-card-content-padding-large: var(--wds-space-300);
1845
1847
  --wds-card-border-radius: var(--wds-border-radius-800);
1848
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-none);
1849
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-black-100-transparent-0);
1850
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-none);
1851
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-black-100-transparent-0);
1852
+ --wds-calendar-padding-small: var(--wds-space-300);
1853
+ --wds-calendar-day-today-inset-width: var(--wds-border-width-none);
1854
+ --wds-calendar-day-range-edge-border-radius: var(--wds-border-radius-400);
1855
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-400);
1856
+ --wds-calendar-day-gap: var(--wds-space-50);
1857
+ --wds-calendar-day-fill-today: var(--wds-color-black-550);
1858
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-black-200);
1859
+ --wds-calendar-day-fill-selected: var(--wds-color-black-100);
1860
+ --wds-calendar-day-fill-range-edge: var(--wds-color-white-transparent-0);
1861
+ --wds-calendar-day-fill-range: var(--wds-color-black-700);
1862
+ --wds-calendar-day-fill-hover: var(--wds-color-black-700);
1846
1863
  --wds-button-size-x-tiny: var(--wds-space-475);
1847
1864
  --wds-button-size-tiny-screen-small: var(--wds-space-800);
1848
1865
  --wds-button-size-tiny: var(--wds-space-600);
@@ -2119,7 +2136,7 @@
2119
2136
  --wds-thumbnail-border-color-hover: var(--wds-color-border-standard-secondary-hover);
2120
2137
  --wds-thumbnail-border-color-disabled: var(--wds-color-border-standard-primary-disabled);
2121
2138
  --wds-thumbnail-border-color: var(--wds-color-border-dark-secondary);
2122
- --wds-text-button-font-size-tiny: var(--wds-font-size-body-extra-tiny);
2139
+ --wds-text-button-font-size-tiny: var(--wds-font-size-body-tiny);
2123
2140
  --wds-text-button-font-size-small: var(--wds-font-size-body-tiny);
2124
2141
  --wds-text-button-font-size-medium: var(--wds-font-size-body-small);
2125
2142
  --wds-tag-label-font-size-small: var(--wds-font-size-body-tiny);
@@ -2454,6 +2471,7 @@
2454
2471
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
2455
2472
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-tiny);
2456
2473
  --wds-card-subtitle-line-height: var(--wds-font-line-height-200);
2474
+ --wds-calendar-weekday-label-color: var(--wds-color-text-disabled);
2457
2475
  --wds-button-label-font-size-large: var(--wds-font-size-body-medium);
2458
2476
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary-active);
2459
2477
  --wds-button-label-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
package/odeditor/all.scss CHANGED
@@ -473,6 +473,7 @@
473
473
  --wds-card-gallery-item-action-button-min-width: 72px;
474
474
  --wds-card-divider-opacity: 0;
475
475
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
476
+ --wds-calendar-padding-medium: 18px;
476
477
  --wds-button-border-ai-secondary-mask: none;
477
478
  --wds-breakpoint-x-large: 1572px;
478
479
  --wds-breakpoint-small: 490px;
@@ -763,6 +764,7 @@
763
764
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
764
765
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
765
766
  --wds-statistics-widget-description-info-gap: var(--wds-space-50);
767
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
766
768
  --wds-space-viewport-spacing: var(--wds-space-1200);
767
769
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-100);
768
770
  --wds-space-padding-vertical-x-tiny: var(--wds-space-200);
@@ -1831,6 +1833,21 @@
1831
1833
  --wds-card-content-padding-medium: var(--wds-space-300);
1832
1834
  --wds-card-content-padding-large: var(--wds-space-300);
1833
1835
  --wds-card-border-radius: var(--wds-border-radius-800);
1836
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-none);
1837
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-black-100-transparent-0);
1838
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-none);
1839
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-black-100-transparent-0);
1840
+ --wds-calendar-padding-small: var(--wds-space-300);
1841
+ --wds-calendar-day-today-inset-width: var(--wds-border-width-none);
1842
+ --wds-calendar-day-range-edge-border-radius: var(--wds-border-radius-400);
1843
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-400);
1844
+ --wds-calendar-day-gap: var(--wds-space-50);
1845
+ --wds-calendar-day-fill-today: var(--wds-color-black-550);
1846
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-black-200);
1847
+ --wds-calendar-day-fill-selected: var(--wds-color-black-100);
1848
+ --wds-calendar-day-fill-range-edge: var(--wds-color-white-transparent-0);
1849
+ --wds-calendar-day-fill-range: var(--wds-color-black-700);
1850
+ --wds-calendar-day-fill-hover: var(--wds-color-black-700);
1834
1851
  --wds-button-size-x-tiny: var(--wds-space-475);
1835
1852
  --wds-button-size-tiny-screen-small: var(--wds-space-800);
1836
1853
  --wds-button-size-tiny: var(--wds-space-600);
@@ -2101,7 +2118,7 @@
2101
2118
  --wds-thumbnail-border-color-hover: var(--wds-color-border-standard-secondary-hover);
2102
2119
  --wds-thumbnail-border-color-disabled: var(--wds-color-border-standard-primary-disabled);
2103
2120
  --wds-thumbnail-border-color: var(--wds-color-border-dark-secondary);
2104
- --wds-text-button-font-size-tiny: var(--wds-font-size-body-extra-tiny);
2121
+ --wds-text-button-font-size-tiny: var(--wds-font-size-body-tiny);
2105
2122
  --wds-text-button-font-size-small: var(--wds-font-size-body-tiny);
2106
2123
  --wds-text-button-font-size-medium: var(--wds-font-size-body-small);
2107
2124
  --wds-tag-label-font-size-small: var(--wds-font-size-body-tiny);
@@ -2454,6 +2471,7 @@
2454
2471
  --wds-card-gallery-item-overlay-fill: var(--wds-color-fill-transparent-primary);
2455
2472
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
2456
2473
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-tiny);
2474
+ --wds-calendar-weekday-label-color: var(--wds-color-text-disabled);
2457
2475
  --wds-button-label-font-size-large: var(--wds-font-size-body-medium);
2458
2476
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary-active);
2459
2477
  --wds-button-label-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
@@ -327,6 +327,23 @@
327
327
  @property st-global(--wds-button-size-tiny);
328
328
  @property st-global(--wds-button-size-tiny-screen-small);
329
329
  @property st-global(--wds-button-size-x-tiny);
330
+ @property st-global(--wds-calendar-day-fill-hover);
331
+ @property st-global(--wds-calendar-day-fill-range);
332
+ @property st-global(--wds-calendar-day-fill-range-edge);
333
+ @property st-global(--wds-calendar-day-fill-selected);
334
+ @property st-global(--wds-calendar-day-fill-selected-hover);
335
+ @property st-global(--wds-calendar-day-fill-today);
336
+ @property st-global(--wds-calendar-day-gap);
337
+ @property st-global(--wds-calendar-day-range-border-radius);
338
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
339
+ @property st-global(--wds-calendar-day-today-inset-width);
340
+ @property st-global(--wds-calendar-padding-medium);
341
+ @property st-global(--wds-calendar-padding-small);
342
+ @property st-global(--wds-calendar-panel-footer-border-fill);
343
+ @property st-global(--wds-calendar-panel-footer-border-width);
344
+ @property st-global(--wds-calendar-panel-presets-border-fill);
345
+ @property st-global(--wds-calendar-panel-presets-border-width);
346
+ @property st-global(--wds-calendar-weekday-label-color);
330
347
  @property st-global(--wds-card-base-shadow);
331
348
  @property st-global(--wds-card-border-radius);
332
349
  @property st-global(--wds-card-content-padding-large);
@@ -2190,6 +2207,7 @@
2190
2207
  @property st-global(--wds-space-padding-vertical-x-tiny);
2191
2208
  @property st-global(--wds-space-padding-vertical-xx-tiny);
2192
2209
  @property st-global(--wds-space-viewport-spacing);
2210
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
2193
2211
  @property st-global(--wds-statistics-widget-description-font-line-height);
2194
2212
  @property st-global(--wds-statistics-widget-description-font-size);
2195
2213
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2941,6 +2959,23 @@
2941
2959
  --wds-button-size-tiny: 24px;
2942
2960
  --wds-button-size-tiny-screen-small: 32px;
2943
2961
  --wds-button-size-x-tiny: 18px;
2962
+ --wds-calendar-day-fill-hover: #f0efef;
2963
+ --wds-calendar-day-fill-range: #f0efef;
2964
+ --wds-calendar-day-fill-range-edge: rgba(255, 255, 255, 0);
2965
+ --wds-calendar-day-fill-selected: #151414;
2966
+ --wds-calendar-day-fill-selected-hover: #383838;
2967
+ --wds-calendar-day-fill-today: #dedede;
2968
+ --wds-calendar-day-gap: 2px;
2969
+ --wds-calendar-day-range-border-radius: 8px;
2970
+ --wds-calendar-day-range-edge-border-radius: 8px;
2971
+ --wds-calendar-day-today-inset-width: 0px;
2972
+ --wds-calendar-padding-medium: 18px;
2973
+ --wds-calendar-padding-small: 12px;
2974
+ --wds-calendar-panel-footer-border-fill: rgba(19, 23, 32, 0);
2975
+ --wds-calendar-panel-footer-border-width: 0px;
2976
+ --wds-calendar-panel-presets-border-fill: rgba(19, 23, 32, 0);
2977
+ --wds-calendar-panel-presets-border-width: 0px;
2978
+ --wds-calendar-weekday-label-color: #a8a6a5;
2944
2979
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2945
2980
  --wds-card-border-radius: 16px;
2946
2981
  --wds-card-content-padding-large: 12px;
@@ -4804,6 +4839,7 @@
4804
4839
  --wds-space-padding-vertical-x-tiny: 8px;
4805
4840
  --wds-space-padding-vertical-xx-tiny: 4px;
4806
4841
  --wds-space-viewport-spacing: 48px;
4842
+ --wds-stars-rating-bar-unfilled-star-color: #a8a6a5;
4807
4843
  --wds-statistics-widget-description-font-line-height: 16px;
4808
4844
  --wds-statistics-widget-description-font-size: 12px;
4809
4845
  --wds-statistics-widget-description-info-gap: 2px;
@@ -4948,7 +4984,7 @@
4948
4984
  --wds-text-button-font-line-height-tiny: 12px;
4949
4985
  --wds-text-button-font-size-medium: 14px;
4950
4986
  --wds-text-button-font-size-small: 12px;
4951
- --wds-text-button-font-size-tiny: 10px;
4987
+ --wds-text-button-font-size-tiny: 12px;
4952
4988
  --wds-text-button-font-weight-normal: 600;
4953
4989
  --wds-text-button-font-weight-thin: 500;
4954
4990
  --wds-text-button-size-medium: 18px;
@@ -285,6 +285,23 @@
285
285
  @property st-global(--wds-button-size-tiny);
286
286
  @property st-global(--wds-button-size-tiny-screen-small);
287
287
  @property st-global(--wds-button-size-x-tiny);
288
+ @property st-global(--wds-calendar-day-fill-hover);
289
+ @property st-global(--wds-calendar-day-fill-range);
290
+ @property st-global(--wds-calendar-day-fill-range-edge);
291
+ @property st-global(--wds-calendar-day-fill-selected);
292
+ @property st-global(--wds-calendar-day-fill-selected-hover);
293
+ @property st-global(--wds-calendar-day-fill-today);
294
+ @property st-global(--wds-calendar-day-gap);
295
+ @property st-global(--wds-calendar-day-range-border-radius);
296
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
297
+ @property st-global(--wds-calendar-day-today-inset-width);
298
+ @property st-global(--wds-calendar-padding-medium);
299
+ @property st-global(--wds-calendar-padding-small);
300
+ @property st-global(--wds-calendar-panel-footer-border-fill);
301
+ @property st-global(--wds-calendar-panel-footer-border-width);
302
+ @property st-global(--wds-calendar-panel-presets-border-fill);
303
+ @property st-global(--wds-calendar-panel-presets-border-width);
304
+ @property st-global(--wds-calendar-weekday-label-color);
288
305
  @property st-global(--wds-card-base-shadow);
289
306
  @property st-global(--wds-card-border-radius);
290
307
  @property st-global(--wds-card-content-padding-large);
@@ -1440,6 +1457,7 @@
1440
1457
  @property st-global(--wds-social-post-preview-content-padding-vertical);
1441
1458
  @property st-global(--wds-social-preview-content-padding-horizontal);
1442
1459
  @property st-global(--wds-social-preview-content-padding-vertical);
1460
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
1443
1461
  @property st-global(--wds-statistics-widget-description-font-line-height);
1444
1462
  @property st-global(--wds-statistics-widget-description-font-size);
1445
1463
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2147,6 +2165,23 @@
2147
2165
  --wds-button-size-tiny: 24px;
2148
2166
  --wds-button-size-tiny-screen-small: 32px;
2149
2167
  --wds-button-size-x-tiny: 18px;
2168
+ --wds-calendar-day-fill-hover: #f0efef;
2169
+ --wds-calendar-day-fill-range: #f0efef;
2170
+ --wds-calendar-day-fill-range-edge: rgba(255, 255, 255, 0);
2171
+ --wds-calendar-day-fill-selected: #151414;
2172
+ --wds-calendar-day-fill-selected-hover: #383838;
2173
+ --wds-calendar-day-fill-today: #dedede;
2174
+ --wds-calendar-day-gap: 2px;
2175
+ --wds-calendar-day-range-border-radius: 8px;
2176
+ --wds-calendar-day-range-edge-border-radius: 8px;
2177
+ --wds-calendar-day-today-inset-width: 0px;
2178
+ --wds-calendar-padding-medium: 18px;
2179
+ --wds-calendar-padding-small: 12px;
2180
+ --wds-calendar-panel-footer-border-fill: rgba(19, 23, 32, 0);
2181
+ --wds-calendar-panel-footer-border-width: 0px;
2182
+ --wds-calendar-panel-presets-border-fill: rgba(19, 23, 32, 0);
2183
+ --wds-calendar-panel-presets-border-width: 0px;
2184
+ --wds-calendar-weekday-label-color: #a8a6a5;
2150
2185
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2151
2186
  --wds-card-border-radius: 16px;
2152
2187
  --wds-card-content-padding-large: 12px;
@@ -3302,6 +3337,7 @@
3302
3337
  --wds-social-post-preview-content-padding-vertical: 12px;
3303
3338
  --wds-social-preview-content-padding-horizontal: 12px;
3304
3339
  --wds-social-preview-content-padding-vertical: 8px;
3340
+ --wds-stars-rating-bar-unfilled-star-color: #a8a6a5;
3305
3341
  --wds-statistics-widget-description-font-line-height: 16px;
3306
3342
  --wds-statistics-widget-description-font-size: 12px;
3307
3343
  --wds-statistics-widget-description-info-gap: 2px;
@@ -3446,7 +3482,7 @@
3446
3482
  --wds-text-button-font-line-height-tiny: 12px;
3447
3483
  --wds-text-button-font-size-medium: 14px;
3448
3484
  --wds-text-button-font-size-small: 12px;
3449
- --wds-text-button-font-size-tiny: 10px;
3485
+ --wds-text-button-font-size-tiny: 12px;
3450
3486
  --wds-text-button-font-weight-normal: 600;
3451
3487
  --wds-text-button-font-weight-thin: 500;
3452
3488
  --wds-text-button-size-medium: 18px;
@@ -517,6 +517,9 @@
517
517
  --wds-card-header-suffix-align: flex-start;
518
518
  --wds-card-divider-opacity: 0;
519
519
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
520
+ --wds-calendar-padding-small: 18px;
521
+ --wds-calendar-day-today-inset-width: 3px;
522
+ --wds-calendar-day-range-edge-border-radius: 50%;
520
523
  --wds-button-border-ai-secondary-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
521
524
  --wds-breadcrumbs-height-medium: 26px;
522
525
  --wds-avatar-group-gap-condensed: -2px;
@@ -1195,6 +1198,7 @@
1195
1198
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
1196
1199
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
1197
1200
  --wds-statistics-widget-description-info-gap: var(--wds-space-50);
1201
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-400);
1198
1202
  --wds-social-preview-content-padding-vertical: var(--wds-space-200);
1199
1203
  --wds-social-preview-content-padding-horizontal: var(--wds-space-300);
1200
1204
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-300);
@@ -1829,6 +1833,13 @@
1829
1833
  --wds-card-content-padding-medium-bottom: var(--wds-space-600);
1830
1834
  --wds-card-content-padding-medium: var(--wds-space-300);
1831
1835
  --wds-card-content-padding-large: var(--wds-space-300);
1836
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1837
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1838
+ --wds-calendar-padding-medium: var(--wds-space-600);
1839
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1840
+ --wds-calendar-day-gap: var(--wds-space-0);
1841
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1842
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1832
1843
  --wds-button-size-x-tiny: var(--wds-space-475);
1833
1844
  --wds-button-size-tiny-screen-small: var(--wds-space-800);
1834
1845
  --wds-button-size-tiny: var(--wds-space-600);
@@ -2425,6 +2436,13 @@
2425
2436
  --wds-card-subtitle-line-height: var(--wds-font-line-height-200);
2426
2437
  --wds-card-subtitle-color: var(--wds-color-text-standard-secondary);
2427
2438
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2439
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2440
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2441
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2442
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2443
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2444
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2445
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2428
2446
  --wds-button-label-font-size-large: var(--wds-font-size-body-medium);
2429
2447
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary-active);
2430
2448
  --wds-button-label-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
@@ -487,6 +487,9 @@
487
487
  --wds-card-gallery-item-action-button-min-width: 84px;
488
488
  --wds-card-divider-opacity: 0;
489
489
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
490
+ --wds-calendar-padding-small: 18px;
491
+ --wds-calendar-day-today-inset-width: 3px;
492
+ --wds-calendar-day-range-edge-border-radius: 50%;
490
493
  --wds-button-border-ai-secondary-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
491
494
  --wds-breakpoint-x-large: 1572px;
492
495
  --wds-breakpoint-small: 490px;
@@ -769,6 +772,7 @@
769
772
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
770
773
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
771
774
  --wds-statistics-widget-description-info-gap: var(--wds-space-50);
775
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-400);
772
776
  --wds-space-viewport-spacing: var(--wds-space-1200);
773
777
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-100);
774
778
  --wds-space-padding-vertical-x-tiny: var(--wds-space-200);
@@ -1817,6 +1821,13 @@
1817
1821
  --wds-card-content-padding-medium-bottom: var(--wds-space-600);
1818
1822
  --wds-card-content-padding-medium: var(--wds-space-300);
1819
1823
  --wds-card-content-padding-large: var(--wds-space-300);
1824
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1825
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1826
+ --wds-calendar-padding-medium: var(--wds-space-600);
1827
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1828
+ --wds-calendar-day-gap: var(--wds-space-0);
1829
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1830
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1820
1831
  --wds-button-size-x-tiny: var(--wds-space-475);
1821
1832
  --wds-button-size-tiny-screen-small: var(--wds-space-800);
1822
1833
  --wds-button-size-tiny: var(--wds-space-600);
@@ -2425,6 +2436,13 @@
2425
2436
  --wds-card-gallery-item-fill: var(--wds-color-fill-surface-default);
2426
2437
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-small);
2427
2438
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2439
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2440
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2441
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2442
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2443
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2444
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2445
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2428
2446
  --wds-button-label-font-size-large: var(--wds-font-size-body-medium);
2429
2447
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-fill-standard-primary-active);
2430
2448
  --wds-button-label-fill-standard-secondary-active: var(--wds-color-fill-standard-primary-active);
@@ -330,6 +330,23 @@
330
330
  @property st-global(--wds-button-size-tiny);
331
331
  @property st-global(--wds-button-size-tiny-screen-small);
332
332
  @property st-global(--wds-button-size-x-tiny);
333
+ @property st-global(--wds-calendar-day-fill-hover);
334
+ @property st-global(--wds-calendar-day-fill-range);
335
+ @property st-global(--wds-calendar-day-fill-range-edge);
336
+ @property st-global(--wds-calendar-day-fill-selected);
337
+ @property st-global(--wds-calendar-day-fill-selected-hover);
338
+ @property st-global(--wds-calendar-day-fill-today);
339
+ @property st-global(--wds-calendar-day-gap);
340
+ @property st-global(--wds-calendar-day-range-border-radius);
341
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
342
+ @property st-global(--wds-calendar-day-today-inset-width);
343
+ @property st-global(--wds-calendar-padding-medium);
344
+ @property st-global(--wds-calendar-padding-small);
345
+ @property st-global(--wds-calendar-panel-footer-border-fill);
346
+ @property st-global(--wds-calendar-panel-footer-border-width);
347
+ @property st-global(--wds-calendar-panel-presets-border-fill);
348
+ @property st-global(--wds-calendar-panel-presets-border-width);
349
+ @property st-global(--wds-calendar-weekday-label-color);
333
350
  @property st-global(--wds-card-base-shadow);
334
351
  @property st-global(--wds-card-border-radius);
335
352
  @property st-global(--wds-card-content-padding-large);
@@ -2190,6 +2207,7 @@
2190
2207
  @property st-global(--wds-space-padding-vertical-x-tiny);
2191
2208
  @property st-global(--wds-space-padding-vertical-xx-tiny);
2192
2209
  @property st-global(--wds-space-viewport-spacing);
2210
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
2193
2211
  @property st-global(--wds-statistics-widget-description-font-line-height);
2194
2212
  @property st-global(--wds-statistics-widget-description-font-size);
2195
2213
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2944,6 +2962,23 @@
2944
2962
  --wds-button-size-tiny: 24px;
2945
2963
  --wds-button-size-tiny-screen-small: 32px;
2946
2964
  --wds-button-size-x-tiny: 18px;
2965
+ --wds-calendar-day-fill-hover: #212328;
2966
+ --wds-calendar-day-fill-range: #212328;
2967
+ --wds-calendar-day-fill-range-edge: #212328;
2968
+ --wds-calendar-day-fill-selected: #82B0FF;
2969
+ --wds-calendar-day-fill-selected-hover: #B1CCFF;
2970
+ --wds-calendar-day-fill-today: #3A3A3B;
2971
+ --wds-calendar-day-gap: 0px;
2972
+ --wds-calendar-day-range-border-radius: 0px;
2973
+ --wds-calendar-day-range-edge-border-radius: 50%;
2974
+ --wds-calendar-day-today-inset-width: 3px;
2975
+ --wds-calendar-padding-medium: 24px;
2976
+ --wds-calendar-padding-small: 18px;
2977
+ --wds-calendar-panel-footer-border-fill: #454544;
2978
+ --wds-calendar-panel-footer-border-width: 1px;
2979
+ --wds-calendar-panel-presets-border-fill: #454544;
2980
+ --wds-calendar-panel-presets-border-width: 1px;
2981
+ --wds-calendar-weekday-label-color: #FFFFFF;
2947
2982
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2948
2983
  --wds-card-border-radius: 12px;
2949
2984
  --wds-card-content-padding-large: 12px;
@@ -4804,6 +4839,7 @@
4804
4839
  --wds-space-padding-vertical-x-tiny: 8px;
4805
4840
  --wds-space-padding-vertical-xx-tiny: 4px;
4806
4841
  --wds-space-viewport-spacing: 48px;
4842
+ --wds-stars-rating-bar-unfilled-star-color: #A09E9D;
4807
4843
  --wds-statistics-widget-description-font-line-height: 16px;
4808
4844
  --wds-statistics-widget-description-font-size: 12px;
4809
4845
  --wds-statistics-widget-description-info-gap: 2px;
@@ -288,6 +288,23 @@
288
288
  @property st-global(--wds-button-size-tiny);
289
289
  @property st-global(--wds-button-size-tiny-screen-small);
290
290
  @property st-global(--wds-button-size-x-tiny);
291
+ @property st-global(--wds-calendar-day-fill-hover);
292
+ @property st-global(--wds-calendar-day-fill-range);
293
+ @property st-global(--wds-calendar-day-fill-range-edge);
294
+ @property st-global(--wds-calendar-day-fill-selected);
295
+ @property st-global(--wds-calendar-day-fill-selected-hover);
296
+ @property st-global(--wds-calendar-day-fill-today);
297
+ @property st-global(--wds-calendar-day-gap);
298
+ @property st-global(--wds-calendar-day-range-border-radius);
299
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
300
+ @property st-global(--wds-calendar-day-today-inset-width);
301
+ @property st-global(--wds-calendar-padding-medium);
302
+ @property st-global(--wds-calendar-padding-small);
303
+ @property st-global(--wds-calendar-panel-footer-border-fill);
304
+ @property st-global(--wds-calendar-panel-footer-border-width);
305
+ @property st-global(--wds-calendar-panel-presets-border-fill);
306
+ @property st-global(--wds-calendar-panel-presets-border-width);
307
+ @property st-global(--wds-calendar-weekday-label-color);
291
308
  @property st-global(--wds-card-base-shadow);
292
309
  @property st-global(--wds-card-border-radius);
293
310
  @property st-global(--wds-card-content-padding-large);
@@ -1439,6 +1456,7 @@
1439
1456
  @property st-global(--wds-social-post-preview-content-padding-vertical);
1440
1457
  @property st-global(--wds-social-preview-content-padding-horizontal);
1441
1458
  @property st-global(--wds-social-preview-content-padding-vertical);
1459
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
1442
1460
  @property st-global(--wds-statistics-widget-description-font-line-height);
1443
1461
  @property st-global(--wds-statistics-widget-description-font-size);
1444
1462
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2149,6 +2167,23 @@
2149
2167
  --wds-button-size-tiny: 24px;
2150
2168
  --wds-button-size-tiny-screen-small: 32px;
2151
2169
  --wds-button-size-x-tiny: 18px;
2170
+ --wds-calendar-day-fill-hover: #212328;
2171
+ --wds-calendar-day-fill-range: #212328;
2172
+ --wds-calendar-day-fill-range-edge: #212328;
2173
+ --wds-calendar-day-fill-selected: #82B0FF;
2174
+ --wds-calendar-day-fill-selected-hover: #B1CCFF;
2175
+ --wds-calendar-day-fill-today: #3A3A3B;
2176
+ --wds-calendar-day-gap: 0px;
2177
+ --wds-calendar-day-range-border-radius: 0px;
2178
+ --wds-calendar-day-range-edge-border-radius: 50%;
2179
+ --wds-calendar-day-today-inset-width: 3px;
2180
+ --wds-calendar-padding-medium: 24px;
2181
+ --wds-calendar-padding-small: 18px;
2182
+ --wds-calendar-panel-footer-border-fill: #454544;
2183
+ --wds-calendar-panel-footer-border-width: 1px;
2184
+ --wds-calendar-panel-presets-border-fill: #454544;
2185
+ --wds-calendar-panel-presets-border-width: 1px;
2186
+ --wds-calendar-weekday-label-color: #FFFFFF;
2152
2187
  --wds-card-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2153
2188
  --wds-card-border-radius: 12px;
2154
2189
  --wds-card-content-padding-large: 12px;
@@ -3300,6 +3335,7 @@
3300
3335
  --wds-social-post-preview-content-padding-vertical: 12px;
3301
3336
  --wds-social-preview-content-padding-horizontal: 12px;
3302
3337
  --wds-social-preview-content-padding-vertical: 8px;
3338
+ --wds-stars-rating-bar-unfilled-star-color: #A09E9D;
3303
3339
  --wds-statistics-widget-description-font-line-height: 16px;
3304
3340
  --wds-statistics-widget-description-font-size: 12px;
3305
3341
  --wds-statistics-widget-description-info-gap: 2px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.228.0",
3
+ "version": "1.229.1",
4
4
  "scripts": {
5
5
  "build": "cp -r tokens/* .",
6
6
  "figma-to-dictionary": "ts-node src/scripts/figma-to-dictionary.ts",
@@ -36,5 +36,5 @@
36
36
  "author": "augustinasv@wix.com",
37
37
  "description": "Design system tokens",
38
38
  "packageManager": "yarn@3.5.0",
39
- "falconPackageHash": "43a4e67bb308b2b95f2653e11bf3da181b4805f94d23a9e9ac586761"
39
+ "falconPackageHash": "5f5f9fa9f694aba9eb460f3eb11675e19c2371a4b1c1353890d65709"
40
40
  }
package/studio/all.css CHANGED
@@ -520,6 +520,9 @@
520
520
  --wds-card-header-suffix-align: center;
521
521
  --wds-card-divider-opacity: 1;
522
522
  --wds-card-base-shadow: none;
523
+ --wds-calendar-padding-small: 18px;
524
+ --wds-calendar-day-today-inset-width: 3px;
525
+ --wds-calendar-day-range-edge-border-radius: 50%;
523
526
  --wds-button-icon-offset-tiny: 12px;
524
527
  --wds-button-icon-offset-small: 12px;
525
528
  --wds-button-icon-offset-medium: 18px;
@@ -1182,6 +1185,7 @@
1182
1185
  --wds-statistics-widget-padding-vertical-tiny: var(--wds-space-300);
1183
1186
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-600);
1184
1187
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-600);
1188
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
1185
1189
  --wds-social-preview-content-padding-vertical: var(--wds-space-200);
1186
1190
  --wds-social-preview-content-padding-horizontal: var(--wds-space-300);
1187
1191
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-300);
@@ -1764,6 +1768,13 @@
1764
1768
  --wds-card-content-padding-medium: var(--wds-space-600);
1765
1769
  --wds-card-content-padding-large: var(--wds-space-900);
1766
1770
  --wds-card-border: var(--wds-border-radius-200);
1771
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1772
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1773
+ --wds-calendar-padding-medium: var(--wds-space-600);
1774
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1775
+ --wds-calendar-day-gap: var(--wds-space-0);
1776
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1777
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1767
1778
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1768
1779
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1769
1780
  --wds-button-size-x-tiny: var(--wds-space-475);
@@ -2381,6 +2392,13 @@
2381
2392
  --wds-card-subtitle-color: var(--wds-color-text-standard-secondary);
2382
2393
  --wds-card-shadow: var(--wds-shadow-surface-raised);
2383
2394
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2395
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2396
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2397
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2398
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2399
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2400
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2401
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2384
2402
  --wds-button-text-hover: var(--wds-color-text-primary);
2385
2403
  --wds-button-outline-hover: var(--wds-color-border-standard-secondary);
2386
2404
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
package/studio/all.scss CHANGED
@@ -493,6 +493,9 @@
493
493
  --wds-card-gallery-item-action-button-min-width: 84px;
494
494
  --wds-card-divider-opacity: 1;
495
495
  --wds-card-base-shadow: none;
496
+ --wds-calendar-padding-small: 18px;
497
+ --wds-calendar-day-today-inset-width: 3px;
498
+ --wds-calendar-day-range-edge-border-radius: 50%;
496
499
  --wds-button-icon-offset-tiny: 12px;
497
500
  --wds-button-icon-offset-small: 12px;
498
501
  --wds-button-icon-offset-medium: 18px;
@@ -767,6 +770,7 @@
767
770
  --wds-statistics-widget-padding-vertical-tiny: var(--wds-space-300);
768
771
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-600);
769
772
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-600);
773
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
770
774
  --wds-space-viewport-spacing: var(--wds-space-1200);
771
775
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-100);
772
776
  --wds-space-padding-vertical-x-tiny: var(--wds-space-200);
@@ -1752,6 +1756,13 @@
1752
1756
  --wds-card-content-padding-medium: var(--wds-space-600);
1753
1757
  --wds-card-content-padding-large: var(--wds-space-900);
1754
1758
  --wds-card-border: var(--wds-border-radius-200);
1759
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1760
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1761
+ --wds-calendar-padding-medium: var(--wds-space-600);
1762
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1763
+ --wds-calendar-day-gap: var(--wds-space-0);
1764
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1765
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1755
1766
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1756
1767
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1757
1768
  --wds-button-size-x-tiny: var(--wds-space-475);
@@ -2381,6 +2392,13 @@
2381
2392
  --wds-card-gallery-item-action-button-line-height: var(--wds-font-line-height-200);
2382
2393
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-small);
2383
2394
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2395
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2396
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2397
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2398
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2399
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2400
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2401
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2384
2402
  --wds-button-text-hover: var(--wds-color-text-primary);
2385
2403
  --wds-button-outline-hover: var(--wds-color-border-standard-secondary);
2386
2404
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
package/studio/all.st.css CHANGED
@@ -328,6 +328,23 @@
328
328
  @property st-global(--wds-button-text-hover);
329
329
  @property st-global(--wds-button-text-standard-primary);
330
330
  @property st-global(--wds-button-text-standard-primary-hover);
331
+ @property st-global(--wds-calendar-day-fill-hover);
332
+ @property st-global(--wds-calendar-day-fill-range);
333
+ @property st-global(--wds-calendar-day-fill-range-edge);
334
+ @property st-global(--wds-calendar-day-fill-selected);
335
+ @property st-global(--wds-calendar-day-fill-selected-hover);
336
+ @property st-global(--wds-calendar-day-fill-today);
337
+ @property st-global(--wds-calendar-day-gap);
338
+ @property st-global(--wds-calendar-day-range-border-radius);
339
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
340
+ @property st-global(--wds-calendar-day-today-inset-width);
341
+ @property st-global(--wds-calendar-padding-medium);
342
+ @property st-global(--wds-calendar-padding-small);
343
+ @property st-global(--wds-calendar-panel-footer-border-fill);
344
+ @property st-global(--wds-calendar-panel-footer-border-width);
345
+ @property st-global(--wds-calendar-panel-presets-border-fill);
346
+ @property st-global(--wds-calendar-panel-presets-border-width);
347
+ @property st-global(--wds-calendar-weekday-label-color);
331
348
  @property st-global(--wds-card-base-shadow);
332
349
  @property st-global(--wds-card-border);
333
350
  @property st-global(--wds-card-border-radius);
@@ -2193,6 +2210,7 @@
2193
2210
  @property st-global(--wds-space-padding-vertical-x-tiny);
2194
2211
  @property st-global(--wds-space-padding-vertical-xx-tiny);
2195
2212
  @property st-global(--wds-space-viewport-spacing);
2213
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
2196
2214
  @property st-global(--wds-statistics-widget-description-font-line-height);
2197
2215
  @property st-global(--wds-statistics-widget-description-font-size);
2198
2216
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2943,6 +2961,23 @@
2943
2961
  --wds-button-text-hover: #116dff;
2944
2962
  --wds-button-text-standard-primary: #131720;
2945
2963
  --wds-button-text-standard-primary-hover: #131720;
2964
+ --wds-calendar-day-fill-hover: #f7f8f8;
2965
+ --wds-calendar-day-fill-range: #ebf2ff;
2966
+ --wds-calendar-day-fill-range-edge: #ebf2ff;
2967
+ --wds-calendar-day-fill-selected: #116dff;
2968
+ --wds-calendar-day-fill-selected-hover: #0f62e6;
2969
+ --wds-calendar-day-fill-today: #f7f8f8;
2970
+ --wds-calendar-day-gap: 0px;
2971
+ --wds-calendar-day-range-border-radius: 0px;
2972
+ --wds-calendar-day-range-edge-border-radius: 50%;
2973
+ --wds-calendar-day-today-inset-width: 3px;
2974
+ --wds-calendar-padding-medium: 24px;
2975
+ --wds-calendar-padding-small: 18px;
2976
+ --wds-calendar-panel-footer-border-fill: #e2e3ea;
2977
+ --wds-calendar-panel-footer-border-width: 1px;
2978
+ --wds-calendar-panel-presets-border-fill: #e2e3ea;
2979
+ --wds-calendar-panel-presets-border-width: 1px;
2980
+ --wds-calendar-weekday-label-color: #131720;
2946
2981
  --wds-card-base-shadow: none;
2947
2982
  --wds-card-border: 4px;
2948
2983
  --wds-card-border-radius: 4px;
@@ -4808,6 +4843,7 @@
4808
4843
  --wds-space-padding-vertical-x-tiny: 8px;
4809
4844
  --wds-space-padding-vertical-xx-tiny: 4px;
4810
4845
  --wds-space-viewport-spacing: 48px;
4846
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
4811
4847
  --wds-statistics-widget-description-font-line-height: 20px;
4812
4848
  --wds-statistics-widget-description-font-size: 14px;
4813
4849
  --wds-statistics-widget-description-info-gap: 6px;
@@ -289,6 +289,23 @@
289
289
  @property st-global(--wds-button-text-hover);
290
290
  @property st-global(--wds-button-text-standard-primary);
291
291
  @property st-global(--wds-button-text-standard-primary-hover);
292
+ @property st-global(--wds-calendar-day-fill-hover);
293
+ @property st-global(--wds-calendar-day-fill-range);
294
+ @property st-global(--wds-calendar-day-fill-range-edge);
295
+ @property st-global(--wds-calendar-day-fill-selected);
296
+ @property st-global(--wds-calendar-day-fill-selected-hover);
297
+ @property st-global(--wds-calendar-day-fill-today);
298
+ @property st-global(--wds-calendar-day-gap);
299
+ @property st-global(--wds-calendar-day-range-border-radius);
300
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
301
+ @property st-global(--wds-calendar-day-today-inset-width);
302
+ @property st-global(--wds-calendar-padding-medium);
303
+ @property st-global(--wds-calendar-padding-small);
304
+ @property st-global(--wds-calendar-panel-footer-border-fill);
305
+ @property st-global(--wds-calendar-panel-footer-border-width);
306
+ @property st-global(--wds-calendar-panel-presets-border-fill);
307
+ @property st-global(--wds-calendar-panel-presets-border-width);
308
+ @property st-global(--wds-calendar-weekday-label-color);
292
309
  @property st-global(--wds-card-base-shadow);
293
310
  @property st-global(--wds-card-border);
294
311
  @property st-global(--wds-card-border-radius);
@@ -1446,6 +1463,7 @@
1446
1463
  @property st-global(--wds-social-post-preview-content-padding-vertical);
1447
1464
  @property st-global(--wds-social-preview-content-padding-horizontal);
1448
1465
  @property st-global(--wds-social-preview-content-padding-vertical);
1466
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
1449
1467
  @property st-global(--wds-statistics-widget-description-font-line-height);
1450
1468
  @property st-global(--wds-statistics-widget-description-font-size);
1451
1469
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2155,6 +2173,23 @@
2155
2173
  --wds-button-text-hover: #116dff;
2156
2174
  --wds-button-text-standard-primary: #131720;
2157
2175
  --wds-button-text-standard-primary-hover: #131720;
2176
+ --wds-calendar-day-fill-hover: #f7f8f8;
2177
+ --wds-calendar-day-fill-range: #ebf2ff;
2178
+ --wds-calendar-day-fill-range-edge: #ebf2ff;
2179
+ --wds-calendar-day-fill-selected: #116dff;
2180
+ --wds-calendar-day-fill-selected-hover: #0f62e6;
2181
+ --wds-calendar-day-fill-today: #f7f8f8;
2182
+ --wds-calendar-day-gap: 0px;
2183
+ --wds-calendar-day-range-border-radius: 0px;
2184
+ --wds-calendar-day-range-edge-border-radius: 50%;
2185
+ --wds-calendar-day-today-inset-width: 3px;
2186
+ --wds-calendar-padding-medium: 24px;
2187
+ --wds-calendar-padding-small: 18px;
2188
+ --wds-calendar-panel-footer-border-fill: #e2e3ea;
2189
+ --wds-calendar-panel-footer-border-width: 1px;
2190
+ --wds-calendar-panel-presets-border-fill: #e2e3ea;
2191
+ --wds-calendar-panel-presets-border-width: 1px;
2192
+ --wds-calendar-weekday-label-color: #131720;
2158
2193
  --wds-card-base-shadow: none;
2159
2194
  --wds-card-border: 4px;
2160
2195
  --wds-card-border-radius: 4px;
@@ -3312,6 +3347,7 @@
3312
3347
  --wds-social-post-preview-content-padding-vertical: 12px;
3313
3348
  --wds-social-preview-content-padding-horizontal: 12px;
3314
3349
  --wds-social-preview-content-padding-vertical: 8px;
3350
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
3315
3351
  --wds-statistics-widget-description-font-line-height: 20px;
3316
3352
  --wds-statistics-widget-description-font-size: 14px;
3317
3353
  --wds-statistics-widget-description-info-gap: 6px;
package/wixel/all.css CHANGED
@@ -502,6 +502,9 @@
502
502
  --wds-card-header-suffix-align: center;
503
503
  --wds-card-divider-opacity: 1;
504
504
  --wds-card-base-shadow: none;
505
+ --wds-calendar-padding-small: 18px;
506
+ --wds-calendar-day-today-inset-width: 3px;
507
+ --wds-calendar-day-range-edge-border-radius: 50%;
505
508
  --wds-button-outline-hover: transparent;
506
509
  --wds-button-icon-offset-tiny: 12px;
507
510
  --wds-button-icon-offset-small: 12px;
@@ -1141,6 +1144,7 @@
1141
1144
  --wds-statistics-widget-padding-vertical-large: var(--wds-space-500);
1142
1145
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
1143
1146
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
1147
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
1144
1148
  --wds-social-preview-content-padding-vertical: var(--wds-space-200);
1145
1149
  --wds-social-preview-content-padding-horizontal: var(--wds-space-300);
1146
1150
  --wds-social-post-preview-content-padding-vertical: var(--wds-space-300);
@@ -1697,6 +1701,13 @@
1697
1701
  --wds-card-content-padding-medium: var(--wds-space-600);
1698
1702
  --wds-card-content-padding-large: var(--wds-space-600);
1699
1703
  --wds-card-border: var(--wds-border-radius-200);
1704
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1705
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1706
+ --wds-calendar-padding-medium: var(--wds-space-600);
1707
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1708
+ --wds-calendar-day-gap: var(--wds-space-0);
1709
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1710
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1700
1711
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1701
1712
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1702
1713
  --wds-button-size-x-tiny: var(--wds-space-500);
@@ -2308,6 +2319,13 @@
2308
2319
  --wds-card-subtitle-color: var(--wds-color-text-standard-secondary);
2309
2320
  --wds-card-shadow: var(--wds-shadow-surface-raised);
2310
2321
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2322
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2323
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2324
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2325
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2326
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2327
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2328
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2311
2329
  --wds-button-text-hover: var(--wds-color-text-standard-primary-light);
2312
2330
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
2313
2331
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
package/wixel/all.scss CHANGED
@@ -475,6 +475,9 @@
475
475
  --wds-card-gallery-item-action-button-min-width: 84px;
476
476
  --wds-card-divider-opacity: 1;
477
477
  --wds-card-base-shadow: none;
478
+ --wds-calendar-padding-small: 18px;
479
+ --wds-calendar-day-today-inset-width: 3px;
480
+ --wds-calendar-day-range-edge-border-radius: 50%;
478
481
  --wds-button-outline-hover: transparent;
479
482
  --wds-button-icon-offset-tiny: 12px;
480
483
  --wds-button-icon-offset-small: 12px;
@@ -742,6 +745,7 @@
742
745
  --wds-statistics-widget-padding-vertical-large: var(--wds-space-500);
743
746
  --wds-statistics-widget-padding-horizontal-tiny: var(--wds-space-300);
744
747
  --wds-statistics-widget-padding-horizontal-large: var(--wds-space-300);
748
+ --wds-stars-rating-bar-unfilled-star-color: var(--wds-color-black-500);
745
749
  --wds-space-viewport-spacing: var(--wds-space-1200);
746
750
  --wds-space-padding-vertical-xx-tiny: var(--wds-space-100);
747
751
  --wds-space-padding-vertical-x-tiny: var(--wds-space-200);
@@ -1685,6 +1689,13 @@
1685
1689
  --wds-card-content-padding-medium: var(--wds-space-600);
1686
1690
  --wds-card-content-padding-large: var(--wds-space-600);
1687
1691
  --wds-card-border: var(--wds-border-radius-200);
1692
+ --wds-calendar-panel-presets-border-width: var(--wds-border-width-100);
1693
+ --wds-calendar-panel-footer-border-width: var(--wds-border-width-100);
1694
+ --wds-calendar-padding-medium: var(--wds-space-600);
1695
+ --wds-calendar-day-range-border-radius: var(--wds-border-radius-0);
1696
+ --wds-calendar-day-gap: var(--wds-space-0);
1697
+ --wds-calendar-day-fill-range-edge: var(--wds-color-blue-500);
1698
+ --wds-calendar-day-fill-range: var(--wds-color-blue-500);
1688
1699
  --wds-button-text-standard-primary-hover: var(--wds-color-black-100);
1689
1700
  --wds-button-text-standard-primary: var(--wds-color-black-100);
1690
1701
  --wds-button-size-x-tiny: var(--wds-space-500);
@@ -2308,6 +2319,13 @@
2308
2319
  --wds-card-gallery-item-fill: var(--wds-color-fill-standard-secondary);
2309
2320
  --wds-card-gallery-item-action-button-font-size: var(--wds-font-size-body-small);
2310
2321
  --wds-card-border-radius: var(--wds-border-radius-surface-raised);
2322
+ --wds-calendar-weekday-label-color: var(--wds-color-text-standard-primary);
2323
+ --wds-calendar-panel-presets-border-fill: var(--wds-color-border-dark-secondary);
2324
+ --wds-calendar-panel-footer-border-fill: var(--wds-color-border-dark-secondary);
2325
+ --wds-calendar-day-fill-today: var(--wds-color-fill-dark-secondary);
2326
+ --wds-calendar-day-fill-selected-hover: var(--wds-color-fill-standard-primary-hover);
2327
+ --wds-calendar-day-fill-selected: var(--wds-color-fill-standard-primary);
2328
+ --wds-calendar-day-fill-hover: var(--wds-color-fill-standard-tertiary-hover);
2311
2329
  --wds-button-text-hover: var(--wds-color-text-standard-primary-light);
2312
2330
  --wds-button-label-fill-transparent-tertiary: var(--wds-color-text-standard-primary-light);
2313
2331
  --wds-button-label-fill-standard-secondary-hover: var(--wds-color-text-standard-primary-light);
package/wixel/all.st.css CHANGED
@@ -328,6 +328,23 @@
328
328
  @property st-global(--wds-button-text-hover);
329
329
  @property st-global(--wds-button-text-standard-primary);
330
330
  @property st-global(--wds-button-text-standard-primary-hover);
331
+ @property st-global(--wds-calendar-day-fill-hover);
332
+ @property st-global(--wds-calendar-day-fill-range);
333
+ @property st-global(--wds-calendar-day-fill-range-edge);
334
+ @property st-global(--wds-calendar-day-fill-selected);
335
+ @property st-global(--wds-calendar-day-fill-selected-hover);
336
+ @property st-global(--wds-calendar-day-fill-today);
337
+ @property st-global(--wds-calendar-day-gap);
338
+ @property st-global(--wds-calendar-day-range-border-radius);
339
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
340
+ @property st-global(--wds-calendar-day-today-inset-width);
341
+ @property st-global(--wds-calendar-padding-medium);
342
+ @property st-global(--wds-calendar-padding-small);
343
+ @property st-global(--wds-calendar-panel-footer-border-fill);
344
+ @property st-global(--wds-calendar-panel-footer-border-width);
345
+ @property st-global(--wds-calendar-panel-presets-border-fill);
346
+ @property st-global(--wds-calendar-panel-presets-border-width);
347
+ @property st-global(--wds-calendar-weekday-label-color);
331
348
  @property st-global(--wds-card-base-shadow);
332
349
  @property st-global(--wds-card-border);
333
350
  @property st-global(--wds-card-border-radius);
@@ -2136,6 +2153,7 @@
2136
2153
  @property st-global(--wds-space-padding-vertical-x-tiny);
2137
2154
  @property st-global(--wds-space-padding-vertical-xx-tiny);
2138
2155
  @property st-global(--wds-space-viewport-spacing);
2156
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
2139
2157
  @property st-global(--wds-statistics-widget-description-font-line-height);
2140
2158
  @property st-global(--wds-statistics-widget-description-font-size);
2141
2159
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2879,6 +2897,23 @@
2879
2897
  --wds-button-text-hover: #ffffff;
2880
2898
  --wds-button-text-standard-primary: #000624;
2881
2899
  --wds-button-text-standard-primary-hover: #000624;
2900
+ --wds-calendar-day-fill-hover: #f4f6ff;
2901
+ --wds-calendar-day-fill-range: #eef0ff;
2902
+ --wds-calendar-day-fill-range-edge: #eef0ff;
2903
+ --wds-calendar-day-fill-selected: #4a57ff;
2904
+ --wds-calendar-day-fill-selected-hover: #4849f1;
2905
+ --wds-calendar-day-fill-today: #f7f8f8;
2906
+ --wds-calendar-day-gap: 0px;
2907
+ --wds-calendar-day-range-border-radius: 0px;
2908
+ --wds-calendar-day-range-edge-border-radius: 50%;
2909
+ --wds-calendar-day-today-inset-width: 3px;
2910
+ --wds-calendar-padding-medium: 24px;
2911
+ --wds-calendar-padding-small: 18px;
2912
+ --wds-calendar-panel-footer-border-fill: #e2e3ea;
2913
+ --wds-calendar-panel-footer-border-width: 1px;
2914
+ --wds-calendar-panel-presets-border-fill: #e2e3ea;
2915
+ --wds-calendar-panel-presets-border-width: 1px;
2916
+ --wds-calendar-weekday-label-color: #000624;
2882
2917
  --wds-card-base-shadow: none;
2883
2918
  --wds-card-border: 4px;
2884
2919
  --wds-card-border-radius: 12px;
@@ -4687,6 +4722,7 @@
4687
4722
  --wds-space-padding-vertical-x-tiny: 8px;
4688
4723
  --wds-space-padding-vertical-xx-tiny: 4px;
4689
4724
  --wds-space-viewport-spacing: 48px;
4725
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
4690
4726
  --wds-statistics-widget-description-font-line-height: 20px;
4691
4727
  --wds-statistics-widget-description-font-size: 14px;
4692
4728
  --wds-statistics-widget-description-info-gap: 6px;
@@ -289,6 +289,23 @@
289
289
  @property st-global(--wds-button-text-hover);
290
290
  @property st-global(--wds-button-text-standard-primary);
291
291
  @property st-global(--wds-button-text-standard-primary-hover);
292
+ @property st-global(--wds-calendar-day-fill-hover);
293
+ @property st-global(--wds-calendar-day-fill-range);
294
+ @property st-global(--wds-calendar-day-fill-range-edge);
295
+ @property st-global(--wds-calendar-day-fill-selected);
296
+ @property st-global(--wds-calendar-day-fill-selected-hover);
297
+ @property st-global(--wds-calendar-day-fill-today);
298
+ @property st-global(--wds-calendar-day-gap);
299
+ @property st-global(--wds-calendar-day-range-border-radius);
300
+ @property st-global(--wds-calendar-day-range-edge-border-radius);
301
+ @property st-global(--wds-calendar-day-today-inset-width);
302
+ @property st-global(--wds-calendar-padding-medium);
303
+ @property st-global(--wds-calendar-padding-small);
304
+ @property st-global(--wds-calendar-panel-footer-border-fill);
305
+ @property st-global(--wds-calendar-panel-footer-border-width);
306
+ @property st-global(--wds-calendar-panel-presets-border-fill);
307
+ @property st-global(--wds-calendar-panel-presets-border-width);
308
+ @property st-global(--wds-calendar-weekday-label-color);
292
309
  @property st-global(--wds-card-base-shadow);
293
310
  @property st-global(--wds-card-border);
294
311
  @property st-global(--wds-card-border-radius);
@@ -1419,6 +1436,7 @@
1419
1436
  @property st-global(--wds-social-post-preview-content-padding-vertical);
1420
1437
  @property st-global(--wds-social-preview-content-padding-horizontal);
1421
1438
  @property st-global(--wds-social-preview-content-padding-vertical);
1439
+ @property st-global(--wds-stars-rating-bar-unfilled-star-color);
1422
1440
  @property st-global(--wds-statistics-widget-description-font-line-height);
1423
1441
  @property st-global(--wds-statistics-widget-description-font-size);
1424
1442
  @property st-global(--wds-statistics-widget-description-info-gap);
@@ -2121,6 +2139,23 @@
2121
2139
  --wds-button-text-hover: #ffffff;
2122
2140
  --wds-button-text-standard-primary: #000624;
2123
2141
  --wds-button-text-standard-primary-hover: #000624;
2142
+ --wds-calendar-day-fill-hover: #f4f6ff;
2143
+ --wds-calendar-day-fill-range: #eef0ff;
2144
+ --wds-calendar-day-fill-range-edge: #eef0ff;
2145
+ --wds-calendar-day-fill-selected: #4a57ff;
2146
+ --wds-calendar-day-fill-selected-hover: #4849f1;
2147
+ --wds-calendar-day-fill-today: #f7f8f8;
2148
+ --wds-calendar-day-gap: 0px;
2149
+ --wds-calendar-day-range-border-radius: 0px;
2150
+ --wds-calendar-day-range-edge-border-radius: 50%;
2151
+ --wds-calendar-day-today-inset-width: 3px;
2152
+ --wds-calendar-padding-medium: 24px;
2153
+ --wds-calendar-padding-small: 18px;
2154
+ --wds-calendar-panel-footer-border-fill: #e2e3ea;
2155
+ --wds-calendar-panel-footer-border-width: 1px;
2156
+ --wds-calendar-panel-presets-border-fill: #e2e3ea;
2157
+ --wds-calendar-panel-presets-border-width: 1px;
2158
+ --wds-calendar-weekday-label-color: #000624;
2124
2159
  --wds-card-base-shadow: none;
2125
2160
  --wds-card-border: 4px;
2126
2161
  --wds-card-border-radius: 12px;
@@ -3251,6 +3286,7 @@
3251
3286
  --wds-social-post-preview-content-padding-vertical: 12px;
3252
3287
  --wds-social-preview-content-padding-horizontal: 12px;
3253
3288
  --wds-social-preview-content-padding-vertical: 8px;
3289
+ --wds-stars-rating-bar-unfilled-star-color: #acafc4;
3254
3290
  --wds-statistics-widget-description-font-line-height: 20px;
3255
3291
  --wds-statistics-widget-description-font-size: 14px;
3256
3292
  --wds-statistics-widget-description-info-gap: 6px;