@wix/design-system-tokens 1.232.5 → 1.233.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 (25) hide show
  1. package/CHANGELOG.md +20 -0
  2. package/all.css +54 -0
  3. package/all.scss +54 -0
  4. package/all.st.css +108 -0
  5. package/component.st.css +108 -0
  6. package/odeditor/all.css +78 -24
  7. package/odeditor/all.scss +78 -24
  8. package/odeditor/all.st.css +130 -22
  9. package/odeditor/component.st.css +113 -5
  10. package/odeditor/semantic.st.css +17 -17
  11. package/odeditor-dark/all.css +150 -94
  12. package/odeditor-dark/all.scss +150 -94
  13. package/odeditor-dark/all.st.css +203 -91
  14. package/odeditor-dark/component.st.css +186 -74
  15. package/odeditor-dark/semantic.st.css +17 -17
  16. package/package.json +2 -2
  17. package/studio/all.css +56 -0
  18. package/studio/all.scss +56 -0
  19. package/studio/all.st.css +112 -0
  20. package/studio/component.st.css +112 -0
  21. package/studio2-light/all.css +150 -94
  22. package/studio2-light/all.scss +150 -94
  23. package/studio2-light/all.st.css +203 -91
  24. package/studio2-light/component.st.css +186 -74
  25. package/studio2-light/semantic.st.css +17 -17
package/studio2-light/component.st.css CHANGED
@@ -184,7 +184,13 @@
184
184
  @property st-global(--wds-breadcrumbs-text-line-height-small);
185
185
  @property st-global(--wds-breadcrumbs-text-weight-default);
186
186
  @property st-global(--wds-breadcrumbs-text-weight-selected);
187
+ @property st-global(--wds-button-border-ai-secondary);
188
+ @property st-global(--wds-button-border-ai-secondary-active);
189
+ @property st-global(--wds-button-border-ai-secondary-disabled);
190
+ @property st-global(--wds-button-border-ai-secondary-hover);
187
191
  @property st-global(--wds-button-border-ai-secondary-mask);
192
+ @property st-global(--wds-button-border-ai-secondary-ring-display);
193
+ @property st-global(--wds-button-border-ai-tertiary-disabled);
188
194
  @property st-global(--wds-button-border-dark-secondary);
189
195
  @property st-global(--wds-button-border-dark-secondary-active);
190
196
  @property st-global(--wds-button-border-dark-secondary-disabled);
@@ -208,8 +214,16 @@
208
214
  @property st-global(--wds-button-border-width-secondary-hover);
209
215
  @property st-global(--wds-button-fill-ai-primary);
210
216
  @property st-global(--wds-button-fill-ai-primary-active);
217
+ @property st-global(--wds-button-fill-ai-primary-disabled);
211
218
  @property st-global(--wds-button-fill-ai-primary-hover);
212
219
  @property st-global(--wds-button-fill-ai-secondary);
220
+ @property st-global(--wds-button-fill-ai-secondary-active);
221
+ @property st-global(--wds-button-fill-ai-secondary-disabled);
222
+ @property st-global(--wds-button-fill-ai-secondary-hover);
223
+ @property st-global(--wds-button-fill-ai-tertiary);
224
+ @property st-global(--wds-button-fill-ai-tertiary-active);
225
+ @property st-global(--wds-button-fill-ai-tertiary-disabled);
226
+ @property st-global(--wds-button-fill-ai-tertiary-hover);
213
227
  @property st-global(--wds-button-fill-dark-primary-disabled);
214
228
  @property st-global(--wds-button-fill-dark-secondary);
215
229
  @property st-global(--wds-button-fill-dark-secondary-active);
@@ -261,6 +275,15 @@
261
275
  @property st-global(--wds-button-icon-offset-small);
262
276
  @property st-global(--wds-button-icon-offset-tiny);
263
277
  @property st-global(--wds-button-label-fill-ai-primary);
278
+ @property st-global(--wds-button-label-fill-ai-primary-disabled);
279
+ @property st-global(--wds-button-label-fill-ai-secondary);
280
+ @property st-global(--wds-button-label-fill-ai-secondary-active);
281
+ @property st-global(--wds-button-label-fill-ai-secondary-disabled);
282
+ @property st-global(--wds-button-label-fill-ai-secondary-hover);
283
+ @property st-global(--wds-button-label-fill-ai-tertiary);
284
+ @property st-global(--wds-button-label-fill-ai-tertiary-active);
285
+ @property st-global(--wds-button-label-fill-ai-tertiary-disabled);
286
+ @property st-global(--wds-button-label-fill-ai-tertiary-hover);
264
287
  @property st-global(--wds-button-label-fill-dark-primary-disabled);
265
288
  @property st-global(--wds-button-label-fill-dark-secondary);
266
289
  @property st-global(--wds-button-label-fill-dark-secondary-active);
@@ -337,6 +360,8 @@
337
360
  @property st-global(--wds-card-gallery-item-action-button-padding-vertical);
338
361
  @property st-global(--wds-card-gallery-item-action-button-size);
339
362
  @property st-global(--wds-card-gallery-item-actions-align);
363
+ @property st-global(--wds-card-gallery-item-actions-clearance-bottom);
364
+ @property st-global(--wds-card-gallery-item-actions-clearance-top);
340
365
  @property st-global(--wds-card-gallery-item-actions-direction);
341
366
  @property st-global(--wds-card-gallery-item-actions-secondary-position);
342
367
  @property st-global(--wds-card-gallery-item-badge-offset-block);
@@ -644,6 +669,15 @@
644
669
  @property st-global(--wds-horizontal-scroll-button-fill);
645
670
  @property st-global(--wds-horizontal-scroll-button-fill-active);
646
671
  @property st-global(--wds-horizontal-scroll-button-text);
672
+ @property st-global(--wds-icon-button-border-ai-secondary-ring-display);
673
+ @property st-global(--wds-icon-button-border-ai-width);
674
+ @property st-global(--wds-icon-button-color-border-ai-primary);
675
+ @property st-global(--wds-icon-button-color-border-ai-primary-active);
676
+ @property st-global(--wds-icon-button-color-border-ai-primary-hover);
677
+ @property st-global(--wds-icon-button-color-border-ai-secondary);
678
+ @property st-global(--wds-icon-button-color-border-ai-secondary-active);
679
+ @property st-global(--wds-icon-button-color-border-ai-secondary-disabled);
680
+ @property st-global(--wds-icon-button-color-border-ai-secondary-hover);
647
681
  @property st-global(--wds-icon-button-color-border-dark-secondary);
648
682
  @property st-global(--wds-icon-button-color-border-dark-secondary-active);
649
683
  @property st-global(--wds-icon-button-color-border-dark-secondary-disabled);
@@ -659,6 +693,18 @@
659
693
  @property st-global(--wds-icon-button-color-border-standard-secondary-active);
660
694
  @property st-global(--wds-icon-button-color-border-standard-secondary-disabled);
661
695
  @property st-global(--wds-icon-button-color-border-standard-secondary-hover);
696
+ @property st-global(--wds-icon-button-color-fill-ai-primary);
697
+ @property st-global(--wds-icon-button-color-fill-ai-primary-active);
698
+ @property st-global(--wds-icon-button-color-fill-ai-primary-disabled);
699
+ @property st-global(--wds-icon-button-color-fill-ai-primary-hover);
700
+ @property st-global(--wds-icon-button-color-fill-ai-secondary);
701
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-active);
702
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-disabled);
703
+ @property st-global(--wds-icon-button-color-fill-ai-secondary-hover);
704
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary);
705
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-active);
706
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-disabled);
707
+ @property st-global(--wds-icon-button-color-fill-ai-tertiary-hover);
662
708
  @property st-global(--wds-icon-button-color-fill-dark-primary);
663
709
  @property st-global(--wds-icon-button-color-fill-dark-primary-active);
664
710
  @property st-global(--wds-icon-button-color-fill-dark-primary-disabled);
@@ -707,6 +753,16 @@
707
753
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-active);
708
754
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-disabled);
709
755
  @property st-global(--wds-icon-button-color-fill-standard-tertiary-hover);
756
+ @property st-global(--wds-icon-button-color-text-ai-primary);
757
+ @property st-global(--wds-icon-button-color-text-ai-primary-disabled);
758
+ @property st-global(--wds-icon-button-color-text-ai-secondary);
759
+ @property st-global(--wds-icon-button-color-text-ai-secondary-active);
760
+ @property st-global(--wds-icon-button-color-text-ai-secondary-disabled);
761
+ @property st-global(--wds-icon-button-color-text-ai-secondary-hover);
762
+ @property st-global(--wds-icon-button-color-text-ai-tertiary);
763
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-active);
764
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-disabled);
765
+ @property st-global(--wds-icon-button-color-text-ai-tertiary-hover);
710
766
  @property st-global(--wds-icon-button-color-text-dark-primary);
711
767
  @property st-global(--wds-icon-button-color-text-dark-primary-active);
712
768
  @property st-global(--wds-icon-button-color-text-dark-primary-disabled);
@@ -2143,7 +2199,13 @@
2143
2199
  --wds-breadcrumbs-text-line-height-small: 16px;
2144
2200
  --wds-breadcrumbs-text-weight-default: 400;
2145
2201
  --wds-breadcrumbs-text-weight-selected: 600;
2202
+ --wds-button-border-ai-secondary: #7896ff;
2203
+ --wds-button-border-ai-secondary-active: #d5dfff;
2204
+ --wds-button-border-ai-secondary-disabled: #f0efef;
2205
+ --wds-button-border-ai-secondary-hover: #acbeff;
2146
2206
  --wds-button-border-ai-secondary-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
2207
+ --wds-button-border-ai-secondary-ring-display: none;
2208
+ --wds-button-border-ai-tertiary-disabled: #f0efef;
2147
2209
  --wds-button-border-dark-secondary: #767574;
2148
2210
  --wds-button-border-dark-secondary-active: #dedede;
2149
2211
  --wds-button-border-dark-secondary-disabled: #f0efef;
@@ -2165,10 +2227,18 @@
2165
2227
  --wds-button-border-standard-secondary-disabled: #f0efef;
2166
2228
  --wds-button-border-standard-secondary-hover: #acbeff;
2167
2229
  --wds-button-border-width-secondary-hover: 1px;
2168
- --wds-button-fill-ai-primary: #5a48f5;
2169
- --wds-button-fill-ai-primary-active: #5a48f5;
2170
- --wds-button-fill-ai-primary-hover: #4d3dd0;
2171
- --wds-button-fill-ai-secondary: #ffffff;
2230
+ --wds-button-fill-ai-primary: #2f5dff;
2231
+ --wds-button-fill-ai-primary-active: #0f2ccf;
2232
+ --wds-button-fill-ai-primary-disabled: #f0efef;
2233
+ --wds-button-fill-ai-primary-hover: #1c3fe5;
2234
+ --wds-button-fill-ai-secondary: rgba(255, 255, 255, 0);
2235
+ --wds-button-fill-ai-secondary-active: #d5dfff;
2236
+ --wds-button-fill-ai-secondary-disabled: #f0efef;
2237
+ --wds-button-fill-ai-secondary-hover: #eaefff;
2238
+ --wds-button-fill-ai-tertiary: rgba(255, 255, 255, 0);
2239
+ --wds-button-fill-ai-tertiary-active: #d5dfff;
2240
+ --wds-button-fill-ai-tertiary-disabled: #f0efef;
2241
+ --wds-button-fill-ai-tertiary-hover: #eaefff;
2172
2242
  --wds-button-fill-dark-primary-disabled: #f0efef;
2173
2243
  --wds-button-fill-dark-secondary: rgba(255, 255, 255, 0);
2174
2244
  --wds-button-fill-dark-secondary-active: #dedede;
@@ -2220,6 +2290,15 @@
2220
2290
  --wds-button-icon-offset-small: 12px;
2221
2291
  --wds-button-icon-offset-tiny: 12px;
2222
2292
  --wds-button-label-fill-ai-primary: #ffffff;
2293
+ --wds-button-label-fill-ai-primary-disabled: #a8a6a5;
2294
+ --wds-button-label-fill-ai-secondary: #1c3fe5;
2295
+ --wds-button-label-fill-ai-secondary-active: #0f2ccf;
2296
+ --wds-button-label-fill-ai-secondary-disabled: #a8a6a5;
2297
+ --wds-button-label-fill-ai-secondary-hover: #0f2ccf;
2298
+ --wds-button-label-fill-ai-tertiary: #1c3fe5;
2299
+ --wds-button-label-fill-ai-tertiary-active: #0f2ccf;
2300
+ --wds-button-label-fill-ai-tertiary-disabled: #a8a6a5;
2301
+ --wds-button-label-fill-ai-tertiary-hover: #0f2ccf;
2223
2302
  --wds-button-label-fill-dark-primary-disabled: #a8a6a5;
2224
2303
  --wds-button-label-fill-dark-secondary: #151414;
2225
2304
  --wds-button-label-fill-dark-secondary-active: #151414;
@@ -2265,12 +2344,12 @@
2265
2344
  --wds-calendar-day-fill-selected: #151414;
2266
2345
  --wds-calendar-day-fill-selected-hover: #383838;
2267
2346
  --wds-calendar-day-fill-today: #dedede;
2268
- --wds-calendar-day-gap: 0px;
2269
- --wds-calendar-day-range-border-radius: 0px;
2270
- --wds-calendar-day-range-edge-border-radius: 50%;
2271
- --wds-calendar-day-today-inset-width: 3px;
2272
- --wds-calendar-padding-medium: 24px;
2273
- --wds-calendar-padding-small: 18px;
2347
+ --wds-calendar-day-gap: 2px;
2348
+ --wds-calendar-day-range-border-radius: 8px;
2349
+ --wds-calendar-day-range-edge-border-radius: 8px;
2350
+ --wds-calendar-day-today-inset-width: 0px;
2351
+ --wds-calendar-padding-medium: 18px;
2352
+ --wds-calendar-padding-small: 12px;
2274
2353
  --wds-calendar-panel-footer-border-fill: rgba(19, 23, 32, 0);
2275
2354
  --wds-calendar-panel-footer-border-width: 1px;
2276
2355
  --wds-calendar-panel-presets-border-fill: rgba(19, 23, 32, 0);
@@ -2288,67 +2367,69 @@
2288
2367
  --wds-card-controls-padding-horizontal: 24px;
2289
2368
  --wds-card-controls-padding-vertical: 16px;
2290
2369
  --wds-card-divider-opacity: 0;
2291
- --wds-card-gallery-item-action-button-border-radius: 8px;
2292
- --wds-card-gallery-item-action-button-font-size: 14px;
2293
- --wds-card-gallery-item-action-button-line-height: 24px;
2294
- --wds-card-gallery-item-action-button-min-width: 84px;
2295
- --wds-card-gallery-item-action-button-padding-horizontal: 20px;
2370
+ --wds-card-gallery-item-action-button-border-radius: 6px;
2371
+ --wds-card-gallery-item-action-button-font-size: 12px;
2372
+ --wds-card-gallery-item-action-button-line-height: 16px;
2373
+ --wds-card-gallery-item-action-button-min-width: 72px;
2374
+ --wds-card-gallery-item-action-button-padding-horizontal: 16px;
2296
2375
  --wds-card-gallery-item-action-button-padding-vertical: 6px;
2297
- --wds-card-gallery-item-action-button-size: 38px;
2298
- --wds-card-gallery-item-actions-align: stretch;
2299
- --wds-card-gallery-item-actions-direction: row;
2300
- --wds-card-gallery-item-actions-secondary-position: absolute;
2376
+ --wds-card-gallery-item-action-button-size: 30px;
2377
+ --wds-card-gallery-item-actions-align: center;
2378
+ --wds-card-gallery-item-actions-clearance-bottom: 0px;
2379
+ --wds-card-gallery-item-actions-clearance-top: 36px;
2380
+ --wds-card-gallery-item-actions-direction: column;
2381
+ --wds-card-gallery-item-actions-secondary-position: static;
2301
2382
  --wds-card-gallery-item-badge-offset-block: 12px;
2302
- --wds-card-gallery-item-badge-offset-inline: -6px;
2303
- --wds-card-gallery-item-base-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2383
+ --wds-card-gallery-item-badge-offset-inline: 12px;
2384
+ --wds-card-gallery-item-base-shadow: none;
2304
2385
  --wds-card-gallery-item-buttons-gap: 8px;
2305
2386
  --wds-card-gallery-item-content-margin-horizontal: 8px;
2306
2387
  --wds-card-gallery-item-content-margin-vertical: 0px;
2307
- --wds-card-gallery-item-drag-handle-gap: 12px;
2388
+ --wds-card-gallery-item-drag-handle-gap: 8px;
2308
2389
  --wds-card-gallery-item-fill: #ffffff;
2309
- --wds-card-gallery-item-image-border-radius-bottom: 12px;
2310
- --wds-card-gallery-item-image-inset: 0px;
2311
- --wds-card-gallery-item-image-side-size-medium: 40px;
2312
- --wds-card-gallery-item-image-side-size-small: 30px;
2390
+ --wds-card-gallery-item-image-border-radius-bottom: 8px;
2391
+ --wds-card-gallery-item-image-inset: 8px;
2392
+ --wds-card-gallery-item-image-side-size-medium: 48px;
2393
+ --wds-card-gallery-item-image-side-size-small: 32px;
2313
2394
  --wds-card-gallery-item-outline-border-color: #dedede;
2314
2395
  --wds-card-gallery-item-outline-border-color-hover: #a8a6a5;
2315
- --wds-card-gallery-item-overlay-backdrop-filter: none;
2396
+ --wds-card-gallery-item-overlay-backdrop-filter: blur(28px);
2316
2397
  --wds-card-gallery-item-overlay-fill: rgba(82, 81, 80, .5);
2317
2398
  --wds-card-gallery-item-overlay-hover-fill: rgba(54, 64, 97, 0.52);
2318
- --wds-card-gallery-item-padding-left-medium: 18px;
2399
+ --wds-card-gallery-item-padding-left-medium: 16px;
2319
2400
  --wds-card-gallery-item-padding-left-small: 12px;
2320
- --wds-card-gallery-item-padding-right-medium: 24px;
2321
- --wds-card-gallery-item-padding-right-small: 18px;
2322
- --wds-card-gallery-item-padding-vertical-medium: 18px;
2401
+ --wds-card-gallery-item-padding-right-medium: 16px;
2402
+ --wds-card-gallery-item-padding-right-small: 12px;
2403
+ --wds-card-gallery-item-padding-vertical-medium: 16px;
2323
2404
  --wds-card-gallery-item-padding-vertical-small: 12px;
2324
- --wds-card-gallery-item-secondary-action-border-radius: 2px;
2405
+ --wds-card-gallery-item-secondary-action-border-radius: 6px;
2325
2406
  --wds-card-gallery-item-secondary-action-color-active: #2f5dff;
2326
2407
  --wds-card-gallery-item-secondary-action-color-hover: #2f5dff;
2327
2408
  --wds-card-gallery-item-secondary-action-fill-active: #d5dfff;
2328
2409
  --wds-card-gallery-item-secondary-action-fill-hover: #eaefff;
2329
- --wds-card-gallery-item-secondary-action-font-size: 16px;
2330
- --wds-card-gallery-item-secondary-action-height: 24px;
2331
- --wds-card-gallery-item-secondary-action-line-height: 24px;
2332
- --wds-card-gallery-item-secondary-action-min-width: auto;
2333
- --wds-card-gallery-item-secondary-action-padding-horizontal: 0px;
2334
- --wds-card-gallery-item-secondary-action-padding-vertical: 0px;
2410
+ --wds-card-gallery-item-secondary-action-font-size: 12px;
2411
+ --wds-card-gallery-item-secondary-action-height: 30px;
2412
+ --wds-card-gallery-item-secondary-action-line-height: 16px;
2413
+ --wds-card-gallery-item-secondary-action-min-width: 72px;
2414
+ --wds-card-gallery-item-secondary-action-padding-horizontal: 16px;
2415
+ --wds-card-gallery-item-secondary-action-padding-vertical: 6px;
2335
2416
  --wds-card-gallery-item-settings-menu-offset: 8px;
2336
- --wds-card-gallery-item-shadow: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2337
- --wds-card-gallery-item-shadow-hover: 0 8px 30px 0 rgba(19, 23, 32, 0.1), 0 0 0 0 rgba(19, 23, 32, 0);
2338
- --wds-card-gallery-item-shadow-hover-side: 0 6px 6px 0 rgba(22, 45, 61, 0.06), 0 0 18px 0 rgba(22, 45, 61, 0.12);
2417
+ --wds-card-gallery-item-shadow: 0 1px 10px 0 rgba(19, 23, 32, 0.05), 1px 0 2px -0.7px rgba(19, 23, 32, 0.05);
2418
+ --wds-card-gallery-item-shadow-hover: 0 0 30px 0 rgba(19, 23, 32, 0.1), 0 20px 0 0 rgba(19, 23, 32, 0);
2419
+ --wds-card-gallery-item-shadow-hover-side: 0 0 30px 0 rgba(19, 23, 32, 0.1), 0 20px 0 0 rgba(19, 23, 32, 0);
2339
2420
  --wds-card-gallery-item-subtitle-font-size-medium: 12px;
2340
- --wds-card-gallery-item-subtitle-line-height-medium: 18px;
2421
+ --wds-card-gallery-item-subtitle-line-height-medium: 16px;
2341
2422
  --wds-card-gallery-item-subtitle-side-font-size-medium: 14px;
2342
- --wds-card-gallery-item-title-font-family: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
2343
- --wds-card-gallery-item-title-font-heading-letter-spacing-medium: 0px;
2344
- --wds-card-gallery-item-title-font-heading-weight-medium: 600;
2345
- --wds-card-gallery-item-title-font-letter-spacing: 0px;
2423
+ --wds-card-gallery-item-title-font-family: "Madefor Display", Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
2424
+ --wds-card-gallery-item-title-font-heading-letter-spacing-medium: -0.5px;
2425
+ --wds-card-gallery-item-title-font-heading-weight-medium: 700;
2426
+ --wds-card-gallery-item-title-font-letter-spacing: -0.5px;
2346
2427
  --wds-card-gallery-item-title-font-line-height-medium: 24px;
2347
- --wds-card-gallery-item-title-font-line-height-small: 16px;
2428
+ --wds-card-gallery-item-title-font-line-height-small: 18px;
2348
2429
  --wds-card-gallery-item-title-font-size-medium: 16px;
2349
- --wds-card-gallery-item-title-font-weight-medium: 600;
2350
- --wds-card-gallery-item-title-font-weight-small: 500;
2351
- --wds-card-gallery-item-title-gap: 0px;
2430
+ --wds-card-gallery-item-title-font-weight-medium: 700;
2431
+ --wds-card-gallery-item-title-font-weight-small: 700;
2432
+ --wds-card-gallery-item-title-gap: 2px;
2352
2433
  --wds-card-header-divider-width: 0px;
2353
2434
  --wds-card-header-padding-bottom: 4px;
2354
2435
  --wds-card-header-padding-horizontal: 24px;
@@ -2603,6 +2684,15 @@
2603
2684
  --wds-horizontal-scroll-button-fill: #FFFFFF;
2604
2685
  --wds-horizontal-scroll-button-fill-active: #F8F6F6;
2605
2686
  --wds-horizontal-scroll-button-text: #000624;
2687
+ --wds-icon-button-border-ai-secondary-ring-display: none;
2688
+ --wds-icon-button-border-ai-width: 1px;
2689
+ --wds-icon-button-color-border-ai-primary: #2f5dff;
2690
+ --wds-icon-button-color-border-ai-primary-active: #0f2ccf;
2691
+ --wds-icon-button-color-border-ai-primary-hover: #1c3fe5;
2692
+ --wds-icon-button-color-border-ai-secondary: #7896ff;
2693
+ --wds-icon-button-color-border-ai-secondary-active: #d5dfff;
2694
+ --wds-icon-button-color-border-ai-secondary-disabled: #f0efef;
2695
+ --wds-icon-button-color-border-ai-secondary-hover: #acbeff;
2606
2696
  --wds-icon-button-color-border-dark-secondary: #767574;
2607
2697
  --wds-icon-button-color-border-dark-secondary-active: #dedede;
2608
2698
  --wds-icon-button-color-border-dark-secondary-disabled: #f0efef;
@@ -2618,6 +2708,18 @@
2618
2708
  --wds-icon-button-color-border-standard-secondary-active: #d5dfff;
2619
2709
  --wds-icon-button-color-border-standard-secondary-disabled: #f0efef;
2620
2710
  --wds-icon-button-color-border-standard-secondary-hover: #acbeff;
2711
+ --wds-icon-button-color-fill-ai-primary: #2f5dff;
2712
+ --wds-icon-button-color-fill-ai-primary-active: #0f2ccf;
2713
+ --wds-icon-button-color-fill-ai-primary-disabled: #f0efef;
2714
+ --wds-icon-button-color-fill-ai-primary-hover: #1c3fe5;
2715
+ --wds-icon-button-color-fill-ai-secondary: #ffffff;
2716
+ --wds-icon-button-color-fill-ai-secondary-active: #d5dfff;
2717
+ --wds-icon-button-color-fill-ai-secondary-disabled: #f0efef;
2718
+ --wds-icon-button-color-fill-ai-secondary-hover: #eaefff;
2719
+ --wds-icon-button-color-fill-ai-tertiary: rgba(255, 255, 255, 0);
2720
+ --wds-icon-button-color-fill-ai-tertiary-active: #d5dfff;
2721
+ --wds-icon-button-color-fill-ai-tertiary-disabled: rgba(255, 255, 255, 0);
2722
+ --wds-icon-button-color-fill-ai-tertiary-hover: #eaefff;
2621
2723
  --wds-icon-button-color-fill-dark-primary: #151414;
2622
2724
  --wds-icon-button-color-fill-dark-primary-active: #525150;
2623
2725
  --wds-icon-button-color-fill-dark-primary-disabled: #f0efef;
@@ -2666,6 +2768,16 @@
2666
2768
  --wds-icon-button-color-fill-standard-tertiary-active: #d5dfff;
2667
2769
  --wds-icon-button-color-fill-standard-tertiary-disabled: rgba(255, 255, 255, 0);
2668
2770
  --wds-icon-button-color-fill-standard-tertiary-hover: #eaefff;
2771
+ --wds-icon-button-color-text-ai-primary: #ffffff;
2772
+ --wds-icon-button-color-text-ai-primary-disabled: #a8a6a5;
2773
+ --wds-icon-button-color-text-ai-secondary: #2f5dff;
2774
+ --wds-icon-button-color-text-ai-secondary-active: #0f2ccf;
2775
+ --wds-icon-button-color-text-ai-secondary-disabled: #a8a6a5;
2776
+ --wds-icon-button-color-text-ai-secondary-hover: #0f2ccf;
2777
+ --wds-icon-button-color-text-ai-tertiary: #2f5dff;
2778
+ --wds-icon-button-color-text-ai-tertiary-active: #0f2ccf;
2779
+ --wds-icon-button-color-text-ai-tertiary-disabled: #a8a6a5;
2780
+ --wds-icon-button-color-text-ai-tertiary-hover: #0f2ccf;
2669
2781
  --wds-icon-button-color-text-dark-primary: #ffffff;
2670
2782
  --wds-icon-button-color-text-dark-primary-active: #ffffff;
2671
2783
  --wds-icon-button-color-text-dark-primary-disabled: #a8a6a5;
@@ -2904,10 +3016,10 @@
2904
3016
  --wds-loader-stroke-width-medium: 2px;
2905
3017
  --wds-loader-stroke-width-small: 2px;
2906
3018
  --wds-loader-stroke-width-tiny: 2px;
2907
- --wds-marketing-layout-actions-alignment-inverted: auto;
3019
+ --wds-marketing-layout-actions-alignment-inverted: flex-end;
2908
3020
  --wds-marketing-layout-actions-gap-medium: 24px;
2909
3021
  --wds-marketing-layout-actions-gap-small: 24px;
2910
- --wds-marketing-layout-actions-gap-tiny: 24px;
3022
+ --wds-marketing-layout-actions-gap-tiny: 12px;
2911
3023
  --wds-marketing-layout-badge-gap: 8px;
2912
3024
  --wds-marketing-layout-badge-offset-medium: 0px;
2913
3025
  --wds-marketing-layout-badge-offset-small: 0px;
@@ -2916,7 +3028,7 @@
2916
3028
  --wds-marketing-layout-badge-side: auto;
2917
3029
  --wds-marketing-layout-badge-top: auto;
2918
3030
  --wds-marketing-layout-border: 4px;
2919
- --wds-marketing-layout-content-justify: center;
3031
+ --wds-marketing-layout-content-justify: flex-start;
2920
3032
  --wds-marketing-layout-description-color: #525150;
2921
3033
  --wds-marketing-layout-description-font-size-medium: 12px;
2922
3034
  --wds-marketing-layout-description-font-size-small: 12px;
@@ -2927,15 +3039,15 @@
2927
3039
  --wds-marketing-layout-description-line-height-medium: 16px;
2928
3040
  --wds-marketing-layout-description-line-height-small: 16px;
2929
3041
  --wds-marketing-layout-description-line-height-tiny: 16px;
2930
- --wds-marketing-layout-description-max-width: none;
2931
- --wds-marketing-layout-image-aspect-ratio: auto;
3042
+ --wds-marketing-layout-description-max-width: 80%;
3043
+ --wds-marketing-layout-image-aspect-ratio: 1;
2932
3044
  --wds-marketing-layout-image-border-radius: 8px;
2933
- --wds-marketing-layout-image-height: auto;
2934
- --wds-marketing-layout-image-hug-padding: 0px;
2935
- --wds-marketing-layout-image-max-width-medium: none;
2936
- --wds-marketing-layout-image-max-width-small: none;
2937
- --wds-marketing-layout-image-max-width-tiny: none;
2938
- --wds-marketing-layout-image-object-fit: fill;
3045
+ --wds-marketing-layout-image-height: 100%;
3046
+ --wds-marketing-layout-image-hug-padding: 12px;
3047
+ --wds-marketing-layout-image-max-width-medium: 156px;
3048
+ --wds-marketing-layout-image-max-width-small: 136px;
3049
+ --wds-marketing-layout-image-max-width-tiny: 116px;
3050
+ --wds-marketing-layout-image-object-fit: cover;
2939
3051
  --wds-marketing-layout-image-padding-left-medium: 12px;
2940
3052
  --wds-marketing-layout-image-padding-left-small: 12px;
2941
3053
  --wds-marketing-layout-image-padding-left-tiny: 12px;
@@ -2945,13 +3057,13 @@
2945
3057
  --wds-marketing-layout-image-padding-vertical-medium: 12px;
2946
3058
  --wds-marketing-layout-image-padding-vertical-small: 12px;
2947
3059
  --wds-marketing-layout-image-padding-vertical-tiny: 12px;
2948
- --wds-marketing-layout-image-width: 100%;
2949
- --wds-marketing-layout-image-wrapper-contain: none;
2950
- --wds-marketing-layout-image-wrapper-flex: 0 1 auto;
3060
+ --wds-marketing-layout-image-width: auto;
3061
+ --wds-marketing-layout-image-wrapper-contain: size;
3062
+ --wds-marketing-layout-image-wrapper-flex: none;
2951
3063
  --wds-marketing-layout-image-wrapper-width: auto;
2952
- --wds-marketing-layout-min-height-medium: auto;
2953
- --wds-marketing-layout-min-height-small: auto;
2954
- --wds-marketing-layout-min-height-tiny: auto;
3064
+ --wds-marketing-layout-min-height-medium: 180px;
3065
+ --wds-marketing-layout-min-height-small: 160px;
3066
+ --wds-marketing-layout-min-height-tiny: 140px;
2955
3067
  --wds-marketing-layout-padding-left-medium: 20px;
2956
3068
  --wds-marketing-layout-padding-left-small: 8px;
2957
3069
  --wds-marketing-layout-padding-left-tiny: 8px;
@@ -2961,17 +3073,17 @@
2961
3073
  --wds-marketing-layout-padding-vertical-medium: 20px;
2962
3074
  --wds-marketing-layout-padding-vertical-small: 20px;
2963
3075
  --wds-marketing-layout-padding-vertical-tiny: 20px;
2964
- --wds-marketing-layout-title-font-family-tiny: Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
3076
+ --wds-marketing-layout-title-font-family-tiny: "Madefor Display", Madefor, "Helvetica Neue", Helvetica,Arial, "メイリオ", "meiryo", "ヒラギノ角ゴ pro w3", "hiragino kaku gothic pro", sans-serif;
2965
3077
  --wds-marketing-layout-title-font-size-medium: 16px;
2966
3078
  --wds-marketing-layout-title-font-size-small: 16px;
2967
3079
  --wds-marketing-layout-title-font-size-tiny: 16px;
2968
3080
  --wds-marketing-layout-title-font-weight-medium: 700;
2969
3081
  --wds-marketing-layout-title-font-weight-small: 700;
2970
3082
  --wds-marketing-layout-title-font-weight-tiny: 700;
2971
- --wds-marketing-layout-title-gap-medium: 8px;
2972
- --wds-marketing-layout-title-gap-small: 8px;
2973
- --wds-marketing-layout-title-gap-tiny: 8px;
2974
- --wds-marketing-layout-title-letter-spacing-tiny: 0px;
3083
+ --wds-marketing-layout-title-gap-medium: 4px;
3084
+ --wds-marketing-layout-title-gap-small: 4px;
3085
+ --wds-marketing-layout-title-gap-tiny: 2px;
3086
+ --wds-marketing-layout-title-letter-spacing-tiny: -0.5px;
2975
3087
  --wds-marketing-layout-title-line-height-medium: 20px;
2976
3088
  --wds-marketing-layout-title-line-height-small: 20px;
2977
3089
  --wds-marketing-layout-title-line-height-tiny: 20px;
@@ -3040,8 +3152,8 @@
3040
3152
  --wds-nestable-list-fill: rgba(255, 255, 255, 0);
3041
3153
  --wds-nestable-list-paddings: 8px;
3042
3154
  --wds-notification-border-color: #ffffff;
3043
- --wds-notification-border-radius: 0px;
3044
- --wds-notification-border-width: 0px;
3155
+ --wds-notification-border-radius: 8px;
3156
+ --wds-notification-border-width: 1px;
3045
3157
  --wds-notification-content-color: #383838;
3046
3158
  --wds-notification-fill-error: #f4b8b9;
3047
3159
  --wds-notification-fill-premium: #e7e4fe;
package/studio2-light/semantic.st.css CHANGED
@@ -527,10 +527,10 @@
527
527
  --wds-border-width-surface-modal: 0px;
528
528
  --wds-border-width-varied: 0px;
529
529
  --wds-border-width-varied-secondary: 0px;
530
- --wds-color-border-ai-primary: #ffffff;
531
- --wds-color-border-ai-primary-active: #ffffff;
532
- --wds-color-border-ai-primary-disabled: #ffffff;
533
- --wds-color-border-ai-primary-hover: #ffffff;
530
+ --wds-color-border-ai-primary: #7896ff;
531
+ --wds-color-border-ai-primary-active: #2f5dff;
532
+ --wds-color-border-ai-primary-disabled: rgba(19, 23, 32, .1);
533
+ --wds-color-border-ai-primary-hover: #597dff;
534
534
  --wds-color-border-dark-primary: #767574;
535
535
  --wds-color-border-dark-primary-active: #383838;
536
536
  --wds-color-border-dark-primary-disabled: rgba(19, 23, 32, .1);
@@ -636,21 +636,21 @@
636
636
  --wds-color-fill-accent-10: #1f8845;
637
637
  --wds-color-fill-accent-11: #1b3689;
638
638
  --wds-color-fill-accent-12: #acafc4;
639
- --wds-color-fill-ai: #ffffff;
640
- --wds-color-fill-ai-hover: #ffffff;
641
- --wds-color-fill-ai-primary: #5a48f5;
642
- --wds-color-fill-ai-primary-active: #5a48f5;
643
- --wds-color-fill-ai-primary-disabled: #bebebe;
644
- --wds-color-fill-ai-primary-hover: #4d3dd0;
645
- --wds-color-fill-ai-primary-pressed: #ffffff;
646
- --wds-color-fill-ai-secondary: #d6d1fc;
647
- --wds-color-fill-ai-secondary-active: #d6d1fc;
648
- --wds-color-fill-ai-secondary-disabled: #e5e5e5;
649
- --wds-color-fill-ai-secondary-hover: #a59bfa;
639
+ --wds-color-fill-ai: #2f5dff;
640
+ --wds-color-fill-ai-hover: #1c3fe5;
641
+ --wds-color-fill-ai-primary: #2f5dff;
642
+ --wds-color-fill-ai-primary-active: #0f2ccf;
643
+ --wds-color-fill-ai-primary-disabled: rgba(19, 23, 32, .3);
644
+ --wds-color-fill-ai-primary-hover: #1c3fe5;
645
+ --wds-color-fill-ai-primary-pressed: #0f2ccf;
646
+ --wds-color-fill-ai-secondary: #d5dfff;
647
+ --wds-color-fill-ai-secondary-active: #0f2ccf;
648
+ --wds-color-fill-ai-secondary-disabled: rgba(19, 23, 32, .1);
649
+ --wds-color-fill-ai-secondary-hover: #1c3fe5;
650
650
  --wds-color-fill-ai-tertiary: #ffffff;
651
- --wds-color-fill-ai-tertiary-active: #d6d1fc;
651
+ --wds-color-fill-ai-tertiary-active: #d5dfff;
652
652
  --wds-color-fill-ai-tertiary-disabled: #ffffff;
653
- --wds-color-fill-ai-tertiary-hover: #f8f6f6;
653
+ --wds-color-fill-ai-tertiary-hover: #eaefff;
654
654
  --wds-color-fill-dark-primary: #151414;
655
655
  --wds-color-fill-dark-primary-active: #525150;
656
656
  --wds-color-fill-dark-primary-disabled: rgba(19, 23, 32, .3);