@commercetools-frontend/ui-kit 17.1.0 → 18.0.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 (8) hide show
  1. package/dist/commercetools-frontend-ui-kit.cjs.dev.js +1 -1
  2. package/dist/commercetools-frontend-ui-kit.cjs.prod.js +1 -1
  3. package/dist/commercetools-frontend-ui-kit.esm.js +1 -1
  4. package/materials/custom-properties.css +6 -407
  5. package/materials/custom-properties.json +7 -312
  6. package/materials/internals/definition.yaml +41 -866
  7. package/materials/internals/tokens.story.js +1 -1
  8. package/package.json +36 -36
package/materials/custom-properties.json CHANGED
@@ -161,6 +161,7 @@
161
161
  "--spacing-30": "16px",
162
162
  "--spacing-40": "24px",
163
163
  "--spacing-50": "32px",
164
+ "--spacing-55": "40px",
164
165
  "--spacing-60": "48px",
165
166
  "--spacing-70": "64px",
166
167
  "--transition-linear-80ms": "80ms linear",
@@ -171,19 +172,8 @@
171
172
  "--break-point-biggerdesktop": "1280px",
172
173
  "--break-point-giantdesktop": "1680px",
173
174
  "--break-point-jumbodesktop": "1920px",
174
- "--align-items-for-select-input-tag": "center",
175
175
  "--background-color-for-button-when-active": "hsl(232, 18%, 95%)",
176
176
  "--background-color-for-button-when-hovered": "hsl(232, 18%, 98%)",
177
- "--background-color-for-button-as-primary-when-active": "#15A390",
178
- "--background-color-for-button-as-primary-when-hovered": "#17AB97",
179
- "--background-color-for-button-as-icon-as-primary-when-active": "#15A390",
180
- "--background-color-for-button-as-icon-as-primary-when-hovered": "hsl(175, 55%, 45%)",
181
- "--background-color-for-button-as-icon-as-info-when-active": "#057FCC",
182
- "--background-color-for-button-as-icon-as-info-when-hovered": "#078cdf",
183
- "--background-color-for-button-as-urgent-when-active": "#DC630A",
184
- "--background-color-for-button-as-urgent-when-hovered": "#E7680D",
185
- "--background-color-for-button-as-critical-when-active": "#B3003E",
186
- "--background-color-for-button-as-critical-when-hovered": "#CC0047",
187
177
  "--background-color-for-button-when-disabled": "hsl(195, 35.2941176471%, 95%)",
188
178
  "--background-color-for-input": "#fff",
189
179
  "--background-color-for-input-when-selected": "hsl(195, 35.2941176471%, 95%)",
@@ -194,58 +184,9 @@
194
184
  "--background-color-for-input-when-active": "hsl(203.05555555555554, 93.9130434783%, 95%)",
195
185
  "--background-color-for-input-as-quiet": "transparent",
196
186
  "--background-color-for-input-as-quiet-when-hovered": "hsl(0deg 0% 10% / 2%)",
197
- "--background-color-for-table-cell-when-hovered": "hsl(232, 18%, 98%)",
198
- "--background-color-for-table-header": "hsl(232, 18%, 98%)",
199
- "--background-color-for-tag": "hsl(232, 18%, 95%)",
200
- "--background-color-for-tag-warning": "hsl(25.110132158590307, 89.0196078431%, 95%)",
201
- "--background-color-for-tag-when-hovered": "hsl(232, 18%, 90%)",
202
- "--background-color-for-collapsible-panel-header-icon-when-disabled": "#fff",
203
- "--background-color-for-select-input-option-when-hovered": "hsl(232, 18%, 98%)",
204
- "--background-color-for-stamp-as-positive": "hsl(175, 70%, 90%)",
205
- "--background-color-for-stamp-as-primary": "hsl(175, 70%, 90%)",
206
187
  "--background-color-for-localized-input-label": "#fff",
207
188
  "--background-color-for-localized-input-label-when-readonly": "hsl(232, 18%, 95%)",
208
189
  "--background-color-for-localized-input-label-when-disabled": "hsl(232, 18%, 95%)",
209
- "--background-color-for-localized-rich-text-body-button-when-active": "hsl(195, 35.2941176471%, 20%)",
210
- "--background-color-for-localized-rich-text-body-button": "hsl(232, 18%, 95%)",
211
- "--background-color-for-rich-text-dropdown-when-hovered": "hsl(232, 18%, 95%)",
212
- "--background-color-for-rich-text-more-styles-dropdown-when-hovered": "hsl(203.05555555555554, 93.9130434783%, 95%)",
213
- "--background-color-for-rich-text-button": "hsl(195, 35.2941176471%, 20%)",
214
- "--background-color-for-tooltip": "hsl(195, 35.2941176471%, 10%)",
215
- "--background-color-for-view-switcher": "#fff",
216
- "--background-color-for-view-switcher-when-disabled": "#fff",
217
- "--background-color-for-view-switcher-when-selected": "hsl(232, 18%, 95%)",
218
- "--background-color-for-view-switcher-when-hovered": "hsl(232, 18%, 95%)",
219
- "--background-color-for-content-notification-when-error": "hsl(339.1304347826087, 100%, 95%)",
220
- "--background-color-for-content-notification-when-info": "hsl(203.05555555555554, 93.9130434783%, 95%)",
221
- "--background-color-for-content-notification-when-warning": "hsl(25.110132158590307, 89.0196078431%, 95%)",
222
- "--background-color-for-content-notification-when-success": "hsl(175, 90%, 95%)",
223
- "--background-color-for-checkbox-input-icon": "hsl(175, 55%, 45%)",
224
- "--background-color-for-checkbox-input-icon-when-disabled": "hsl(232, 18%, 80%)",
225
- "--background-color-for-checkbox-input-icon-when-readonly": "hsl(232, 18%, 60%)",
226
- "--background-color-for-checkbox-input-icon-when-error": "#e60050",
227
- "--background-color-for-checkbox-input-icon-when-hovered": "hsl(232, 18%, 90%)",
228
- "--background-color-for-primary-action-dropdown-when-active": "hsl(232, 18%, 90%)",
229
- "--background-color-for-primary-action-dropdown-when-disabled": "hsl(232, 18%, 95%)",
230
- "--background-color-for-toggle-input-track": "hsl(232, 18%, 80%)",
231
- "--background-color-for-toggle-input-track-when-disabled": "hsl(232, 18%, 90%)",
232
- "--background-color-for-toggle-input-thumb-when-disabled": "hsl(232, 18%, 60%)",
233
- "--background-color-for-toggle-input-track-when-checked": "hsl(175, 55%, 40%)",
234
- "--background-color-for-toggle-input-thumb-when-checked": "hsl(175, 55%, 25%)",
235
- "--background-color-for-toggle-input-track-when-checked-and-disabled": "hsl(195, 35.2941176471%, 90%)",
236
- "--background-color-for-toggle-input-thumb-when-checked-and-disabled": "hsl(195, 35.2941176471%, 60%)",
237
- "--background-color-for-button-as-secondary-when-info": "hsl(203.05555555555554, 93.9130434783%, 95%)",
238
- "--background-color-for-button-as-secondary-when-info-and-hovered": "#CEEBFD",
239
- "--background-color-for-button-as-secondary-when-info-and-active": "hsl(203.05555555555554, 93.9130434783%, 85%)",
240
- "--border-for-button-as-secondary": "1px solid var(--color-neutral)",
241
- "--border-for-button-as-secondary-when-hovered": "1px solid var(--color-neutral)",
242
- "--border-for-button-as-secondary-when-active": "1px solid var(--color-neutral)",
243
- "--border-for-card-when-raised": "1px solid var(--color-neutral-90)",
244
- "--border-for-collapsible-panel-header-icon-when-disabled": "none",
245
- "--border-for-view-switcher": "1px solid var(--color-neutral)",
246
- "--border-for-select-input-tag": "1px solid var(--color-neutral-85)",
247
- "--border-for-radio-input-option": "2px",
248
- "--border-for-calendar-menu-when-focused": "none",
249
190
  "--border-color-for-input": "hsl(232, 18%, 80%)",
250
191
  "--border-color-for-input-when-focused": "hsl(175, 55%, 45%)",
251
192
  "--border-color-for-input-when-disabled": "hsl(232, 18%, 80%)",
@@ -254,277 +195,31 @@
254
195
  "--border-color-for-input-when-warning": "#f16d0e",
255
196
  "--border-color-for-input-when-hovered": "hsl(232, 18%, 80%)",
256
197
  "--border-color-for-input-as-quiet": "transparent",
257
- "--border-color-for-tag": "hsl(232, 18%, 80%)",
258
- "--border-color-for-tag-warning": "#f16d0e",
259
- "--border-color-for-tag-when-focused": "hsl(232, 18%, 80%)",
260
- "--border-color-for-tag-when-hovered": "hsl(232, 18%, 80%)",
261
- "--border-color-for-button-as-icon": "hsl(232, 18%, 80%)",
262
- "--border-color-for-button-as-icon-as-info": "hsl(232, 18%, 80%)",
263
- "--border-color-for-button-as-icon-as-primary": "hsl(232, 18%, 80%)",
264
- "--border-color-for-button-as-icon-when-disabled": "#fff",
265
- "--border-color-for-table-header": "#fff",
266
- "--border-color-for-table-header-as-bottom": "hsl(232, 18%, 95%)",
267
- "--border-color-for-table-manager-droppable-list": "hsl(232, 18%, 80%)",
268
- "--border-color-for-collapsible-panel-header": "hsl(232, 18%, 90%)",
269
- "--border-color-for-stamp-when-error": "hsl(339.1304347826087, 100%, 85%)",
270
- "--border-color-for-stamp-when-warning": "hsl(25.110132158590307, 89.0196078431%, 85%)",
271
- "--border-color-for-stamp-as-positive": "hsl(175, 70%, 85%)",
272
- "--border-color-for-stamp-as-information": "hsl(203.05555555555554, 93.9130434783%, 85%)",
273
- "--border-color-for-stamp-as-primary": "hsl(175, 70%, 85%)",
274
- "--border-color-for-stamp-as-secondary": "hsl(232, 18%, 85%)",
275
- "--border-color-for-localized-input-label": "hsl(232, 18%, 80%)",
276
- "--border-color-for-localized-input-label-when-readonly": "#fff",
277
- "--border-color-for-content-notification-when-error": "hsl(339.1304347826087, 100%, 85%)",
278
- "--border-color-for-content-notification-when-info": "hsl(203.05555555555554, 93.9130434783%, 85%)",
279
- "--border-color-for-content-notification-when-warning": "hsl(25.110132158590307, 89.0196078431%, 85%)",
280
- "--border-color-for-content-notification-when-success": "hsl(175, 70%, 85%)",
281
- "--border-color-for-group-heading-select-input-options": "hsl(232, 18%, 90%)",
282
- "--border-color-for-select-input-menu": "#fff",
283
- "--border-color-for-select-input-when-readonly": "hsl(232, 18%, 95%)",
284
- "--border-color-for-select-input-menu-when-warning": "#fff",
285
- "--border-color-for-select-input-menu-when-error": "#fff",
286
- "--border-color-for-checkbox-input-icon": "hsl(175, 55%, 45%)",
287
- "--border-color-for-checkbox-input-icon-when-disabled": "hsl(232, 18%, 80%)",
288
- "--border-color-for-checkbox-input-icon-when-readonly": "hsl(232, 18%, 60%)",
289
- "--border-color-for-checkbox-input-icon-when-error": "#e60050",
290
- "--border-color-for-radio-input": "hsl(232, 18%, 60%)",
291
- "--border-color-for-radio-input-when-disabled": "hsl(232, 18%, 80%)",
292
- "--border-color-for-radio-input-when-readonly": "hsl(232, 18%, 60%)",
293
- "--border-color-for-radio-input-when-checked": "hsl(175, 55%, 45%)",
294
- "--border-color-for-radio-input-when-focused": "hsl(232, 18%, 60%)",
295
- "--border-color-for-primary-action-dropdown-menu": "#fff",
296
- "--border-color-for-button-as-secondary-when-info": "hsl(203.05555555555554, 93.9130434783%, 85%)",
297
198
  "--border-radius-for-button-as-big": "4px",
298
199
  "--border-radius-for-button-as-medium": "4px",
299
- "--border-radius-for-button-as-icon-as-big": "4px",
300
- "--border-radius-for-button-as-icon-as-medium": "4px",
301
- "--border-radius-for-button-as-icon-as-small": "2px",
302
200
  "--border-radius-for-input": "4px",
303
- "--border-radius-for-tag": "2px",
304
- "--border-radius-for-card": "4px",
305
- "--border-radius-for-table-manager-droppable-list": "4px",
306
- "--border-radius-for-stamp": "4px",
307
- "--border-radius-for-stamp-as-condensed": "2px",
308
- "--border-radius-for-view-switcher": "4px",
309
- "--border-radius-for-content-notification": "4px",
310
- "--border-radius-for-primary-action-dropdown": "var(--border-radius-4) 0 0 var(--border-radius-4)",
311
- "--border-radius-for-primary-action-dropdown-icon": "0 var(--border-radius-4) var(--border-radius-4) 0",
312
- "--border-radius-for-primary-action-dropdown-menu": "4px",
313
201
  "--border-width-for-input": "1px",
314
202
  "--border-width-for-input-when-warning": "1px",
315
203
  "--border-width-for-input-when-error": "1px",
316
204
  "--border-width-for-input-when-focused": "1px",
317
- "--border-width-for-tag": "1px 1px 1px 0",
318
- "--border-width-for-select-input": "2px",
319
- "--border-left-width-for-content-notification": "0px",
320
- "--border-width-for-checkbox-input-icon": "2px",
321
- "--border-for-primary-action-dropdown-icon": "1px 1px 1px 0px",
322
- "--box-shadow-for-datetime-input-when-hovered": "inset 0 0 0 1px",
323
- "--box-shadow-for-view-switcher": "none",
324
- "--box-shadow-for-view-switcher-when-selected": "none",
325
- "--box-shadow-for-select-input-when-focused": "inset 0 0 0 1px",
326
- "--box-shadow-for-calendar-menu-when-focused": "0 2px 5px 0px rgba(0, 0, 0, 0.15)",
327
- "--box-shadow-for-table": "0 1px 5px 0 rgba(0, 0, 0, 0.05)",
328
- "--font-color-for-text": "#1a1a1a",
329
- "--font-color-for-text-when-disabled": "hsl(232, 18%, 60%)",
330
205
  "--font-color-for-input": "#1a1a1a",
331
206
  "--font-color-for-input-when-disabled": "hsl(232, 18%, 60%)",
332
207
  "--font-color-for-input-when-error": "#e60050",
333
208
  "--font-color-for-input-when-readonly": "hsl(232, 18%, 40%)",
334
209
  "--font-color-for-input-when-warning": "#f16d0e",
335
- "--font-color-for-tag": "#1a1a1a",
336
- "--font-color-for-tag-remove-icon": "hsl(232, 18%, 40%)",
337
- "--font-color-for-tag-drag-icon": "hsl(232, 18%, 40%)",
338
- "--font-color-for-tag-remove-icon-when-hovered": "#e60050",
339
- "--font-color-for-tag-when-disabled": "hsl(232, 18%, 60%)",
340
- "--font-color-for-text-when-inverted": "#fff",
341
- "--font-color-for-link-as-inverted": "#fff",
342
- "--font-color-for-link-as-primary": "hsl(175, 55%, 30%)",
343
- "--font-color-for-link-as-secondary": "#1a1a1a",
344
- "--font-color-for-link-as-primary-when-active": "hsl(175, 55%, 45%)",
345
- "--font-color-for-link-as-secondary-when-active": "hsl(175, 55%, 45%)",
346
- "--font-color-for-table-header": "hsl(232, 18%, 40%)",
347
- "--font-color-for-localized-input-label": "hsl(232, 18%, 60%)",
348
- "--font-color-for-view-switcher": "hsl(232, 18%, 40%)",
349
- "--font-color-for-view-switcher-when-disabled": "hsl(232, 18%, 60%)",
350
- "--font-color-for-view-switcher-when-selected": "#1a1a1a",
351
- "--font-color-for-clear-input-icon": "hsl(232, 18%, 40%)",
352
- "--font-color-for-clear-input-icon-when-hovered": "#e60050",
353
- "--font-color-for-content-notification": "#1a1a1a",
354
- "--font-color-for-content-notification-icon-when-error": "#e60050",
355
- "--font-color-for-content-notification-icon-when-warning": "#f16d0e",
356
- "--font-color-for-content-notification-icon-when-success": "hsl(175, 55%, 45%)",
357
- "--font-color-for-content-notification-icon-when-info": "#078cdf",
358
- "--font-color-for-search-input-icon": "hsl(232, 18%, 60%)",
359
- "--font-color-for-search-input-icon-when-hovered": "hsl(175, 55%, 45%)",
360
- "--font-color-for-select-input-icon": "hsl(232, 18%, 60%)",
361
- "--font-color-for-select-input-when-error": "#e60050",
362
- "--font-color-for-select-input-when-warning": "#f16d0e",
363
- "--font-color-for-select-input-icon-when-error": "#e60050",
364
- "--font-color-for-select-input-icon-when-warning": "#f16d0e",
365
- "--font-color-for-money-input-currency-dropdown-indicator": "hsl(232, 18%, 40%)",
366
- "--font-color-for-search-input-icon-when-readonly": "hsl(232, 18%, 60%)",
367
- "--font-color-for-checkbox-input-label": "#1a1a1a",
368
- "--font-color-for-checkbox-input-label-when-error": "#e60050",
369
- "--font-color-for-checkbox-input-label-when-disabled": "hsl(232, 18%, 60%)",
370
- "--font-color-for-checkbox-input-label-when-readonly": "hsl(232, 18%, 40%)",
371
- "--font-color-for-radio-input-when-disabled": "hsl(232, 18%, 60%)",
372
- "--font-color-for-radio-input-when-error": "#e60050",
373
- "--font-color-for-radio-input-when-readonly": "hsl(232, 18%, 60%)",
374
- "--font-color-for-radio-input-when-warning": "#f16d0e",
375
- "--font-color-for-flat-button-as-primary": "hsl(175, 55%, 30%)",
376
- "--font-color-for-flat-button-as-primary-when-hovered": "hsl(175, 55%, 45%)",
377
- "--font-color-for-flat-button-as-critical": "#e60050",
378
- "--font-color-for-flat-button-as-critical-when-hovered": "hsl(339.1304347826087, 100%, 25%)",
379
- "--font-color-for-flat-button-as-secondary": "#1a1a1a",
380
- "--font-color-for-flat-button-as-inverted": "#fff",
381
- "--font-color-for-flat-button-icon-when-disabled": "hsl(232, 18%, 60%)",
382
- "--font-color-for-secondary-icon-button-as-primary": "hsl(175, 55%, 25%)",
383
- "--font-color-for-secondary-icon-button-as-primary-when-hovered": "hsl(175, 55%, 45%)",
384
210
  "--height-for-button-as-big": "40px",
385
211
  "--height-for-button-as-medium": "32px",
386
- "--height-for-button-as-icon-as-big": "40px",
387
- "--height-for-button-as-icon-as-medium": "32px",
388
- "--height-for-button-as-icon-as-small": "16px",
212
+ "--height-for-button-as-small": "16px",
389
213
  "--height-for-input": "40px",
390
- "--height-for-view-switcher": "40px",
391
- "--height-for-view-switcher-when-condensed": "32px",
392
- "--height-for-select-input-tag": "32px",
393
- "--height-for-radio-input-option": "18px",
394
- "--height-for-radio-input-option-when-checked": "10px",
395
- "--height-for-primary-action-dropdown": "40px",
396
- "--width-for-avatar-as-medium": "40px",
397
- "--min-width-for-money-input-currency-dropdown": "80px",
214
+ "--height-for-input-as-small": "32px",
398
215
  "--placeholder-font-color-for-input": "hsl(232, 18%, 60%)",
399
216
  "--font-size-for-button": "0.875rem",
400
217
  "--font-size-for-input": "1rem",
401
- "--font-size-for-text-as-h1": "1.5rem",
402
- "--font-size-for-text-as-h2": "1.25rem",
403
- "--font-size-for-text-as-h3": "1.125rem",
404
- "--font-size-for-text-as-h4": "1rem",
405
- "--font-size-for-text-as-h5": "1rem",
406
- "--font-size-for-text-as-body": "1rem",
407
- "--font-size-for-text-as-caption": "0.75rem",
408
- "--font-size-for-text-as-detail": "0.875rem",
409
- "--font-size-for-body": "16px",
410
- "--font-size-for-link": "1rem",
411
- "--font-size-for-view-switcher": "0.875rem",
412
- "--font-size-for-table": "0.875rem",
413
- "--font-size-for-localized-input-label": "1rem",
414
- "--font-size-for-content-notification": "1rem",
415
- "--font-size-for-select-input-tag": "1rem",
416
- "--icon-color-for-datetime-input-icon": "hsl(232, 18%, 40%)",
417
- "--icon-color-for-datetime-input-icon-when-hovered": "#e60050",
418
- "--line-height-for-text-as-h1": "2.125rem",
419
- "--line-height-for-text-as-h2": "1.75rem",
420
- "--line-height-for-text-as-h3": "1.5rem",
421
- "--line-height-for-text-as-h4": "1.375rem",
422
- "--line-height-for-text-as-h5": "1.375rem",
423
- "--line-height-for-text-as-body": "1.625rem",
424
- "--line-height-for-text-as-caption": "1.125rem",
425
- "--line-height-for-text-as-detail": "1.375rem",
426
- "--line-height-for-select-input-options": "1.625rem",
427
- "--line-height-for-table-header": "26px",
428
- "--font-weight-for-text-as-h1": "600",
429
- "--font-weight-for-text-as-h2": "500",
430
- "--font-weight-for-text-as-h3": "500",
431
- "--font-weight-for-text-as-h4": "500",
432
- "--font-weight-for-text-as-h5": "500",
433
- "--font-weight-for-text-as-body": "400",
434
- "--font-weight-for-text-as-caption": "400",
435
- "--font-weight-for-text-as-detail": "400",
436
- "--font-weight-for-button": "500",
437
- "--font-weight-for-table-header": "500",
438
- "--font-weight-for-text-as-bold": "600",
439
- "--margin-for-table-header": "8px",
440
- "--margin-for-table-cell-as-condensed": "8px",
441
- "--margin-for-view-switcher-icon": "0 var(--spacing-20) 0 0",
442
- "--margin-for-group-heading-select-input-options": "8px",
443
- "--margin-for-select-input-icon": "8px",
444
- "--margin-left-for-select-input-icon": "8px",
445
- "--margin-right-for-money-input-precision-badge": "12px",
446
- "--margin-right-for-search-input-icon": "12px",
447
- "--margin-right-for-clear-input-icon": "8px",
448
- "--margin-left-for-radio-input-label": "4px",
449
- "--margin-right-for-primary-action-dropdown": "8px",
450
- "--margin-top-for-primary-action-dropdown": "8px",
451
- "--margin-for-localized-rich-text-body-button": "0 2px var(--spacing-20) 2px",
452
- "--margin-for-rich-text-divider": "var(--spacing-10) 2px",
453
- "--margin-for-rich-text-dropdown-item-label": "0 0 0 var(--spacing-20)",
454
- "--margin-for-tag-list": "0 var(--spacing-20) var(--spacing-20) 0",
455
- "--padding-for-stamp": "4px 12px",
456
- "--padding-for-stamp-as-condensed": "var(--spacing-05) var(--spacing-10)",
457
- "--padding-for-tag": "2px 12px",
458
- "--padding-for-table-header": "24px",
459
- "--padding-for-table-header-as-condensed": "24px",
460
- "--padding-for-table-cell": "var(--spacing-30) var(--spacing-40)",
461
- "--padding-for-table-cell-as-condensed": "var(--spacing-20) var(--spacing-40)",
462
- "--padding-for-table-manager-droppable-list": "16px",
463
- "--padding-for-table-manager-settings-panel": "var(--spacing-40) var(--spacing-50)",
464
- "--padding-for-table-manager-draggable-tag": "var(--spacing-10) 0",
465
- "--padding-for-collapsible-panel-header": "var(--spacing-30) 0",
466
- "--padding-for-collapsible-panel-header-as-condensed": "var(--spacing-20) 0",
467
- "--padding-for-collapsible-panel-section-wrapper": "var(--spacing-50) 0 0 calc(var(--spacing-30) + var(--spacing-10))",
468
- "--padding-for-collapsible-panel-section-wrapper-as-condensed": "var(--spacing-40) 0 0 calc(var(--spacing-30) + var(--spacing-10))",
469
- "--padding-for-collapsible-panel-section-description": "0 0 var(--spacing-40)",
470
- "--padding-for-collapsible-panel-section-description-as-condensed": "0 0 var(--spacing-40)",
471
- "--padding-for-input": "16px",
472
- "--padding-for-input-as-quiet": "8px",
473
- "--padding-for-multiline-input": "8px",
474
- "--padding-for-localized-rich-text-input-label": "var(--spacing-20) 12px",
475
- "--padding-for-localized-rich-text-dropdown-button": "5px var(--spacing-20)",
476
- "--padding-for-localized-rich-text-dropdown-item": "var(--spacing-20) var(--spacing-30)",
477
- "--padding-for-localized-rich-text-body-button": "var(--spacing-20)",
478
- "--padding-for-localized-input-label": "0 12px",
479
- "--padding-for-rich-text-input": "var(--spacing-20) var(--spacing-30)",
480
- "--padding-for-rich-text-toolbar": "none",
481
- "--padding-left-for-rich-text-toolbar": "none",
482
- "--padding-for-rich-text-editor-container": "var(--spacing-20) 0 0",
483
- "--padding-for-localized-multiline-text-input-label": "0 var(--spacing-20)",
484
- "--padding-for-tag-remove-icon": "0 12px",
485
- "--padding-for-tooltip": "var(--spacing-20) 12px",
486
- "--padding-for-view-switcher": "0 var(--spacing-30) 0 var(--spacing-30)",
487
- "--padding-for-view-switcher-when-condensed": "0 12px 0 12px",
488
- "--padding-for-content-notification": "var(--spacing-20) var(--spacing-30)",
489
- "--padding-for-content-notification-message": "0 var(--spacing-30) 0 var(--spacing-20)",
490
- "--padding-left-for-select-input-options": "16px",
491
- "--padding-right-for-select-input-options": "16px",
492
- "--padding-top-for-select-input-options": "8px",
493
- "--padding-bottom-for-select-input-options": "8px",
494
- "--padding-for-group-heading-select-input-options": "16px",
495
- "--padding-for-select-input-menu": "var(--spacing-10) 0",
496
- "--padding-for-money-input-currency-dropdown": "0 12px",
497
- "--padding-for-selectable-search-input-dropdown": "0 12px",
498
- "--padding-for-primary-action-dropdown": "0 var(--spacing-30)",
499
- "--padding-for-primary-action-dropdown-icon": "0 var(--spacing-20)",
500
- "--padding-for-button-as-medium": "0 var(--spacing-30)",
501
- "--padding-for-button-as-big": "0 var(--spacing-30)",
502
- "--shadow-box-tag-when-hovered": "0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)",
503
- "--shadow-for-button": "none",
504
- "--shadow-for-button-when-focused": "none",
505
- "--shadow-for-button-when-hovered": "none",
506
- "--shadow-for-button-when-active": "none",
507
- "--shadow-for-button-when-disabled": "none",
508
- "--shadow-for-card-when-raised": "0 1px 5px 0 rgba(0, 0, 0, 0.05)",
218
+ "--padding-for-input": "0 var(--spacing-30)",
219
+ "--padding-for-input-as-quiet": "0 var(--spacing-20)",
220
+ "--padding-for-button": "0 var(--spacing-30)",
509
221
  "--shadow-for-input": "none",
510
222
  "--shadow-for-input-when-focused": "inset 0 0 0 1px var(--color-primary)",
511
223
  "--shadow-for-input-when-error": "inset 0 0 0 1px var(--color-error)",
512
- "--shadow-for-input-when-warning": "inset 0 0 0 1px var(--color-warning)",
513
- "--shadow-for-tooltip": "0px 1px 2px 0px rgba(0, 0, 0, 0.25)",
514
- "--shadow-for-select-input-menu": "0 2px 5px 0px rgba(0, 0, 0, 0.15)",
515
- "--shadow-for-primary-action-dropdown": "none",
516
- "--shadow-for-primary-action-dropdown-when-hovered": "none",
517
- "--shadow-for-primary-action-dropdown-when-active": "none",
518
- "--shadow-for-primary-action-dropdown-menu": "0 2px 5px 0px rgba(0, 0, 0, 0.15)",
519
- "--shadow-for-toggle-input-thumb": "0px 1px 5px rgba(0, 0, 0, 0.2)",
520
- "--shadow-for-tag-when-hovered": "none",
521
- "--font-size-m": "1rem",
522
- "--big-button-height": "32px",
523
- "--small-button-height": "24px",
524
- "--size-height-input": "32px",
525
- "--font-family-default": "'Open Sans', sans-serif",
526
- "--font-size-default": "1rem",
527
- "--font-size-small": "0.9231rem",
528
- "--shadow-box-tag-hover": "0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24)",
529
- "--size-height-tag": "26px"
224
+ "--shadow-for-input-when-warning": "inset 0 0 0 1px var(--color-warning)"
530
225
  }