@wix/design-system-tokens 1.87.0 → 1.88.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (12) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/all.css +4 -1
  3. package/all.st.css +6 -0
  4. package/component.st.css +6 -0
  5. package/package.json +2 -2
  6. package/studio/all.css +10 -3
  7. package/studio/all.st.css +16 -2
  8. package/studio/component.st.css +16 -2
  9. package/wixel/all.css +11 -5
  10. package/wixel/all.st.css +16 -4
  11. package/wixel/component.st.css +7 -1
  12. package/wixel/semantic.st.css +9 -3
package/CHANGELOG.md CHANGED
@@ -1,3 +1,9 @@
1
+ ## 1.88.0 - 2025-03-28
2
+
3
+ ### Visual Breaking Changes
4
+
5
+ - breaking(ListItemSelect): change List item select font size & line height [14652](https://github.com/wix-private/wix-design-systems/pull/14652)
6
+
1
7
  ## 1.87.0 - 2025-03-25
2
8
 
3
9
  ### Bug Fixes
package/all.css CHANGED
@@ -212,10 +212,10 @@
212
212
  --wds-custom-modal-header-title-font-line-height: 24px;
213
213
  --wds-custom-modal-header-title-font-size: 16px;
214
214
  --wds-divider-fill-color-light: #dfe5eb;
215
- --wds-divider-vertical-fill-color-light: #dfe5eb;
216
215
  --wds-divider-fill-color-light-primary: #dfe5eb;
217
216
  --wds-divider-fill-color-light-secondary: #dfe5eb;
218
217
  --wds-divider-gradient-border: linear-gradient(90deg, #dfe5eb 0%, #dfe5eb 16%, #dfe5eb 84%, #dfe5eb 100%);
218
+ --wds-divider-vertical-fill-color-light: #dfe5eb;
219
219
  --wds-dock-background-fill: #e7f0ff;
220
220
  --wds-dock-background-fill-active: #d6e6fe;
221
221
  --wds-dock-background-fill-disabled: rgba(0, 6, 36, .1);
@@ -269,6 +269,9 @@
269
269
  --wds-info-icon-fill-hover: #116dff;
270
270
  --wds-input-background-fill-default: #ffffff;
271
271
  --wds-input-background-fill-hover: #e7f0ff;
272
+ --wds-input-border-color: #d6e6fe;
273
+ --wds-input-border-color-hover: #a8caff;
274
+ --wds-input-border-color-readonly: #dfe5eb;
272
275
  --wds-input-border-radius-default-large: 6px;
273
276
  --wds-input-border-radius-default-medium: 6px;
274
277
  --wds-input-border-radius-default-small: 6px;
package/all.st.css CHANGED
@@ -810,6 +810,9 @@
810
810
  @property st-global(--wds-input-area-padding-vertical-small);
811
811
  @property st-global(--wds-input-background-fill-default);
812
812
  @property st-global(--wds-input-background-fill-hover);
813
+ @property st-global(--wds-input-border-color);
814
+ @property st-global(--wds-input-border-color-hover);
815
+ @property st-global(--wds-input-border-color-readonly);
813
816
  @property st-global(--wds-input-border-radius-default-large);
814
817
  @property st-global(--wds-input-border-radius-default-medium);
815
818
  @property st-global(--wds-input-border-radius-default-small);
@@ -2321,6 +2324,9 @@
2321
2324
  --wds-input-area-padding-vertical-small: 6px;
2322
2325
  --wds-input-background-fill-default: #ffffff;
2323
2326
  --wds-input-background-fill-hover: #e7f0ff;
2327
+ --wds-input-border-color: #d6e6fe;
2328
+ --wds-input-border-color-hover: #a8caff;
2329
+ --wds-input-border-color-readonly: #dfe5eb;
2324
2330
  --wds-input-border-radius-default-large: 6px;
2325
2331
  --wds-input-border-radius-default-medium: 6px;
2326
2332
  --wds-input-border-radius-default-small: 6px;
package/component.st.css CHANGED
@@ -276,6 +276,9 @@
276
276
  @property st-global(--wds-input-area-padding-vertical-small);
277
277
  @property st-global(--wds-input-background-fill-default);
278
278
  @property st-global(--wds-input-background-fill-hover);
279
+ @property st-global(--wds-input-border-color);
280
+ @property st-global(--wds-input-border-color-hover);
281
+ @property st-global(--wds-input-border-color-readonly);
279
282
  @property st-global(--wds-input-border-radius-default-large);
280
283
  @property st-global(--wds-input-border-radius-default-medium);
281
284
  @property st-global(--wds-input-border-radius-default-small);
@@ -1164,6 +1167,9 @@
1164
1167
  --wds-input-area-padding-vertical-small: 6px;
1165
1168
  --wds-input-background-fill-default: #ffffff;
1166
1169
  --wds-input-background-fill-hover: #e7f0ff;
1170
+ --wds-input-border-color: #d6e6fe;
1171
+ --wds-input-border-color-hover: #a8caff;
1172
+ --wds-input-border-color-readonly: #dfe5eb;
1167
1173
  --wds-input-border-radius-default-large: 6px;
1168
1174
  --wds-input-border-radius-default-medium: 6px;
1169
1175
  --wds-input-border-radius-default-small: 6px;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@wix/design-system-tokens",
3
- "version": "1.87.0",
3
+ "version": "1.88.0",
4
4
  "packageManager": "yarn@3.5.0",
5
5
  "author": "augustinasv@wix.com",
6
6
  "license": "MIT",
@@ -33,5 +33,5 @@
33
33
  "groupId": "com.wixpress"
34
34
  }
35
35
  },
36
- "falconPackageHash": "f266262cc4287e1e750f7b65d4a3d9eb5019af5755a48c8a2951c3cc"
36
+ "falconPackageHash": "b0065632a659d12395de917a279719c760cf003cc1931de22e2cea08"
37
37
  }
package/studio/all.css CHANGED
@@ -212,10 +212,10 @@
212
212
  --wds-custom-modal-header-title-font-line-height: 20px;
213
213
  --wds-custom-modal-header-title-font-size: 14px;
214
214
  --wds-divider-fill-color-light: #e2e3ea;
215
- --wds-divider-vertical-fill-color-light: #e2e3ea;
216
215
  --wds-divider-fill-color-light-primary: #e2e3ea;
217
216
  --wds-divider-fill-color-light-secondary: #e2e3ea;
218
217
  --wds-divider-gradient-border: linear-gradient(90deg, #e2e3ea 0%, #e2e3ea 16%, #e2e3ea 84%, #e2e3ea 100%);
218
+ --wds-divider-vertical-fill-color-light: #e2e3ea;
219
219
  --wds-dock-background-fill: #ebf2ff;
220
220
  --wds-dock-background-fill-active: #dce9ff;
221
221
  --wds-dock-background-fill-disabled: #e5e5e5;
@@ -269,6 +269,9 @@
269
269
  --wds-info-icon-fill-hover: #116dff;
270
270
  --wds-input-background-fill-default: #ffffff;
271
271
  --wds-input-background-fill-hover: #f7f8f8;
272
+ --wds-input-border-color: #e2e3ea;
273
+ --wds-input-border-color-hover: #868aa5;
274
+ --wds-input-border-color-readonly: #e2e3ea;
272
275
  --wds-input-border-radius-default-large: 4px;
273
276
  --wds-input-border-radius-default-medium: 4px;
274
277
  --wds-input-border-radius-default-small: 4px;
@@ -380,15 +383,19 @@
380
383
  --wds-list-item-select-fill-active: #dce9ff;
381
384
  --wds-list-item-select-fill-disabled: #ffffff;
382
385
  --wds-list-item-select-fill-hover: #f7f8f8;
386
+ --wds-list-item-select-label-font-line-height-medium: 20px;
387
+ --wds-list-item-select-label-font-line-height-small: 16px;
388
+ --wds-list-item-select-label-font-size-medium: 14px;
389
+ --wds-list-item-select-label-font-size-small: 12px;
383
390
  --wds-list-item-select-padding-horizontal-medium: 8px;
384
391
  --wds-list-item-select-padding-horizontal-small: 8px;
385
392
  --wds-list-item-select-padding-left-medium: 12px;
386
393
  --wds-list-item-select-padding-left-small: 12px;
387
394
  --wds-list-item-select-padding-right-medium: 16px;
388
395
  --wds-list-item-select-padding-right-small: 16px;
389
- --wds-list-item-select-padding-vertical-medium: 4px;
396
+ --wds-list-item-select-padding-vertical-medium: 6px;
390
397
  --wds-list-item-select-padding-vertical-medium-screen-small: 8px;
391
- --wds-list-item-select-padding-vertical-small: 4px;
398
+ --wds-list-item-select-padding-vertical-small: 6px;
392
399
  --wds-list-item-select-padding-vertical-small-screen-small: 8px;
393
400
  --wds-list-item-select-subtitle: #868aa5;
394
401
  --wds-list-item-select-subtitle-disabled: #bebebe;
package/studio/all.st.css CHANGED
@@ -806,6 +806,9 @@
806
806
  @property st-global(--wds-input-area-padding-vertical-small);
807
807
  @property st-global(--wds-input-background-fill-default);
808
808
  @property st-global(--wds-input-background-fill-hover);
809
+ @property st-global(--wds-input-border-color);
810
+ @property st-global(--wds-input-border-color-hover);
811
+ @property st-global(--wds-input-border-color-readonly);
809
812
  @property st-global(--wds-input-border-radius-default-large);
810
813
  @property st-global(--wds-input-border-radius-default-medium);
811
814
  @property st-global(--wds-input-border-radius-default-small);
@@ -911,6 +914,10 @@
911
914
  @property st-global(--wds-list-item-select-fill-hover);
912
915
  @property st-global(--wds-list-item-select-icon-padding-horizontal-medium);
913
916
  @property st-global(--wds-list-item-select-icon-padding-vertical-medium);
917
+ @property st-global(--wds-list-item-select-label-font-line-height-medium);
918
+ @property st-global(--wds-list-item-select-label-font-line-height-small);
919
+ @property st-global(--wds-list-item-select-label-font-size-medium);
920
+ @property st-global(--wds-list-item-select-label-font-size-small);
914
921
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
915
922
  @property st-global(--wds-list-item-select-padding-horizontal-small);
916
923
  @property st-global(--wds-list-item-select-padding-left-medium);
@@ -2307,6 +2314,9 @@
2307
2314
  --wds-input-area-padding-vertical-small: 6px;
2308
2315
  --wds-input-background-fill-default: #ffffff;
2309
2316
  --wds-input-background-fill-hover: #f7f8f8;
2317
+ --wds-input-border-color: #e2e3ea;
2318
+ --wds-input-border-color-hover: #868aa5;
2319
+ --wds-input-border-color-readonly: #e2e3ea;
2310
2320
  --wds-input-border-radius-default-large: 4px;
2311
2321
  --wds-input-border-radius-default-medium: 4px;
2312
2322
  --wds-input-border-radius-default-small: 4px;
@@ -2412,15 +2422,19 @@
2412
2422
  --wds-list-item-select-fill-hover: #f7f8f8;
2413
2423
  --wds-list-item-select-icon-padding-horizontal-medium: 12px;
2414
2424
  --wds-list-item-select-icon-padding-vertical-medium: 4px;
2425
+ --wds-list-item-select-label-font-line-height-medium: 20px;
2426
+ --wds-list-item-select-label-font-line-height-small: 16px;
2427
+ --wds-list-item-select-label-font-size-medium: 14px;
2428
+ --wds-list-item-select-label-font-size-small: 12px;
2415
2429
  --wds-list-item-select-padding-horizontal-medium: 8px;
2416
2430
  --wds-list-item-select-padding-horizontal-small: 8px;
2417
2431
  --wds-list-item-select-padding-left-medium: 12px;
2418
2432
  --wds-list-item-select-padding-left-small: 12px;
2419
2433
  --wds-list-item-select-padding-right-medium: 16px;
2420
2434
  --wds-list-item-select-padding-right-small: 16px;
2421
- --wds-list-item-select-padding-vertical-medium: 4px;
2435
+ --wds-list-item-select-padding-vertical-medium: 6px;
2422
2436
  --wds-list-item-select-padding-vertical-medium-screen-small: 8px;
2423
- --wds-list-item-select-padding-vertical-small: 4px;
2437
+ --wds-list-item-select-padding-vertical-small: 6px;
2424
2438
  --wds-list-item-select-padding-vertical-small-screen-small: 8px;
2425
2439
  --wds-list-item-select-subtitle: #868aa5;
2426
2440
  --wds-list-item-select-subtitle-disabled: #bebebe;
package/studio/component.st.css CHANGED
@@ -276,6 +276,9 @@
276
276
  @property st-global(--wds-input-area-padding-vertical-small);
277
277
  @property st-global(--wds-input-background-fill-default);
278
278
  @property st-global(--wds-input-background-fill-hover);
279
+ @property st-global(--wds-input-border-color);
280
+ @property st-global(--wds-input-border-color-hover);
281
+ @property st-global(--wds-input-border-color-readonly);
279
282
  @property st-global(--wds-input-border-radius-default-large);
280
283
  @property st-global(--wds-input-border-radius-default-medium);
281
284
  @property st-global(--wds-input-border-radius-default-small);
@@ -381,6 +384,10 @@
381
384
  @property st-global(--wds-list-item-select-fill-hover);
382
385
  @property st-global(--wds-list-item-select-icon-padding-horizontal-medium);
383
386
  @property st-global(--wds-list-item-select-icon-padding-vertical-medium);
387
+ @property st-global(--wds-list-item-select-label-font-line-height-medium);
388
+ @property st-global(--wds-list-item-select-label-font-line-height-small);
389
+ @property st-global(--wds-list-item-select-label-font-size-medium);
390
+ @property st-global(--wds-list-item-select-label-font-size-small);
384
391
  @property st-global(--wds-list-item-select-padding-horizontal-medium);
385
392
  @property st-global(--wds-list-item-select-padding-horizontal-small);
386
393
  @property st-global(--wds-list-item-select-padding-left-medium);
@@ -1158,6 +1165,9 @@
1158
1165
  --wds-input-area-padding-vertical-small: 6px;
1159
1166
  --wds-input-background-fill-default: #ffffff;
1160
1167
  --wds-input-background-fill-hover: #f7f8f8;
1168
+ --wds-input-border-color: #e2e3ea;
1169
+ --wds-input-border-color-hover: #868aa5;
1170
+ --wds-input-border-color-readonly: #e2e3ea;
1161
1171
  --wds-input-border-radius-default-large: 4px;
1162
1172
  --wds-input-border-radius-default-medium: 4px;
1163
1173
  --wds-input-border-radius-default-small: 4px;
@@ -1263,15 +1273,19 @@
1263
1273
  --wds-list-item-select-fill-hover: #f7f8f8;
1264
1274
  --wds-list-item-select-icon-padding-horizontal-medium: 12px;
1265
1275
  --wds-list-item-select-icon-padding-vertical-medium: 4px;
1276
+ --wds-list-item-select-label-font-line-height-medium: 20px;
1277
+ --wds-list-item-select-label-font-line-height-small: 16px;
1278
+ --wds-list-item-select-label-font-size-medium: 14px;
1279
+ --wds-list-item-select-label-font-size-small: 12px;
1266
1280
  --wds-list-item-select-padding-horizontal-medium: 8px;
1267
1281
  --wds-list-item-select-padding-horizontal-small: 8px;
1268
1282
  --wds-list-item-select-padding-left-medium: 12px;
1269
1283
  --wds-list-item-select-padding-left-small: 12px;
1270
1284
  --wds-list-item-select-padding-right-medium: 16px;
1271
1285
  --wds-list-item-select-padding-right-small: 16px;
1272
- --wds-list-item-select-padding-vertical-medium: 4px;
1286
+ --wds-list-item-select-padding-vertical-medium: 6px;
1273
1287
  --wds-list-item-select-padding-vertical-medium-screen-small: 8px;
1274
- --wds-list-item-select-padding-vertical-small: 4px;
1288
+ --wds-list-item-select-padding-vertical-small: 6px;
1275
1289
  --wds-list-item-select-padding-vertical-small-screen-small: 8px;
1276
1290
  --wds-list-item-select-subtitle: #868aa5;
1277
1291
  --wds-list-item-select-subtitle-disabled: #bebebe;
package/wixel/all.css CHANGED
@@ -209,10 +209,10 @@
209
209
  --wds-custom-modal-header-title-font-line-height: 20px;
210
210
  --wds-custom-modal-header-title-font-size: 14px;
211
211
  --wds-divider-fill-color-light: linear-gradient(90deg, rgba(244, 247, 255, 0.0000) 0%, #d6dcff 16%, #d6dcff 84%, rgba(244, 247, 255, 0.0000) 100%);
212
- --wds-divider-vertical-fill-color-light: linear-gradient(0deg, rgba(244, 247, 255, 0.0000) 0%, #d6dcff 16%, #d6dcff 84%, rgba(244, 247, 255, 0.0000) 100%);
213
212
  --wds-divider-fill-color-light-primary: #d6dcff;
214
213
  --wds-divider-fill-color-light-secondary: rgba(244, 247, 255, 0.0000);
215
214
  --wds-divider-gradient-border: linear-gradient(90deg, rgba(244, 247, 255, 0.0000) 0%, #d6dcff 16%, #d6dcff 84%, rgba(244, 247, 255, 0.0000) 100%);
215
+ --wds-divider-vertical-fill-color-light: linear-gradient(0deg, rgba(244, 247, 255, 0.0000) 0%, #d6dcff 16%, #d6dcff 84%, rgba(244, 247, 255, 0.0000) 100%);
216
216
  --wds-dock-background-fill: #eef0ff;
217
217
  --wds-dock-background-fill-active: #d6dcff;
218
218
  --wds-dock-background-fill-disabled: #e5e5e5;
@@ -266,6 +266,9 @@
266
266
  --wds-info-icon-fill-hover: #526cff;
267
267
  --wds-input-background-fill-default: #eef0ff;
268
268
  --wds-input-background-fill-hover: #d6dcff;
269
+ --wds-input-border-color: #eef0ff;
270
+ --wds-input-border-color-hover: #d6dcff;
271
+ --wds-input-border-color-readonly: #edeef2;
269
272
  --wds-input-border-radius-default-large: 8px;
270
273
  --wds-input-border-radius-default-medium: 8px;
271
274
  --wds-input-border-radius-default-small: 8px;
@@ -805,7 +808,7 @@
805
808
  --wds-toggle-switch-knob-size-small: 12px;
806
809
  --wds-toggle-switch-knob-text-height: 0;
807
810
  --wds-toggle-switch-padding: 1px;
808
- --wds-toggle-switch-shadow: true;
811
+ --wds-toggle-switch-shadow: 0 2px 1px rgba(38, 37, 36, 0.0000), 0 0 3px rgba(38, 37, 36, 0.3000);
809
812
  --wds-toggle-switch-width-large: 40px;
810
813
  --wds-toggle-switch-width-medium: 32px;
811
814
  --wds-toggle-switch-width-small: 24px;
@@ -1453,9 +1456,12 @@
1453
1456
  --wds-shadow-fill-secondary-overlay: rgba(38, 37, 36, 0.0000);
1454
1457
  --wds-shadow-fill-secondary-raised: rgba(38, 37, 36, 0.0000);
1455
1458
  --wds-shadow-fill-secondary-toggle: rgba(38, 37, 36, 0.0000);
1456
- --wds-shadow-focus-destructive: #fbd0cd;
1457
- --wds-shadow-focus-standard: #bac5ff;
1458
- --wds-shadow-focus-warning: #fdead2;
1459
+ --wds-shadow-focus-destructive: 0 0 0 3px #fbd0cd;
1460
+ --wds-shadow-focus-inner-destructive: 0 0 0 3px #fbd0cd inset;
1461
+ --wds-shadow-focus-inner-standard: 0 0 0 3px #bac5ff inset;
1462
+ --wds-shadow-focus-inner-warning: 0 0 0 3px #fdead2 inset;
1463
+ --wds-shadow-focus-standard: 0 0 0 3px #bac5ff;
1464
+ --wds-shadow-focus-warning: 0 0 0 3px #fdead2;
1459
1465
  --wds-shadow-focus-spread: 0;
1460
1466
  --wds-shadow-surface-modal: 0 10px 10px rgba(38, 37, 36, 0.2000), 0 8px 8px rgba(38, 37, 36, 0.0000);
1461
1467
  --wds-shadow-surface-overlay: 0 2px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);
package/wixel/all.st.css CHANGED
@@ -807,6 +807,9 @@
807
807
  @property st-global(--wds-input-area-padding-vertical-small);
808
808
  @property st-global(--wds-input-background-fill-default);
809
809
  @property st-global(--wds-input-background-fill-hover);
810
+ @property st-global(--wds-input-border-color);
811
+ @property st-global(--wds-input-border-color-hover);
812
+ @property st-global(--wds-input-border-color-readonly);
810
813
  @property st-global(--wds-input-border-radius-default-large);
811
814
  @property st-global(--wds-input-border-radius-default-medium);
812
815
  @property st-global(--wds-input-border-radius-default-small);
@@ -1119,6 +1122,9 @@
1119
1122
  @property st-global(--wds-shadow-fill-secondary-raised);
1120
1123
  @property st-global(--wds-shadow-fill-secondary-toggle);
1121
1124
  @property st-global(--wds-shadow-focus-destructive);
1125
+ @property st-global(--wds-shadow-focus-inner-destructive);
1126
+ @property st-global(--wds-shadow-focus-inner-standard);
1127
+ @property st-global(--wds-shadow-focus-inner-warning);
1122
1128
  @property st-global(--wds-shadow-focus-spread);
1123
1129
  @property st-global(--wds-shadow-focus-standard);
1124
1130
  @property st-global(--wds-shadow-focus-warning);
@@ -2320,6 +2326,9 @@
2320
2326
  --wds-input-area-padding-vertical-small: 8px;
2321
2327
  --wds-input-background-fill-default: #eef0ff;
2322
2328
  --wds-input-background-fill-hover: #d6dcff;
2329
+ --wds-input-border-color: #eef0ff;
2330
+ --wds-input-border-color-hover: #d6dcff;
2331
+ --wds-input-border-color-readonly: #edeef2;
2323
2332
  --wds-input-border-radius-default-large: 8px;
2324
2333
  --wds-input-border-radius-default-medium: 8px;
2325
2334
  --wds-input-border-radius-default-small: 8px;
@@ -2631,10 +2640,13 @@
2631
2640
  --wds-shadow-fill-secondary-overlay: rgba(38, 37, 36, 0.0000);
2632
2641
  --wds-shadow-fill-secondary-raised: rgba(38, 37, 36, 0.0000);
2633
2642
  --wds-shadow-fill-secondary-toggle: rgba(38, 37, 36, 0.0000);
2634
- --wds-shadow-focus-destructive: #fbd0cd;
2643
+ --wds-shadow-focus-destructive: 0 0 0 3px #fbd0cd;
2644
+ --wds-shadow-focus-inner-destructive: 0 0 0 3px #fbd0cd inset;
2645
+ --wds-shadow-focus-inner-standard: 0 0 0 3px #bac5ff inset;
2646
+ --wds-shadow-focus-inner-warning: 0 0 0 3px #fdead2 inset;
2635
2647
  --wds-shadow-focus-spread: 0;
2636
- --wds-shadow-focus-standard: #bac5ff;
2637
- --wds-shadow-focus-warning: #fdead2;
2648
+ --wds-shadow-focus-standard: 0 0 0 3px #bac5ff;
2649
+ --wds-shadow-focus-warning: 0 0 0 3px #fdead2;
2638
2650
  --wds-shadow-inner-100: 1px 1px 2px rgba(38, 37, 36, 0.1000) inset, 1px 1px 2px rgba(255, 255, 255, 0.1000);
2639
2651
  --wds-shadow-inner-200: 1px 1px 4px rgba(38, 37, 36, 0.2000) inset;
2640
2652
  --wds-shadow-inner-300: 0 0 18px rgba(38, 37, 36, 0.1000) inset, 0 0 6px rgba(38, 37, 36, 0.0500) inset;
@@ -2935,7 +2947,7 @@
2935
2947
  --wds-toggle-switch-knob-size-small: 12px;
2936
2948
  --wds-toggle-switch-knob-text-height: 0;
2937
2949
  --wds-toggle-switch-padding: 1px;
2938
- --wds-toggle-switch-shadow: true;
2950
+ --wds-toggle-switch-shadow: 0 2px 1px rgba(38, 37, 36, 0.0000), 0 0 3px rgba(38, 37, 36, 0.3000);
2939
2951
  --wds-toggle-switch-width-large: 40px;
2940
2952
  --wds-toggle-switch-width-medium: 32px;
2941
2953
  --wds-toggle-switch-width-small: 24px;
package/wixel/component.st.css CHANGED
@@ -273,6 +273,9 @@
273
273
  @property st-global(--wds-input-area-padding-vertical-small);
274
274
  @property st-global(--wds-input-background-fill-default);
275
275
  @property st-global(--wds-input-background-fill-hover);
276
+ @property st-global(--wds-input-border-color);
277
+ @property st-global(--wds-input-border-color-hover);
278
+ @property st-global(--wds-input-border-color-readonly);
276
279
  @property st-global(--wds-input-border-radius-default-large);
277
280
  @property st-global(--wds-input-border-radius-default-medium);
278
281
  @property st-global(--wds-input-border-radius-default-small);
@@ -1166,6 +1169,9 @@
1166
1169
  --wds-input-area-padding-vertical-small: 8px;
1167
1170
  --wds-input-background-fill-default: #eef0ff;
1168
1171
  --wds-input-background-fill-hover: #d6dcff;
1172
+ --wds-input-border-color: #eef0ff;
1173
+ --wds-input-border-color-hover: #d6dcff;
1174
+ --wds-input-border-color-readonly: #edeef2;
1169
1175
  --wds-input-border-radius-default-large: 8px;
1170
1176
  --wds-input-border-radius-default-medium: 8px;
1171
1177
  --wds-input-border-radius-default-small: 8px;
@@ -1697,7 +1703,7 @@
1697
1703
  --wds-toggle-switch-knob-size-small: 12px;
1698
1704
  --wds-toggle-switch-knob-text-height: 0;
1699
1705
  --wds-toggle-switch-padding: 1px;
1700
- --wds-toggle-switch-shadow: true;
1706
+ --wds-toggle-switch-shadow: 0 2px 1px rgba(38, 37, 36, 0.0000), 0 0 3px rgba(38, 37, 36, 0.3000);
1701
1707
  --wds-toggle-switch-width-large: 40px;
1702
1708
  --wds-toggle-switch-width-medium: 32px;
1703
1709
  --wds-toggle-switch-width-small: 24px;
package/wixel/semantic.st.css CHANGED
@@ -398,6 +398,9 @@
398
398
  @property st-global(--wds-shadow-fill-secondary-raised);
399
399
  @property st-global(--wds-shadow-fill-secondary-toggle);
400
400
  @property st-global(--wds-shadow-focus-destructive);
401
+ @property st-global(--wds-shadow-focus-inner-destructive);
402
+ @property st-global(--wds-shadow-focus-inner-standard);
403
+ @property st-global(--wds-shadow-focus-inner-warning);
401
404
  @property st-global(--wds-shadow-focus-spread);
402
405
  @property st-global(--wds-shadow-focus-standard);
403
406
  @property st-global(--wds-shadow-focus-warning);
@@ -820,10 +823,13 @@
820
823
  --wds-shadow-fill-secondary-overlay: rgba(38, 37, 36, 0.0000);
821
824
  --wds-shadow-fill-secondary-raised: rgba(38, 37, 36, 0.0000);
822
825
  --wds-shadow-fill-secondary-toggle: rgba(38, 37, 36, 0.0000);
823
- --wds-shadow-focus-destructive: #fbd0cd;
826
+ --wds-shadow-focus-destructive: 0 0 0 3px #fbd0cd;
827
+ --wds-shadow-focus-inner-destructive: 0 0 0 3px #fbd0cd inset;
828
+ --wds-shadow-focus-inner-standard: 0 0 0 3px #bac5ff inset;
829
+ --wds-shadow-focus-inner-warning: 0 0 0 3px #fdead2 inset;
824
830
  --wds-shadow-focus-spread: 0;
825
- --wds-shadow-focus-standard: #bac5ff;
826
- --wds-shadow-focus-warning: #fdead2;
831
+ --wds-shadow-focus-standard: 0 0 0 3px #bac5ff;
832
+ --wds-shadow-focus-warning: 0 0 0 3px #fdead2;
827
833
  --wds-shadow-surface-modal: 0 10px 10px rgba(38, 37, 36, 0.2000), 0 8px 8px rgba(38, 37, 36, 0.0000);
828
834
  --wds-shadow-surface-overlay: 0 2px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);
829
835
  --wds-shadow-surface-overlay-dark: 0 10px 18px rgba(38, 37, 36, 0.1000), 0 6px 6px rgba(38, 37, 36, 0.0000);