@atlassian/aui 9.6.1 → 9.7.0-5d50c8a74

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 (60) hide show
  1. package/README.md +1 -1
  2. package/dist/aui/@atlaskit-internal_atlassian-dark-iteration.js +2 -0
  3. package/dist/aui/@atlaskit-internal_atlassian-dark-iteration.js.map +1 -0
  4. package/dist/aui/@atlaskit-internal_atlassian-dark-new-input-border.js +2 -0
  5. package/dist/aui/@atlaskit-internal_atlassian-dark-new-input-border.js.map +1 -0
  6. package/dist/aui/@atlaskit-internal_atlassian-dark.js +2 -0
  7. package/dist/aui/@atlaskit-internal_atlassian-dark.js.map +1 -0
  8. package/dist/aui/@atlaskit-internal_atlassian-legacy-dark.js +2 -0
  9. package/dist/aui/@atlaskit-internal_atlassian-legacy-dark.js.map +1 -0
  10. package/dist/aui/@atlaskit-internal_atlassian-legacy-light.js +2 -0
  11. package/dist/aui/@atlaskit-internal_atlassian-legacy-light.js.map +1 -0
  12. package/dist/aui/@atlaskit-internal_atlassian-light-new-input-border.js +2 -0
  13. package/dist/aui/@atlaskit-internal_atlassian-light-new-input-border.js.map +1 -0
  14. package/dist/aui/@atlaskit-internal_atlassian-light.js +2 -0
  15. package/dist/aui/@atlaskit-internal_atlassian-light.js.map +1 -0
  16. package/dist/aui/@atlaskit-internal_atlassian-shape.js +2 -0
  17. package/dist/aui/@atlaskit-internal_atlassian-shape.js.map +1 -0
  18. package/dist/aui/@atlaskit-internal_atlassian-spacing.js +2 -0
  19. package/dist/aui/@atlaskit-internal_atlassian-spacing.js.map +1 -0
  20. package/dist/aui/@atlaskit-internal_atlassian-typography.js +2 -0
  21. package/dist/aui/@atlaskit-internal_atlassian-typography.js.map +1 -0
  22. package/dist/aui/aui-css-deprecations.js +1 -1
  23. package/dist/aui/aui-css-deprecations.js.map +1 -1
  24. package/dist/aui/aui-prototyping-browserfocus.css +532 -5
  25. package/dist/aui/aui-prototyping-darkmode.css +258 -5
  26. package/dist/aui/aui-prototyping-design-tokens-api.js +18 -0
  27. package/dist/aui/aui-prototyping-design-tokens-api.js.map +1 -0
  28. package/dist/aui/aui-prototyping.css +8 -8
  29. package/dist/aui/aui-prototyping.css.map +1 -1
  30. package/dist/aui/aui-prototyping.js +2 -2
  31. package/dist/aui/aui-prototyping.js.map +1 -1
  32. package/dist/aui/aui-prototyping.nodeps.css +8 -8
  33. package/dist/aui/aui-prototyping.nodeps.css.map +1 -1
  34. package/dist/aui/aui-prototyping.nodeps.js +2 -2
  35. package/dist/aui/aui-prototyping.nodeps.js.map +1 -1
  36. package/entry/aui.design-tokens-api.js +2 -0
  37. package/entry/styles/aui.page.design-tokens-mode.js +1 -0
  38. package/entry/styles/aui.page.reset.js +1 -0
  39. package/package.json +4 -2
  40. package/src/js/aui/design-tokens/design-tokens.js +104 -0
  41. package/src/js/aui/form-notification.js +44 -10
  42. package/src/js/aui/form-validation.js +8 -1
  43. package/src/js/aui/internal/globalize.js +1 -1
  44. package/src/js/aui/toggle.js +6 -6
  45. package/src/js/aui/tooltip.js +64 -26
  46. package/src/js/aui-css-deprecations.js +8 -0
  47. package/src/less/aui-banner.less +4 -5
  48. package/src/less/aui-close-button.less +1 -2
  49. package/src/less/aui-experimental-tooltip.less +1 -1
  50. package/src/less/aui-spinner.less +1 -1
  51. package/src/less/forms-radios-and-checkboxes.less +0 -2
  52. package/src/less/imports/aui-theme/components/buttons.less +1 -1
  53. package/src/less/imports/aui-theme/components/forms.less +0 -1
  54. package/src/less/imports/aui-theme/components/progress-tracker.less +0 -2
  55. package/src/less/imports/aui-theme/core/colors.less +337 -12
  56. package/src/less/imports/aui-theme/theme.less +16 -1
  57. package/src/less/messages.less +3 -4
  58. package/src/less/themes/design-tokens.aui-theme.less +5 -0
  59. package/src/less/themes/themes.less +2 -0
  60. /package/{LICENSE.md → LICENSE} +0 -0
package/dist/aui/aui-prototyping-browserfocus.css CHANGED
@@ -139,7 +139,6 @@
139
139
  --aui-form-select-bg-color: #EBECF1;
140
140
  --aui-form-select-border-color: #EBECF1;
141
141
  --aui-form-select-hover-bg-color: #DFE1E6;
142
- --aui-form-checkbox-radio-hover-bg-color: #0065FF;
143
142
  --aui-form-checkbox-radio-active-bg-color: #DEEBFF;
144
143
  --aui-form-optgroup-text-color: #7A869A;
145
144
  --aui-form-optgroup-bg-color: #F4F5F7;
@@ -157,8 +156,6 @@
157
156
  --aui-form-checkbox-active-icon-color: #0052CC;
158
157
  --aui-form-radio-unchecked-bg-color: #FAFBFC;
159
158
  --aui-form-radio-unchecked-border-color: #DFE1E6;
160
- --aui-form-radio-unchecked-hover-bg-color: #EBECF1;
161
- --aui-form-radio-unchecked-hover-border-color: #DFE1E6;
162
159
  --aui-toggle-default-bg-color: #6B778C;
163
160
  --aui-toggle-default-bg-hover-color: #A5ADBA;
164
161
  --aui-toggle-button-color: #FFFFFF;
@@ -199,8 +196,272 @@
199
196
  --aui-tabs-tab-hover-text-color: #4C9AFF;
200
197
  --aui-tabs-tab-active-border-color: #0052CC;
201
198
  --aui-tabs-tab-active-text-color: #0052CC;
202
- --aui-progress-tracker-step-border-color: #F4F5F7;
203
- --aui-progress-tracker-container-color: #F4F5F7;
199
+ --aui-progress-tracker-current-step-color: #0065FF;
200
+ --aui-progress-tracker-current-step-text-color: var(--aui-progress-tracker-visited-step-text-color);
201
+ --aui-progress-tracker-visited-step-text-color: #172B4D;
202
+ --aui-progress-tracker-visited-step-hover-text-color: #0052CC;
203
+ --aui-progress-tracker-visited-step-active-text-color: #0747A6;
204
+ --aui-progress-tracker-future-step-color: #A5ADBA;
205
+ --aui-progress-tracker-future-step-text-color: #5E6C84;
206
+ --aui-table-row-bg-color: transparent;
207
+ --aui-table-row-text-color: #172B4D;
208
+ --aui-table-header-bg-color: transparent;
209
+ --aui-table-heading-text-color: #6B778C;
210
+ --aui-table-border-color: #DFE1E6;
211
+ --aui-table-caption-bg-color: #F4F5F7;
212
+ --aui-table-caption-text-color: #7A869A;
213
+ --aui-table-list-row-hover-color: rgba(9, 30, 66, 0.08);
214
+ --aui-table-list-row-subtle-color: #B3BAC5;
215
+ --aui-table-sortable-hover-bg-color: rgba(9, 30, 66, 0.08);
216
+ --aui-table-sortable-active-bg-color: #DEEBFF;
217
+ --aui-table-sortable-active-border-color: #0747A6;
218
+ --aui-table-sortable-active-text-color: #0747A6;
219
+ --aui-table-sortable-selected-bg-color: transparent;
220
+ --aui-table-sortable-selected-border-color: #7A869A;
221
+ --aui-table-sortable-selected-text-color: #505F79;
222
+ --aui-restfultable-row-focused-border-color: #B3BAC5;
223
+ --aui-restfultable-row-create-border-color: #DFE1E6;
224
+ --aui-restfultable-row-editable-hover-bg-color: var(--aui-form-field-hover-bg-color);
225
+ --aui-restfultable-error-text-color: var(--aui-form-notification-error-color);
226
+ --aui-restfultable-header-row-bg-color: #FFFFFF;
227
+ --aui-restfultable-header-row-text-color: #6B778C;
228
+ --aui-restfultable-row-moving-bg-color: #F4F5F7;
229
+ --aui-restfultable-editable-em-text-color: #97A0AF;
230
+ --aui-restfultable-row-active-bg-color: #F4F5F7;
231
+ --aui-restfultable-row-hover-bg-color: #F4F5F7;
232
+ --aui-dropdown-bg-color: #FFFFFF;
233
+ --aui-dropdown-border-color: #DFE1E6;
234
+ --aui-select2-placeholder-text-color: #7A869A;
235
+ --aui-select2-chosen-bg-color: #FFFFFF;
236
+ --aui-select2-chosen-text-color: #172B4D;
237
+ --aui-select2-chosen-hover-bg-color: #FFFFFF;
238
+ --aui-select2-chosen-hover-text-color: #172B4D;
239
+ --aui-select2-active-chosen-bg-color: #DFE1E6;
240
+ --aui-select2-active-chosen-text-color: #172B4D;
241
+ --aui-select2-field-default-bg-color: var(--aui-form-select-bg-color);
242
+ --aui-select2-field-border-color: var(--aui-form-select-border-color);
243
+ --aui-select2-field-hover-bg-color: var(--aui-form-select-hover-bg-color);
244
+ --aui-select2-drop-bg-color: var(--aui-dropdown-bg-color);
245
+ --aui-dialog-bg-color: #FFFFFF;
246
+ --aui-dialog-border-color: #EBECF1;
247
+ --aui-dialog-header-bg-color: var(--aui-dialog-bg-color);
248
+ --aui-dialog-header-warning-bg-color: #DE350B;
249
+ --aui-dialog-header-warning-text-color: #FFFFFF;
250
+ --aui-dialog-button-hover-border-color: #97A0AF;
251
+ --aui-dialog-footer-hint-text-color: #505F79;
252
+ --aui-inline-dialog-bg-color: var(--aui-dropdown-bg-color);
253
+ --aui-inline-dialog-border-color: var(--aui-dropdown-border-color);
254
+ --aui-datepicker-panel-bg-color: #FFFFFF;
255
+ --aui-datepicker-panel-divider-color: #DFE1E6;
256
+ --aui-datepicker-heading-bg-color: #F4F5F7;
257
+ --aui-datepicker-heading-text-color: #344563;
258
+ --aui-datepicker-heading-weekdays-text-color: #5E6C84;
259
+ --aui-datepicker-option-bg-color: transparent;
260
+ --aui-datepicker-option-text-color: #0052CC;
261
+ --aui-datepicker-option-focus-bg-color: #F4F5F7;
262
+ --aui-datepicker-option-focus-text-color: #0052CC;
263
+ --aui-datepicker-option-selected-bg-color: #0052CC;
264
+ --aui-datepicker-option-selected-text-color: #FFFFFF;
265
+ --aui-datepicker-option-unselectable-bg-color: #F4F5F7;
266
+ --aui-datepicker-option-unselectable-text-color: #7A869A;
267
+ --aui-datepicker-disabled-text-color: #7A869A;
268
+ --aui-datepicker-hint-text-color: #505F79;
269
+ }
270
+ html[data-color-mode="light"] body.aui-theme-design-tokens :root {
271
+ color-scheme: light;
272
+ --aui-shadow1: rgba(9, 30, 66, 0.13);
273
+ --aui-shadow2: rgba(9, 30, 66, 0.25);
274
+ --aui-blanket: rgba(23, 43, 77, 0.45);
275
+ --aui-body-text: #172B4D;
276
+ --aui-lesser-body-text: #5E6C84;
277
+ --aui-lesser-header-text: #6B778C;
278
+ --aui-body-background: #F4F5F7;
279
+ --aui-page-background: #FFFFFF;
280
+ --aui-page-border: #DFE1E6;
281
+ --aui-border: #DFE1E6;
282
+ --aui-border-strong: #7A869A;
283
+ --aui-focus: #2684FF;
284
+ --aui-link-color: #0052CC;
285
+ --aui-link-decoration: none;
286
+ --aui-link-hover-color: #0065FF;
287
+ --aui-link-active-color: #0747A6;
288
+ --aui-link-hover-decoration: underline;
289
+ --aui-link-visited-color: #403294;
290
+ --aui-itemheading-text: #5E6C84;
291
+ --aui-item-bg: transparent;
292
+ --aui-item-text: #42526E;
293
+ --aui-item-focus-bg: rgba(9, 30, 66, 0.08);
294
+ --aui-item-focus-text: #42526E;
295
+ --aui-item-active-text: #0052CC;
296
+ --aui-item-active-bg: #DEEBFF;
297
+ --aui-item-selected-bg: var(--aui-item-focus-bg);
298
+ --aui-item-selected-text: var(--aui-item-focus-text);
299
+ --aui-item-disabled-bg: transparent;
300
+ --aui-item-disabled-text: #7A869A;
301
+ --aui-tooltip-bg-color: #172B4D;
302
+ --aui-tooltip-border-color: #172B4D;
303
+ --aui-tooltip-content-text-color: #FFFFFF;
304
+ --aui-tooltip-title-text-color: #FFFFFF;
305
+ --aui-help-color: #5243AA;
306
+ --aui-badge-bg-color: rgba(9, 30, 66, 0.13);
307
+ --aui-badge-text-color: #172B4D;
308
+ --aui-badge-primary-bg-color: #0052CC;
309
+ --aui-badge-primary-text-color: #FFFFFF;
310
+ --aui-badge-added-bg-color: #E3FCEF;
311
+ --aui-badge-addded-text-color: #006644;
312
+ --aui-badge-removed-bg-color: #FFEBE6;
313
+ --aui-badge-removed-text-color: #BF2600;
314
+ --aui-badge-important-bg-color: #DE350B;
315
+ --aui-badge-important-text-color: #FFFFFF;
316
+ --aui-badge-on-blue-text-color: #FFFFFF;
317
+ --aui-badge-on-blue-bg-color: rgba(255, 255, 255, 0.25);
318
+ --aui-avatar-outline: #FFFFFF;
319
+ --aui-avatar-text: #7A869A;
320
+ --aui-lozenge-bg-color: #42526E;
321
+ --aui-lozenge-text-color: #FFFFFF;
322
+ --aui-lozenge-subtle-bg-color: #DFE1E6;
323
+ --aui-lozenge-subtle-text-color: #42526E;
324
+ --aui-lozenge-success-bg-color: #00875A;
325
+ --aui-lozenge-success-text-color: #FFFFFF;
326
+ --aui-lozenge-success-subtle-bg-color: #E3FCEF;
327
+ --aui-lozenge-success-subtle-text-color: #006644;
328
+ --aui-lozenge-current-bg-color: #0052CC;
329
+ --aui-lozenge-current-text-color: #FFFFFF;
330
+ --aui-lozenge-current-subtle-bg-color: #DEEBFF;
331
+ --aui-lozenge-current-subtle-text-color: #0747A6;
332
+ --aui-lozenge-moved-bg-color: #FF991F;
333
+ --aui-lozenge-moved-text-color: #172B4D;
334
+ --aui-lozenge-moved-subtle-bg-color: #FFF0B3;
335
+ --aui-lozenge-moved-subtle-text-color: #172B4D;
336
+ --aui-lozenge-error-bg-color: #BF2600;
337
+ --aui-lozenge-error-text-color: #FFFFFF;
338
+ --aui-lozenge-error-subtle-bg-color: #FFEBE6;
339
+ --aui-lozenge-error-subtle-text-color: #BF2600;
340
+ --aui-lozenge-new-bg-color: #5243AA;
341
+ --aui-lozenge-new-text-color: #FFFFFF;
342
+ --aui-lozenge-new-subtle-bg-color: #EAE6FF;
343
+ --aui-lozenge-new-subtle-text-color: #403294;
344
+ --aui-message-info-bg-color: #DEEBFF;
345
+ --aui-message-info-icon-color: #0052CC;
346
+ --aui-message-info-text-color: #344563;
347
+ --aui-message-success-bg-color: #E3FCEF;
348
+ --aui-message-success-icon-color: #00875A;
349
+ --aui-message-success-text-color: #344563;
350
+ --aui-message-warning-bg-color: #FFFAE6;
351
+ --aui-message-warning-icon-color: #FF991F;
352
+ --aui-message-warning-text-color: #344563;
353
+ --aui-message-error-bg-color: #FFEBE6;
354
+ --aui-message-error-icon-color: #DE350B;
355
+ --aui-message-error-text-color: #344563;
356
+ --aui-message-change-bg-color: #EAE6FF;
357
+ --aui-message-change-icon-color: #5243AA;
358
+ --aui-message-change-text-color: #344563;
359
+ --aui-banner-error-bg-color: #DE350B;
360
+ --aui-banner-error-text-color: #FFFFFF;
361
+ --aui-flag-bg-color: var(--aui-dropdown-bg-color);
362
+ --aui-flag-info-color: #0052CC;
363
+ --aui-flag-success-color: #36B37E;
364
+ --aui-flag-warning-color: #FFAB00;
365
+ --aui-flag-error-color: #FF5630;
366
+ --aui-button-default-bg-color: rgba(9, 30, 66, 0.08);
367
+ --aui-button-default-text-color: #344563;
368
+ --aui-button-default-hover-bg-color: rgba(9, 30, 66, 0.13);
369
+ --aui-button-default-active-bg-color: #DEEBFF;
370
+ --aui-button-default-active-text-color: #0052CC;
371
+ --aui-button-default-selected-bg-color: #344563;
372
+ --aui-button-default-selected-text-color: #FFFFFF;
373
+ --aui-button-default-disabled-bg-color: rgba(9, 30, 66, 0.04);
374
+ --aui-button-default-disabled-text-color: #A5ADBA;
375
+ --aui-button-primary-bg-color: #0052CC;
376
+ --aui-button-primary-text-color: #FFFFFF;
377
+ --aui-button-primary-hover-bg-color: #0065FF;
378
+ --aui-button-primary-active-bg-color: #0052CC;
379
+ --aui-button-primary-active-text-color: #FFFFFF;
380
+ --aui-button-primary-disabled-bg-color: var(--aui-button-default-disabled-bg-color);
381
+ --aui-button-primary-disabled-text-color: var(--aui-button-default-disabled-text-color);
382
+ --aui-button-light-bg-color: #FFFFFF;
383
+ --aui-button-subtle-text-color: #344563;
384
+ --aui-label-text-color: inherit;
385
+ --aui-label-link-color: inherit;
386
+ --aui-label-bg-color: #F4F5F7;
387
+ --aui-label-hover-bg-color: #F4F5F7;
388
+ --aui-label-close-hover-bg-color: #FFBDAD;
389
+ --aui-label-close-hover-text-color: #172B4D;
390
+ --aui-form-placeholder-text-color: #5E6C84;
391
+ --aui-form-placeholder-disabled-text-color: #A5ADBA;
392
+ --aui-form-label-text-color: #6B778C;
393
+ --aui-form-error-text-color: #DE350B;
394
+ --aui-form-description-text-color: #6B778C;
395
+ --aui-form-disabled-field-bg-color: #F4F5F7;
396
+ --aui-form-disabled-field-text-color: #97A0AF;
397
+ --aui-form-disabled-field-label-color: #97A0AF;
398
+ --aui-form-field-border-color: #DFE1E6;
399
+ --aui-form-field-hover-border-color: #DFE1E6;
400
+ --aui-form-field-default-text-color: #172B4D;
401
+ --aui-form-field-default-bg-color: #FAFBFC;
402
+ --aui-form-field-hover-text-color: var(--aui-form-field-default-text-color);
403
+ --aui-form-field-hover-bg-color: #EBECF1;
404
+ --aui-form-field-focus-bg-color: #FFFFFF;
405
+ --aui-form-select-bg-color: #EBECF1;
406
+ --aui-form-select-border-color: #EBECF1;
407
+ --aui-form-select-hover-bg-color: #DFE1E6;
408
+ --aui-form-checkbox-radio-active-bg-color: #DEEBFF;
409
+ --aui-form-optgroup-text-color: #7A869A;
410
+ --aui-form-optgroup-bg-color: #F4F5F7;
411
+ --aui-form-option-bg-color: #FFFFFF;
412
+ --aui-form-pre-bg-color: #F4F5F7;
413
+ --aui-form-field-autofilled-bg-color: #EAE6FF;
414
+ --aui-form-field-autofilled-border-color: #6554C0;
415
+ --aui-form-field-autofilled-text-color: #403294;
416
+ --aui-form-glyph-disabled-icon-color: #A5ADBA;
417
+ --aui-form-glyph-disabled-fill-color: rgba(9, 30, 66, 0.04);
418
+ --aui-form-glyph-icon-color: #FFFFFF;
419
+ --aui-form-glyph-fill-color: #0052CC;
420
+ --aui-form-checkbox-active-bg-color: #DEEBFF;
421
+ --aui-form-checkbox-active-border-color: #DEEBFF;
422
+ --aui-form-checkbox-active-icon-color: #0052CC;
423
+ --aui-form-radio-unchecked-bg-color: #FAFBFC;
424
+ --aui-form-radio-unchecked-border-color: #DFE1E6;
425
+ --aui-toggle-default-bg-color: #6B778C;
426
+ --aui-toggle-default-bg-hover-color: #A5ADBA;
427
+ --aui-toggle-button-color: #FFFFFF;
428
+ --aui-toggle-on-color: #00875A;
429
+ --aui-toggle-on-hover-color: #36B37E;
430
+ --aui-toggle-disabled-overlay-color: rgba(255, 255, 255, 0.5);
431
+ --aui-toggle-tick-color: #FFFFFF;
432
+ --aui-toggle-cross-color: #FFFFFF;
433
+ --aui-form-notification-info-color: #97A0AF;
434
+ --aui-form-notification-error-color: var(--aui-message-error-icon-color);
435
+ --aui-form-notification-success-color: var(--aui-message-success-icon-color);
436
+ --aui-progressbar-color: #42526E;
437
+ --aui-progressbar-track-color: rgba(9, 30, 66, 0.13);
438
+ --aui-spinner-color: #42526E;
439
+ --aui-nav-pagination-text-color: #172B4D;
440
+ --aui-nav-pagination-active-text-color: #97A0AF;
441
+ --aui-appheader-bg-color: #0747A6;
442
+ --aui-appheader-text-color: #DEEBFF;
443
+ --aui-appheader-item-focus-bg-color: rgba(9, 30, 66, 0.48);
444
+ --aui-appheader-item-focus-text-color: #DEEBFF;
445
+ --aui-appheader-item-active-bg-color: rgba(9, 30, 66, 0.48);
446
+ --aui-appheader-item-active-text-color: #DEEBFF;
447
+ --aui-appheader-quicksearch-bg-color: rgba(9, 30, 66, 0.48);
448
+ --aui-appheader-quicksearch-border-color: transparent;
449
+ --aui-appheader-quicksearch-text-color: #DEEBFF;
450
+ --aui-appheader-quicksearch-placeholder-text-color: #97A0AF;
451
+ --aui-appheader-quicksearch-focus-bg-color: var(--aui-appheader-quicksearch-bg-color);
452
+ --aui-appheader-quicksearch-focus-text-color: #DEEBFF;
453
+ --aui-sidebar-icon-color: #505F79;
454
+ --aui-sidebar-toggle-icon-color: #505F79;
455
+ --aui-sidebar-bg-color: #F4F5F7;
456
+ --aui-sidebar-dropdown-arrow-color: #505F79;
457
+ --aui-sidebar-tooltip-bg-color: rgba(9, 30, 66, 0.95);
458
+ --aui-sidebar-badge-bg-color: #C1C7D0;
459
+ --aui-sidebar-badge-text-color: inherit;
460
+ --aui-tabs-tab-border-color: #EBECF1;
461
+ --aui-tabs-tab-text-color: #42526E;
462
+ --aui-tabs-tab-hover-text-color: #4C9AFF;
463
+ --aui-tabs-tab-active-border-color: #0052CC;
464
+ --aui-tabs-tab-active-text-color: #0052CC;
204
465
  --aui-progress-tracker-current-step-color: #0065FF;
205
466
  --aui-progress-tracker-current-step-text-color: var(--aui-progress-tracker-visited-step-text-color);
206
467
  --aui-progress-tracker-visited-step-text-color: #172B4D;
@@ -332,6 +593,272 @@ input[type="reset"] {
332
593
  display: none !important;
333
594
  }
334
595
 
596
+ body.aui-theme-design-tokens {
597
+ --aui-shadow1: var(--ds-border);
598
+ --aui-shadow2: var(--ds-background-neutral-pressed);
599
+ --aui-blanket: var(--ds-blanket);
600
+ --aui-body-text: var(--ds-text);
601
+ --aui-lesser-body-text: var(--ds-text-subtlest);
602
+ --aui-lesser-header-text: var(--ds-text-subtlest);
603
+ --aui-body-background: var(--ds-surface);
604
+ --aui-page-background: var(--ds-surface);
605
+ --aui-page-border: var(--ds-border);
606
+ --aui-border: var(--ds-border);
607
+ --aui-border-strong: var(--ds-border-accent-gray);
608
+ --aui-focus: var(--ds-border-focused);
609
+ --aui-link-color: var(--ds-link);
610
+ --aui-link-decoration: none;
611
+ --aui-link-hover-color: var(--ds-link);
612
+ --aui-link-active-color: var(--ds-link-pressed);
613
+ --aui-link-hover-decoration: underline;
614
+ --aui-link-visited-color: var(--ds-link-pressed);
615
+ --aui-itemheading-text: var(--ds-text-subtle);
616
+ --aui-item-bg: transparent;
617
+ --aui-item-text: var(--ds-text-subtlest);
618
+ --aui-item-focus-bg: var(--ds-background-accent-gray-subtler);
619
+ --aui-item-focus-text: var(--ds-text-subtle);
620
+ --aui-item-active-text: var(--ds-text-subtle);
621
+ --aui-item-active-bg: var(--ds-background-selected);
622
+ --aui-item-selected-bg: var(--aui-item-focus-bg);
623
+ --aui-item-selected-text: var(--aui-item-focus-text);
624
+ --aui-item-disabled-bg: transparent;
625
+ --aui-item-disabled-text: var(--ds-text-disabled);
626
+ --aui-tooltip-bg-color: var(--ds-background-neutral-bold);
627
+ --aui-tooltip-border-color: var(--ds-background-neutral-bold);
628
+ --aui-tooltip-content-text-color: var(--ds-text-inverse);
629
+ --aui-tooltip-title-text-color: var(--ds-text-inverse);
630
+ --aui-help-color: var(--ds-border-discovery);
631
+ --aui-badge-bg-color: var(--ds-background-accent-gray-subtler);
632
+ --aui-badge-text-color: var(--ds-text-accent-gray);
633
+ --aui-badge-primary-bg-color: var(--ds-background-information-bold);
634
+ --aui-badge-primary-text-color: var(--ds-text-inverse);
635
+ --aui-badge-added-bg-color: var(--ds-background-accent-green-subtlest);
636
+ --aui-badge-addded-text-color: var(--ds-text-accent-green);
637
+ --aui-badge-removed-bg-color: var(--ds-background-accent-red-subtlest);
638
+ --aui-badge-removed-text-color: var(--ds-text-accent-red);
639
+ --aui-badge-important-bg-color: var(--ds-background-accent-red-bolder);
640
+ --aui-badge-important-text-color: var(--ds-text-inverse);
641
+ --aui-badge-on-blue-text-color: var(--ds-text-inverse);
642
+ --aui-badge-on-blue-bg-color: var(--ds-background-accent-blue-subtler);
643
+ --aui-avatar-outline: var(--ds-border-inverse);
644
+ --aui-avatar-text: var(--ds-text-inverse);
645
+ --aui-lozenge-bg-color: var(--ds-background-accent-gray-bolder);
646
+ --aui-lozenge-text-color: var(--ds-text-inverse);
647
+ --aui-lozenge-subtle-bg-color: var(--ds-background-accent-gray-subtler);
648
+ --aui-lozenge-subtle-text-color: var(--ds-text-inverse);
649
+ --aui-lozenge-success-bg-color: var(--ds-background-success-bold);
650
+ --aui-lozenge-success-text-color: var(--ds-text-inverse);
651
+ --aui-lozenge-success-subtle-bg-color: var(--ds-background-success);
652
+ --aui-lozenge-success-subtle-text-color: var(--ds-text-success);
653
+ --aui-lozenge-current-bg-color: var(--ds-background-information-bold);
654
+ --aui-lozenge-current-text-color: var(--ds-text-inverse);
655
+ --aui-lozenge-current-subtle-bg-color: var(--ds-background-information);
656
+ --aui-lozenge-current-subtle-text-color: var(--ds-text-information);
657
+ --aui-lozenge-moved-bg-color: var(--ds-background-warning-bold);
658
+ --aui-lozenge-moved-text-color: var(--ds-text-inverse);
659
+ --aui-lozenge-moved-subtle-bg-color: var(--ds-background-warning);
660
+ --aui-lozenge-moved-subtle-text-color: var(--ds-text-warning);
661
+ --aui-lozenge-error-bg-color: var(--ds-background-danger-bold);
662
+ --aui-lozenge-error-text-color: var(--ds-text-inverse);
663
+ --aui-lozenge-error-subtle-bg-color: var(--ds-background-danger);
664
+ --aui-lozenge-error-subtle-text-color: var(--ds-text-danger);
665
+ --aui-lozenge-new-bg-color: var(--ds-background-discovery-bold);
666
+ --aui-lozenge-new-text-color: var(--ds-text-inverse);
667
+ --aui-lozenge-new-subtle-bg-color: var(--ds-background-discovery);
668
+ --aui-lozenge-new-subtle-text-color: var(--ds-text-discovery);
669
+ --aui-message-info-bg-color: var(--ds-background-information);
670
+ --aui-message-info-icon-color: var(--ds-icon-information);
671
+ --aui-message-info-text-color: var(--ds-text);
672
+ --aui-message-success-bg-color: var(--ds-background-success);
673
+ --aui-message-success-icon-color: var(--ds-icon-success);
674
+ --aui-message-success-text-color: var(--ds-text);
675
+ --aui-message-warning-bg-color: var(--ds-background-warning);
676
+ --aui-message-warning-icon-color: var(--ds-icon-warning);
677
+ --aui-message-warning-text-color: var(--ds-text);
678
+ --aui-message-error-bg-color: var(--ds-background-danger);
679
+ --aui-message-error-icon-color: var(--ds-icon-danger);
680
+ --aui-message-error-text-color: var(--ds-text);
681
+ --aui-message-change-bg-color: var(--ds-background-discovery);
682
+ --aui-message-change-icon-color: var(--ds-icon-discovery);
683
+ --aui-message-change-text-color: var(--ds-text);
684
+ --aui-banner-error-bg-color: var(--ds-background-danger-bold);
685
+ --aui-banner-error-text-color: var(--ds-text-inverse);
686
+ --aui-flag-bg-color: var(--aui-dropdown-bg-color);
687
+ --aui-flag-info-color: var(--ds-icon-information);
688
+ --aui-flag-success-color: var(--ds-icon-success);
689
+ --aui-flag-warning-color: var(--ds-icon-warning);
690
+ --aui-flag-error-color: var(--ds-icon-danger);
691
+ --aui-button-default-bg-color: var(--ds-background-neutral);
692
+ --aui-button-default-text-color: var(--ds-text);
693
+ --aui-button-default-hover-bg-color: var(--ds-background-neutral-hovered);
694
+ --aui-button-default-active-bg-color: var(--ds-background-selected);
695
+ --aui-button-default-active-text-color: var(--ds-text-selected);
696
+ --aui-button-default-selected-bg-color: var(--ds-background-selected-bold-pressed);
697
+ --aui-button-default-selected-text-color: var(--ds-text-inverse);
698
+ --aui-button-default-disabled-bg-color: var(--ds-background-disabled);
699
+ --aui-button-default-disabled-text-color: var(--ds-text-disabled);
700
+ --aui-button-primary-bg-color: var(--ds-background-brand-bold);
701
+ --aui-button-primary-text-color: var(--ds-text-inverse);
702
+ --aui-button-primary-hover-bg-color: var(--ds-background-brand-bold-hovered);
703
+ --aui-button-primary-active-bg-color: var(--ds-background-selected-bold-pressed);
704
+ --aui-button-primary-active-text-color: var(--ds-text-inverse);
705
+ --aui-button-primary-disabled-bg-color: var(--aui-button-default-disabled-bg-color);
706
+ --aui-button-primary-disabled-text-color: var(--aui-button-default-disabled-text-color);
707
+ --aui-button-light-bg-color: var(--ds-background-input);
708
+ --aui-button-subtle-text-color: var(--ds-text);
709
+ --aui-label-text-color: var(--ds-text);
710
+ --aui-label-link-color: var(--ds-link);
711
+ --aui-label-bg-color: var(--ds-background-neutral);
712
+ --aui-label-hover-bg-color: var(--ds-background-neutral);
713
+ --aui-label-close-hover-bg-color: var(--ds-background-accent-red-subtle);
714
+ --aui-label-close-hover-text-color: var(--ds-icon-accent-gray);
715
+ --aui-form-placeholder-text-color: var(--ds-text-subtlest);
716
+ --aui-form-placeholder-disabled-text-color: var(--ds-text-disabled);
717
+ --aui-form-label-text-color: var(--ds-text-subtle);
718
+ --aui-form-error-text-color: var(--ds-text-danger);
719
+ --aui-form-description-text-color: var(--ds-text-subtlest);
720
+ --aui-form-disabled-field-bg-color: var(--ds-text-disabled);
721
+ --aui-form-disabled-field-text-color: var(--ds-text-subtlest);
722
+ --aui-form-disabled-field-label-color: var(--ds-text-subtle);
723
+ --aui-form-field-border-color: var(--ds-border-input);
724
+ --aui-form-field-hover-border-color: var(--ds-border-focused);
725
+ --aui-form-field-default-text-color: var(--ds-text);
726
+ --aui-form-field-default-bg-color: var(--ds-background-input);
727
+ --aui-form-field-hover-text-color: var(--ds-text);
728
+ --aui-form-field-hover-bg-color: var(--ds-background-input-hovered);
729
+ --aui-form-field-focus-bg-color: var(--ds-background-input);
730
+ --aui-form-select-bg-color: var(--ds-background-input);
731
+ --aui-form-select-border-color: var(--ds-border-input);
732
+ --aui-form-select-hover-bg-color: var(--ds-border-input);
733
+ --aui-form-checkbox-radio-active-bg-color: var(--ds-background-accent-blue-subtler);
734
+ --aui-form-optgroup-text-color: var(--ds-text-subtlest);
735
+ --aui-form-optgroup-bg-color: var(--ds-background-neutral);
736
+ --aui-form-option-bg-color: var(--ds-background-input);
737
+ --aui-form-pre-bg-color: var(--ds-background-neutral);
738
+ --aui-form-field-autofilled-bg-color: var(--ds-background-discovery);
739
+ --aui-form-field-autofilled-border-color: var(--ds-border-discovery);
740
+ --aui-form-field-autofilled-text-color: var(--ds-text-discovery);
741
+ --aui-form-glyph-disabled-icon-color: var(--ds-icon-disabled);
742
+ --aui-form-glyph-disabled-fill-color: var(--ds-background-disabled);
743
+ --aui-form-glyph-icon-color: var(--ds-icon-inverse);
744
+ --aui-form-glyph-fill-color: var(--ds-icon-accent-blue);
745
+ --aui-form-checkbox-active-bg-color: var(--ds-background-accent-blue-subtler);
746
+ --aui-form-checkbox-active-border-color: var(--ds-border-accent-blue);
747
+ --aui-form-checkbox-active-icon-color: var(--ds-icon-information);
748
+ --aui-form-radio-unchecked-bg-color: var(--ds-background-input);
749
+ --aui-form-radio-unchecked-border-color: var(--ds-border-input);
750
+ --aui-toggle-default-bg-color: var(--ds-background-neutral-bold);
751
+ --aui-toggle-default-bg-hover-color: var(--ds-background-neutral-bold-hovered);
752
+ --aui-toggle-button-color: var(--ds-icon-inverse);
753
+ --aui-toggle-on-color: var(--ds-background-success-bold);
754
+ --aui-toggle-on-hover-color: var(--ds-background-success-bold-hovered);
755
+ --aui-toggle-disabled-overlay-color: var(--ds-background-neutral-subtle);
756
+ --aui-toggle-tick-color: var(--ds-icon-inverse);
757
+ --aui-toggle-cross-color: var(--ds-icon-inverse);
758
+ --aui-form-notification-info-color: var(--ds-icon-subtle);
759
+ --aui-form-notification-error-color: var(--aui-message-error-icon-color);
760
+ --aui-form-notification-success-color: var(--aui-message-success-icon-color);
761
+ --aui-progressbar-color: var(--ds-background-neutral-bold);
762
+ --aui-progressbar-track-color: var(--ds-background-neutral);
763
+ --aui-spinner-color: var(--ds-icon-subtle);
764
+ --aui-nav-pagination-text-color: var(--ds-text);
765
+ --aui-nav-pagination-active-text-color: var(--ds-text-subtlest);
766
+ --aui-appheader-bg-color: var(--ds-surface);
767
+ --aui-appheader-text-color: var(--ds-text);
768
+ --aui-appheader-item-focus-bg-color: var(--ds-background-neutral-hovered);
769
+ --aui-appheader-item-focus-text-color: var(--ds-text);
770
+ --aui-appheader-item-active-bg-color: var(--ds-background-neutral-subtle-pressed);
771
+ --aui-appheader-item-active-text-color: var(--ds-text);
772
+ --aui-appheader-quicksearch-bg-color: var(--ds-border-input);
773
+ --aui-appheader-quicksearch-border-color: var(--ds-border-input);
774
+ --aui-appheader-quicksearch-text-color: var(--ds-text-subtlest);
775
+ --aui-appheader-quicksearch-placeholder-text-color: var(--ds-text);
776
+ --aui-appheader-quicksearch-focus-bg-color: var(--aui-appheader-quicksearch-bg-color);
777
+ --aui-appheader-quicksearch-focus-text-color: var(--ds-text-subtlest);
778
+ --aui-sidebar-icon-color: var(--ds-icon);
779
+ --aui-sidebar-toggle-icon-color: var(--ds-icon);
780
+ --aui-sidebar-bg-color: var(--ds-surface-sunken);
781
+ --aui-sidebar-dropdown-arrow-color: var(--ds-icon);
782
+ --aui-sidebar-tooltip-bg-color: var(--ds-icon);
783
+ --aui-sidebar-badge-bg-color: var(--ds-background-accent-gray-subtler);
784
+ --aui-sidebar-badge-text-color: var(--ds-text);
785
+ --aui-tabs-tab-border-color: var(--ds-border);
786
+ --aui-tabs-tab-text-color: var(--ds-text-selected);
787
+ --aui-tabs-tab-hover-text-color: var(--ds-text-selected);
788
+ --aui-tabs-tab-active-border-color: var(--ds-border-accent-blue);
789
+ --aui-tabs-tab-active-text-color: var(--ds-text-selected);
790
+ --aui-progress-tracker-current-step-color: var(--ds-background-brand-bold);
791
+ --aui-progress-tracker-current-step-text-color: var(--aui-progress-tracker-visited-step-text-color);
792
+ --aui-progress-tracker-visited-step-text-color: var(--ds-text);
793
+ --aui-progress-tracker-visited-step-hover-text-color: var(--ds-link);
794
+ --aui-progress-tracker-visited-step-active-text-color: var(--ds-link);
795
+ --aui-progress-tracker-future-step-color: var(--ds-icon-subtle);
796
+ --aui-progress-tracker-future-step-text-color: var(--ds-text-subtle);
797
+ --aui-table-row-bg-color: var(--ds-background-neutral-subtle);
798
+ --aui-table-row-text-color: var(--ds-text);
799
+ --aui-table-header-bg-color: var(--ds-background-neutral-subtle);
800
+ --aui-table-heading-text-color: var(--ds-text-subtle);
801
+ --aui-table-border-color: var(--ds-border);
802
+ --aui-table-caption-bg-color: var(--ds-background-accent-gray-subtlest);
803
+ --aui-table-caption-text-color: var(--ds-text-subtle);
804
+ --aui-table-list-row-hover-color: var(--ds-background-neutral-subtle-hovered);
805
+ --aui-table-list-row-subtle-color: var(--ds-background-neutral-subtle-hovered);
806
+ --aui-table-sortable-hover-bg-color: var(--ds-background-neutral-subtle-hovered);
807
+ --aui-table-sortable-active-bg-color: var(--ds-background-accent-blue-subtler);
808
+ --aui-table-sortable-active-border-color: var(--ds-border-accent-blue);
809
+ --aui-table-sortable-active-text-color: var(--ds-text-accent-blue);
810
+ --aui-table-sortable-selected-bg-color: var(--ds-background-neutral-subtle);
811
+ --aui-table-sortable-selected-border-color: var(--ds-border-accent-gray);
812
+ --aui-table-sortable-selected-text-color: var(--ds-text);
813
+ --aui-restfultable-row-focused-border-color: var(--ds-border);
814
+ --aui-restfultable-row-create-border-color: var(--ds-border-disabled);
815
+ --aui-restfultable-row-editable-hover-bg-color: var(--aui-form-field-hover-bg-color);
816
+ --aui-restfultable-error-text-color: var(--aui-form-notification-error-color);
817
+ --aui-restfultable-header-row-bg-color: var(--ds-surface);
818
+ --aui-restfultable-header-row-text-color: var(--ds-text-subtlest);
819
+ --aui-restfultable-row-moving-bg-color: var(--ds-surface-raised);
820
+ --aui-restfultable-editable-em-text-color: var(--ds-text-subtlest);
821
+ --aui-restfultable-row-active-bg-color: var(--ds-background-neutral-subtle-pressed);
822
+ --aui-restfultable-row-hover-bg-color: var(--ds-background-input-hovered);
823
+ --aui-dropdown-bg-color: var(--ds-surface);
824
+ --aui-dropdown-border-color: var(--ds-border);
825
+ --aui-select2-placeholder-text-color: var(--ds-text-subtlest);
826
+ --aui-select2-chosen-bg-color: var(--ds-background-neutral);
827
+ --aui-select2-chosen-text-color: var(--ds-text);
828
+ --aui-select2-chosen-hover-bg-color: var(--ds-background-neutral-hovered);
829
+ --aui-select2-chosen-hover-text-color: var(--ds-text);
830
+ --aui-select2-active-chosen-bg-color: var(--ds-background-neutral);
831
+ --aui-select2-active-chosen-text-color: var(--ds-text);
832
+ --aui-select2-field-default-bg-color: var(--ds-background-input);
833
+ --aui-select2-field-border-color: var(--ds-border-input);
834
+ --aui-select2-field-hover-bg-color: var(--ds-border-focused);
835
+ --aui-select2-drop-bg-color: var(--ds-surface);
836
+ --aui-dialog-bg-color: var(--ds-surface-overlay);
837
+ --aui-dialog-border-color: var(--ds-border);
838
+ --aui-dialog-header-bg-color: var(--aui-dialog-bg-color);
839
+ --aui-dialog-header-warning-bg-color: var(--ds-background-danger-bold);
840
+ --aui-dialog-header-warning-text-color: var(--ds-text-inverse);
841
+ --aui-dialog-button-hover-border-color: var(--ds-border);
842
+ --aui-dialog-footer-hint-text-color: var(--ds-text-subtlest);
843
+ --aui-inline-dialog-bg-color: var(--aui-dropdown-bg-color);
844
+ --aui-inline-dialog-border-color: var(--aui-dropdown-border-color);
845
+ --aui-datepicker-panel-bg-color: var(--ds-background-input);
846
+ --aui-datepicker-panel-divider-color: var(--ds-border);
847
+ --aui-datepicker-heading-bg-color: var(--ds-background-information);
848
+ --aui-datepicker-heading-text-color: var(--ds-text);
849
+ --aui-datepicker-heading-weekdays-text-color: var(--ds-text-subtle);
850
+ --aui-datepicker-option-bg-color: var(--ds-background-neutral-subtle);
851
+ --aui-datepicker-option-text-color: var(--ds-text-selected);
852
+ --aui-datepicker-option-focus-bg-color: var(--ds-background-neutral-subtle-hovered);
853
+ --aui-datepicker-option-focus-text-color: var(--ds-text-accent-blue);
854
+ --aui-datepicker-option-selected-bg-color: var(--ds-background-selected-bold);
855
+ --aui-datepicker-option-selected-text-color: var(--ds-text-inverse);
856
+ --aui-datepicker-option-unselectable-bg-color: var(--ds-background-disabled);
857
+ --aui-datepicker-option-unselectable-text-color: var(--ds-text-disabled);
858
+ --aui-datepicker-disabled-text-color: var(--ds-text-disabled);
859
+ --aui-datepicker-hint-text-color: var(--ds-text-subtlest);
860
+ }
861
+
335
862
  .aui-browser-focus button::-moz-focus-inner,
336
863
  .aui-browser-focus input::-moz-focus-inner {
337
864
  border: 0;