@nova-design-system/nova-base 3.13.0 → 3.14.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.
- package/assets/icons/icon-sprite.svg +1 -1
- package/dist/css/ocean.css +68 -36
- package/dist/css/spark.css +71 -39
- package/dist/js/ocean_dark.d.ts +34 -18
- package/dist/js/ocean_dark.js +34 -18
- package/dist/js/ocean_light.d.ts +34 -18
- package/dist/js/ocean_light.js +34 -18
- package/dist/js/spark_dark.d.ts +34 -18
- package/dist/js/spark_dark.js +37 -21
- package/dist/js/spark_light.d.ts +34 -18
- package/dist/js/spark_light.js +34 -18
- package/package.json +1 -1
- package/dist/css/mccs.css +0 -1840
- package/dist/js/mccs_dark.d.ts +0 -582
- package/dist/js/mccs_dark.js +0 -582
- package/dist/js/mccs_light.d.ts +0 -582
- package/dist/js/mccs_light.js +0 -582
package/dist/css/ocean.css
CHANGED
|
@@ -20,13 +20,8 @@
|
|
|
20
20
|
--components-list-native-background: #565558;
|
|
21
21
|
--components-form-opacity-disabled: 50%;
|
|
22
22
|
--components-form-opacity-default: 100%;
|
|
23
|
-
--components-datagrid-body-subtext: #00b4ff;
|
|
24
|
-
--components-datagrid-body-text: #ff0000;
|
|
25
|
-
--components-datagrid-header-text: #ff0000;
|
|
26
23
|
--components-button-gr-as-complementary-border-hover: rgba(255, 255, 255, 0);
|
|
27
24
|
--components-button-gr-as-complementary-border: rgba(255, 255, 255, 0);
|
|
28
|
-
--components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
|
|
29
|
-
--components-button-lower-border-2: rgba(255, 255, 255, 0);
|
|
30
25
|
--components-button-lower-border-hover: rgba(255, 255, 255, 0);
|
|
31
26
|
--components-button-lower-border-active: rgba(255, 255, 255, 0);
|
|
32
27
|
--components-button-lower-border: rgba(255, 255, 255, 0);
|
|
@@ -72,11 +67,21 @@
|
|
|
72
67
|
--color-white: #ffffff;
|
|
73
68
|
--color-black: #000000;
|
|
74
69
|
--color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
|
|
70
|
+
--components-toggle-shape-hover: var(--color-gray-ocean-300);
|
|
71
|
+
--components-toggle-shape-default: var(--color-gray-ocean-400);
|
|
72
|
+
--components-toggle-background-disabled-checked: var(--color-gray-ocean-600);
|
|
73
|
+
--components-toggle-background-disabled: var(--color-gray-ocean-600);
|
|
74
|
+
--components-toggle-border-disabled-checked: var(--color-gray-ocean-600);
|
|
75
|
+
--components-toggle-border-disabled: var(--color-gray-ocean-600);
|
|
76
|
+
--components-toggle-border-hover: var(--color-gray-ocean-300);
|
|
77
|
+
--components-toggle-border-default: var(--color-gray-ocean-400);
|
|
75
78
|
--components-tooltip-border: var(--color-gray-ocean-50);
|
|
76
79
|
--components-tooltip-background: var(--color-gray-ocean-50);
|
|
77
80
|
--components-popover-background: var(--color-gray-ocean-900);
|
|
78
81
|
--components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
|
|
79
82
|
--components-field-time-background-default: var(--color-interaction-container-neutral-background);
|
|
83
|
+
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
84
|
+
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
80
85
|
--components-overlay-background: var(--color-gray-ocean-650);
|
|
81
86
|
--components-button-destructive-high-icon-hover: var(--color-base-black);
|
|
82
87
|
--components-button-destructive-high-icon: var(--color-base-black);
|
|
@@ -110,8 +115,6 @@
|
|
|
110
115
|
--components-form-shape-background-hover: var(--color-gray-ocean-350);
|
|
111
116
|
--components-form-shape-background-default: var(--color-gray-ocean-400);
|
|
112
117
|
--components-form-field-background-checked: var(--color-petrol-500);
|
|
113
|
-
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
114
|
-
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
115
118
|
--components-button-gr-as-complementary-icon-hover: var(--color-base-white);
|
|
116
119
|
--components-button-gr-as-complementary-icon: var(--color-base-white);
|
|
117
120
|
--components-button-gr-as-complementary-text-hover: var(--color-base-white);
|
|
@@ -320,6 +323,12 @@
|
|
|
320
323
|
--color-interaction-container-neutral-border-active: var(--color-petrol-400);
|
|
321
324
|
--color-interaction-container-neutral-background-active: var(--color-petrol-900);
|
|
322
325
|
--components-togglegroup-high-border: var(--color-interaction-container-branded-low-border);
|
|
326
|
+
--components-toggle-shape-hover-checked: var(--color-interaction-container-branded-high-icon);
|
|
327
|
+
--components-toggle-shape-default-checked: var(--color-interaction-container-branded-high-icon);
|
|
328
|
+
--components-toggle-background-hover-checked: var(--color-interaction-container-branded-high-background-hover);
|
|
329
|
+
--components-toggle-background-default-checked: var(--color-interaction-container-branded-high-background);
|
|
330
|
+
--components-toggle-border-hover-checked: var(--color-interaction-container-branded-high-border-hover);
|
|
331
|
+
--components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
|
|
323
332
|
--components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
|
|
324
333
|
--components-tooltip-text: var(--color-content-inverted-high-text);
|
|
325
334
|
--components-slider-handler-border-focus: var(--components-form-field-background-checked);
|
|
@@ -351,10 +360,6 @@
|
|
|
351
360
|
--components-menu-contextual-border: var(--color-content-low-border);
|
|
352
361
|
--components-menu-contextual-background: var(--color-level-00-background);
|
|
353
362
|
--components-calendar-background: var(--color-level-00-background);
|
|
354
|
-
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
355
|
-
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
356
|
-
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
357
|
-
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
358
363
|
--components-calendar-cell-text-today: var(--color-content-high-text);
|
|
359
364
|
--components-calendar-cell-text-outside-month: var(--color-content-lower-text);
|
|
360
365
|
--components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
|
|
@@ -365,11 +370,24 @@
|
|
|
365
370
|
--components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
|
|
366
371
|
--components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
|
|
367
372
|
--components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
|
|
373
|
+
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
374
|
+
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
375
|
+
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
376
|
+
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
368
377
|
--components-calendar-header-text: var(--color-content-high-text);
|
|
369
378
|
--components-calendar-border: var(--color-content-low-border);
|
|
370
379
|
--components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
|
|
371
380
|
--components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
|
|
372
381
|
--components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
|
|
382
|
+
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
383
|
+
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
384
|
+
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
385
|
+
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
386
|
+
--components-datagrid-body-subtext: var(--color-content-low-text);
|
|
387
|
+
--components-datagrid-body-text: var(--color-content-medium-text);
|
|
388
|
+
--components-datagrid-body-border: var(--color-content-low-border);
|
|
389
|
+
--components-datagrid-header-text: var(--color-content-high-text);
|
|
390
|
+
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
373
391
|
--components-buttongroup-low-border: var(--color-interaction-container-branded-low-border);
|
|
374
392
|
--components-buttongroup-medium-border: var(--color-interaction-container-branded-low-border);
|
|
375
393
|
--components-buttongroup-high-background: var(--color-interaction-container-branded-high-background);
|
|
@@ -478,12 +496,6 @@
|
|
|
478
496
|
--components-form-text-label-default: var(--color-content-high-text);
|
|
479
497
|
--components-form-text-info-icon: var(--color-content-medium-text);
|
|
480
498
|
--components-form-text-required: var(--color-feedback-error-low-icon);
|
|
481
|
-
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
482
|
-
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
483
|
-
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
484
|
-
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
485
|
-
--components-datagrid-body-border: var(--color-content-low-border);
|
|
486
|
-
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
487
499
|
--components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
|
|
488
500
|
--components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
|
|
489
501
|
--components-button-medium-text: var(--color-interaction-container-branded-low-text);
|
|
@@ -541,6 +553,10 @@
|
|
|
541
553
|
--components-togglegroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
542
554
|
--components-togglegroup-low-border: var(--color-interaction-container-neutral-border);
|
|
543
555
|
--components-togglegroup-high-background: var(--color-interaction-container-branded-low-background);
|
|
556
|
+
--components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
|
|
557
|
+
--components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
|
|
558
|
+
--components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
559
|
+
--components-toggle-background-default: var(--color-interaction-container-branded-low-background);
|
|
544
560
|
--components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
|
|
545
561
|
--components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
|
|
546
562
|
--components-slider-handler-border-error: var(--components-form-field-background-error);
|
|
@@ -567,6 +583,7 @@
|
|
|
567
583
|
--components-field-time-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
568
584
|
--components-field-time-text-default: var(--color-interaction-container-neutral-text);
|
|
569
585
|
--components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
586
|
+
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
570
587
|
--components-buttongroup-lower-background: var(--color-interaction-container-branded-low-background);
|
|
571
588
|
--components-buttongroup-lower-border: var(--color-interaction-container-neutral-border);
|
|
572
589
|
--components-buttongroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
@@ -574,7 +591,6 @@
|
|
|
574
591
|
--components-breadcrumb-text: var(--color-interaction-link-low-text);
|
|
575
592
|
--components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
576
593
|
--components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
|
|
577
|
-
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
578
594
|
--components-button-medium-background: var(--color-interaction-container-branded-low-background);
|
|
579
595
|
--components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
580
596
|
--components-button-lower-text: var(--color-interaction-container-neutral-text);
|
|
@@ -628,13 +644,8 @@
|
|
|
628
644
|
--components-list-native-background: #565558;
|
|
629
645
|
--components-form-opacity-disabled: 50%;
|
|
630
646
|
--components-form-opacity-default: 100%;
|
|
631
|
-
--components-datagrid-body-subtext: #0000ff;
|
|
632
|
-
--components-datagrid-body-text: #ff0000;
|
|
633
|
-
--components-datagrid-header-text: #ff0000;
|
|
634
647
|
--components-button-gr-as-complementary-border-hover: rgba(255, 255, 255, 0);
|
|
635
648
|
--components-button-gr-as-complementary-border: rgba(255, 255, 255, 0);
|
|
636
|
-
--components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
|
|
637
|
-
--components-button-lower-border-2: rgba(255, 255, 255, 0);
|
|
638
649
|
--components-button-lower-border-hover: rgba(255, 255, 255, 0);
|
|
639
650
|
--components-button-lower-border-active: rgba(255, 255, 255, 0);
|
|
640
651
|
--components-button-lower-border: rgba(255, 255, 255, 0);
|
|
@@ -680,11 +691,21 @@
|
|
|
680
691
|
--color-white: #ffffff;
|
|
681
692
|
--color-black: #000000;
|
|
682
693
|
--color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
|
|
694
|
+
--components-toggle-shape-hover: var(--color-gray-ocean-400);
|
|
695
|
+
--components-toggle-shape-default: var(--color-gray-ocean-300);
|
|
696
|
+
--components-toggle-background-disabled-checked: var(--color-gray-ocean-150);
|
|
697
|
+
--components-toggle-background-disabled: var(--color-gray-ocean-150);
|
|
698
|
+
--components-toggle-border-disabled-checked: var(--color-gray-ocean-150);
|
|
699
|
+
--components-toggle-border-disabled: var(--color-gray-ocean-150);
|
|
700
|
+
--components-toggle-border-hover: var(--color-gray-ocean-400);
|
|
701
|
+
--components-toggle-border-default: var(--color-gray-spark-300);
|
|
683
702
|
--components-tooltip-border: var(--color-gray-ocean-900);
|
|
684
703
|
--components-tooltip-background: var(--color-gray-ocean-900);
|
|
685
704
|
--components-popover-background: var(--color-gray-ocean-00);
|
|
686
705
|
--components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
|
|
687
706
|
--components-field-time-background-default: var(--color-interaction-container-neutral-background);
|
|
707
|
+
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
708
|
+
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
688
709
|
--components-overlay-background: var(--color-gray-ocean-850);
|
|
689
710
|
--components-button-destructive-high-icon-hover: var(--color-base-white);
|
|
690
711
|
--components-button-destructive-high-icon: var(--color-base-white);
|
|
@@ -718,8 +739,6 @@
|
|
|
718
739
|
--components-form-shape-background-hover: var(--color-gray-ocean-100);
|
|
719
740
|
--components-form-shape-background-default: var(--color-gray-ocean-75);
|
|
720
741
|
--components-form-field-background-checked: var(--color-petrol-600);
|
|
721
|
-
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
722
|
-
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
723
742
|
--components-button-gr-as-complementary-icon-hover: var(--color-base-black);
|
|
724
743
|
--components-button-gr-as-complementary-icon: var(--color-base-black);
|
|
725
744
|
--components-button-gr-as-complementary-text-hover: var(--color-base-black);
|
|
@@ -928,6 +947,12 @@
|
|
|
928
947
|
--color-interaction-container-neutral-border-active: var(--color-petrol-700);
|
|
929
948
|
--color-interaction-container-neutral-background-active: var(--color-petrol-50);
|
|
930
949
|
--components-togglegroup-high-border: var(--color-interaction-container-branded-low-border);
|
|
950
|
+
--components-toggle-shape-hover-checked: var(--color-interaction-container-branded-high-icon);
|
|
951
|
+
--components-toggle-shape-default-checked: var(--color-interaction-container-branded-high-icon);
|
|
952
|
+
--components-toggle-background-hover-checked: var(--color-interaction-container-branded-high-background-hover);
|
|
953
|
+
--components-toggle-background-default-checked: var(--color-interaction-container-branded-high-background);
|
|
954
|
+
--components-toggle-border-hover-checked: var(--color-interaction-container-branded-high-border-hover);
|
|
955
|
+
--components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
|
|
931
956
|
--components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
|
|
932
957
|
--components-tooltip-text: var(--color-content-inverted-high-text);
|
|
933
958
|
--components-slider-handler-border-focus: var(--components-form-field-background-checked);
|
|
@@ -959,10 +984,6 @@
|
|
|
959
984
|
--components-menu-contextual-border: var(--color-content-low-border);
|
|
960
985
|
--components-menu-contextual-background: var(--color-level-00-background);
|
|
961
986
|
--components-calendar-background: var(--color-level-00-background);
|
|
962
|
-
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
963
|
-
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
964
|
-
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
965
|
-
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
966
987
|
--components-calendar-cell-text-today: var(--color-content-high-text);
|
|
967
988
|
--components-calendar-cell-text-outside-month: var(--color-content-lower-text);
|
|
968
989
|
--components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
|
|
@@ -973,11 +994,24 @@
|
|
|
973
994
|
--components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
|
|
974
995
|
--components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
|
|
975
996
|
--components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
|
|
997
|
+
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
998
|
+
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
999
|
+
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
1000
|
+
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
976
1001
|
--components-calendar-header-text: var(--color-content-high-text);
|
|
977
1002
|
--components-calendar-border: var(--color-content-low-border);
|
|
978
1003
|
--components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
|
|
979
1004
|
--components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
|
|
980
1005
|
--components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1006
|
+
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
1007
|
+
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
1008
|
+
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
1009
|
+
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1010
|
+
--components-datagrid-body-subtext: var(--color-content-low-text);
|
|
1011
|
+
--components-datagrid-body-text: var(--color-content-medium-text);
|
|
1012
|
+
--components-datagrid-body-border: var(--color-content-low-border);
|
|
1013
|
+
--components-datagrid-header-text: var(--color-content-high-text);
|
|
1014
|
+
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
981
1015
|
--components-buttongroup-low-border: var(--color-interaction-container-branded-low-border);
|
|
982
1016
|
--components-buttongroup-medium-border: var(--color-interaction-container-branded-low-border);
|
|
983
1017
|
--components-buttongroup-high-background: var(--color-interaction-container-branded-high-background);
|
|
@@ -1086,12 +1120,6 @@
|
|
|
1086
1120
|
--components-form-text-label-default: var(--color-content-high-text);
|
|
1087
1121
|
--components-form-text-info-icon: var(--color-content-low-text);
|
|
1088
1122
|
--components-form-text-required: var(--color-feedback-error-low-icon);
|
|
1089
|
-
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
1090
|
-
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
1091
|
-
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
1092
|
-
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1093
|
-
--components-datagrid-body-border: var(--color-content-low-border);
|
|
1094
|
-
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
1095
1123
|
--components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
|
|
1096
1124
|
--components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
|
|
1097
1125
|
--components-button-medium-text: var(--color-interaction-container-branded-low-text);
|
|
@@ -1149,6 +1177,10 @@
|
|
|
1149
1177
|
--components-togglegroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
1150
1178
|
--components-togglegroup-low-border: var(--color-interaction-container-neutral-border);
|
|
1151
1179
|
--components-togglegroup-high-background: var(--color-interaction-container-branded-low-background);
|
|
1180
|
+
--components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
|
|
1181
|
+
--components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
|
|
1182
|
+
--components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1183
|
+
--components-toggle-background-default: var(--color-interaction-container-branded-low-background);
|
|
1152
1184
|
--components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
|
|
1153
1185
|
--components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
|
|
1154
1186
|
--components-slider-handler-border-error: var(--components-form-field-background-error);
|
|
@@ -1175,6 +1207,7 @@
|
|
|
1175
1207
|
--components-field-time-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
1176
1208
|
--components-field-time-text-default: var(--color-interaction-container-neutral-text);
|
|
1177
1209
|
--components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1210
|
+
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1178
1211
|
--components-buttongroup-lower-background: var(--color-interaction-container-branded-low-background);
|
|
1179
1212
|
--components-buttongroup-lower-border: var(--color-interaction-container-neutral-border);
|
|
1180
1213
|
--components-buttongroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
@@ -1182,7 +1215,6 @@
|
|
|
1182
1215
|
--components-breadcrumb-text: var(--color-interaction-link-low-text);
|
|
1183
1216
|
--components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1184
1217
|
--components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
|
|
1185
|
-
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1186
1218
|
--components-button-medium-background: var(--color-interaction-container-branded-low-background);
|
|
1187
1219
|
--components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
1188
1220
|
--components-button-lower-text: var(--color-interaction-container-neutral-text);
|
package/dist/css/spark.css
CHANGED
|
@@ -20,13 +20,8 @@
|
|
|
20
20
|
--components-list-native-background: #565558;
|
|
21
21
|
--components-form-opacity-disabled: 50%;
|
|
22
22
|
--components-form-opacity-default: 100%;
|
|
23
|
-
--components-datagrid-body-subtext: #0000ff;
|
|
24
|
-
--components-datagrid-body-text: #ff0000;
|
|
25
|
-
--components-datagrid-header-text: #ff0000;
|
|
26
23
|
--components-button-gr-as-complementary-border-hover: rgba(255, 255, 255, 0);
|
|
27
24
|
--components-button-gr-as-complementary-border: rgba(255, 255, 255, 0);
|
|
28
|
-
--components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
|
|
29
|
-
--components-button-lower-border-2: rgba(255, 255, 255, 0);
|
|
30
25
|
--components-button-lower-border-hover: rgba(255, 255, 255, 0);
|
|
31
26
|
--components-button-lower-border-active: rgba(255, 255, 255, 0);
|
|
32
27
|
--components-button-lower-border: rgba(255, 255, 255, 0);
|
|
@@ -72,11 +67,22 @@
|
|
|
72
67
|
--color-white: #ffffff;
|
|
73
68
|
--color-black: #000000;
|
|
74
69
|
--color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
|
|
70
|
+
--components-toggle-shape-hover: var(--color-gray-spark-300);
|
|
71
|
+
--components-toggle-shape-default: var(--color-gray-spark-400);
|
|
72
|
+
--components-toggle-background-disabled-checked: var(--color-gray-spark-600);
|
|
73
|
+
--components-toggle-background-disabled: var(--color-gray-spark-600);
|
|
74
|
+
--components-toggle-background-default: var(--color-interaction-container-neutral-background);
|
|
75
|
+
--components-toggle-border-disabled-checked: var(--color-gray-spark-600);
|
|
76
|
+
--components-toggle-border-disabled: var(--color-gray-spark-600);
|
|
77
|
+
--components-toggle-border-hover: var(--color-gray-spark-300);
|
|
78
|
+
--components-toggle-border-default: var(--color-gray-spark-400);
|
|
75
79
|
--components-tooltip-border: var(--color-gray-spark-50);
|
|
76
80
|
--components-tooltip-background: var(--color-gray-spark-50);
|
|
77
81
|
--components-popover-background: var(--color-gray-spark-900);
|
|
78
82
|
--components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
|
|
79
83
|
--components-field-time-background-default: var(--color-interaction-container-neutral-background);
|
|
84
|
+
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
85
|
+
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
80
86
|
--components-overlay-background: var(--color-gray-spark-650);
|
|
81
87
|
--components-button-destructive-high-icon-hover: var(--color-base-black);
|
|
82
88
|
--components-button-destructive-high-icon: var(--color-base-black);
|
|
@@ -104,14 +110,12 @@
|
|
|
104
110
|
--components-list-dropdown-item-background-default: var(--color-interaction-container-neutral-background);
|
|
105
111
|
--components-list-native-item-content-hover: var(--color-base-white);
|
|
106
112
|
--components-list-native-item-content-default: var(--color-base-white);
|
|
107
|
-
--components-form-shape-foreground-default: var(--color-base-
|
|
113
|
+
--components-form-shape-foreground-default: var(--color-base-black);
|
|
108
114
|
--components-form-shape-background-selected: var(--color-orange-500);
|
|
109
115
|
--components-form-shape-background-disabled: var(--color-gray-spark-700);
|
|
110
116
|
--components-form-shape-background-hover: var(--color-gray-spark-350);
|
|
111
117
|
--components-form-shape-background-default: var(--color-gray-spark-400);
|
|
112
118
|
--components-form-field-background-checked: var(--color-orange-500);
|
|
113
|
-
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
114
|
-
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
115
119
|
--components-button-gr-as-complementary-icon-hover: var(--color-base-white);
|
|
116
120
|
--components-button-gr-as-complementary-icon: var(--color-base-white);
|
|
117
121
|
--components-button-gr-as-complementary-text-hover: var(--color-base-white);
|
|
@@ -309,8 +313,8 @@
|
|
|
309
313
|
--color-interaction-container-branded-high-icon-hover: var(--color-base-black);
|
|
310
314
|
--color-interaction-container-branded-high-icon-active: var(--color-base-black);
|
|
311
315
|
--color-interaction-container-branded-high-icon: var(--color-base-black);
|
|
312
|
-
--color-interaction-container-branded-high-border-hover: var(--color-orange-
|
|
313
|
-
--color-interaction-container-branded-high-border-active: var(--color-orange-
|
|
316
|
+
--color-interaction-container-branded-high-border-hover: var(--color-orange-400);
|
|
317
|
+
--color-interaction-container-branded-high-border-active: var(--color-orange-400);
|
|
314
318
|
--color-interaction-container-branded-high-border: var(--color-orange-500);
|
|
315
319
|
--color-interaction-container-branded-high-background-hover: var(--color-orange-400);
|
|
316
320
|
--color-interaction-container-branded-high-background-active: var(--color-orange-400);
|
|
@@ -320,6 +324,12 @@
|
|
|
320
324
|
--color-interaction-container-neutral-border-active: var(--color-orange-400);
|
|
321
325
|
--color-interaction-container-neutral-background-active: var(--color-orange-900);
|
|
322
326
|
--components-togglegroup-high-border: var(--color-interaction-container-branded-low-border);
|
|
327
|
+
--components-toggle-shape-hover-checked: var(--color-interaction-container-branded-high-icon);
|
|
328
|
+
--components-toggle-shape-default-checked: var(--color-interaction-container-branded-high-icon);
|
|
329
|
+
--components-toggle-background-hover-checked: var(--color-interaction-container-branded-high-background-hover);
|
|
330
|
+
--components-toggle-background-default-checked: var(--color-interaction-container-branded-high-background);
|
|
331
|
+
--components-toggle-border-hover-checked: var(--color-interaction-container-branded-high-border-hover);
|
|
332
|
+
--components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
|
|
323
333
|
--components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
|
|
324
334
|
--components-tooltip-text: var(--color-content-inverted-high-text);
|
|
325
335
|
--components-slider-handler-border-focus: var(--components-form-field-background-checked);
|
|
@@ -351,10 +361,6 @@
|
|
|
351
361
|
--components-menu-contextual-border: var(--color-content-low-border);
|
|
352
362
|
--components-menu-contextual-background: var(--color-level-00-background);
|
|
353
363
|
--components-calendar-background: var(--color-level-00-background);
|
|
354
|
-
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
355
|
-
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
356
|
-
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
357
|
-
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
358
364
|
--components-calendar-cell-text-today: var(--color-content-high-text);
|
|
359
365
|
--components-calendar-cell-text-outside-month: var(--color-content-lower-text);
|
|
360
366
|
--components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
|
|
@@ -365,11 +371,24 @@
|
|
|
365
371
|
--components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
|
|
366
372
|
--components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
|
|
367
373
|
--components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
|
|
374
|
+
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
375
|
+
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
376
|
+
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
377
|
+
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
368
378
|
--components-calendar-header-text: var(--color-content-high-text);
|
|
369
379
|
--components-calendar-border: var(--color-content-low-border);
|
|
370
380
|
--components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
|
|
371
381
|
--components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
|
|
372
382
|
--components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
|
|
383
|
+
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
384
|
+
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
385
|
+
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
386
|
+
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
387
|
+
--components-datagrid-body-subtext: var(--color-content-low-text);
|
|
388
|
+
--components-datagrid-body-text: var(--color-content-medium-text);
|
|
389
|
+
--components-datagrid-body-border: var(--color-content-low-border);
|
|
390
|
+
--components-datagrid-header-text: var(--color-content-high-text);
|
|
391
|
+
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
373
392
|
--components-buttongroup-low-border: var(--color-interaction-container-branded-low-border);
|
|
374
393
|
--components-buttongroup-medium-border: var(--color-interaction-container-branded-low-border);
|
|
375
394
|
--components-buttongroup-high-background: var(--color-interaction-container-branded-high-background);
|
|
@@ -478,12 +497,6 @@
|
|
|
478
497
|
--components-form-text-label-default: var(--color-content-high-text);
|
|
479
498
|
--components-form-text-info-icon: var(--color-content-low-text);
|
|
480
499
|
--components-form-text-required: var(--color-feedback-error-low-icon);
|
|
481
|
-
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
482
|
-
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
483
|
-
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
484
|
-
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
485
|
-
--components-datagrid-body-border: var(--color-content-low-border);
|
|
486
|
-
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
487
500
|
--components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
|
|
488
501
|
--components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
|
|
489
502
|
--components-button-medium-text: var(--color-interaction-container-branded-low-text);
|
|
@@ -541,6 +554,9 @@
|
|
|
541
554
|
--components-togglegroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
542
555
|
--components-togglegroup-low-border: var(--color-interaction-container-neutral-border);
|
|
543
556
|
--components-togglegroup-high-background: var(--color-interaction-container-branded-low-background);
|
|
557
|
+
--components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
|
|
558
|
+
--components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
|
|
559
|
+
--components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
544
560
|
--components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
|
|
545
561
|
--components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
|
|
546
562
|
--components-slider-handler-border-error: var(--components-form-field-background-error);
|
|
@@ -567,6 +583,7 @@
|
|
|
567
583
|
--components-field-time-text-hover: var(--color-interaction-container-neutral-icon-hover);
|
|
568
584
|
--components-field-time-text-default: var(--color-interaction-container-neutral-text);
|
|
569
585
|
--components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
586
|
+
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
570
587
|
--components-buttongroup-lower-background: var(--color-interaction-container-branded-low-background);
|
|
571
588
|
--components-buttongroup-lower-border: var(--color-interaction-container-neutral-border);
|
|
572
589
|
--components-buttongroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
@@ -574,7 +591,6 @@
|
|
|
574
591
|
--components-breadcrumb-text: var(--color-interaction-link-low-text);
|
|
575
592
|
--components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
576
593
|
--components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
|
|
577
|
-
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
578
594
|
--components-button-medium-background: var(--color-interaction-container-branded-low-background);
|
|
579
595
|
--components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
580
596
|
--components-button-lower-text: var(--color-interaction-container-neutral-text);
|
|
@@ -628,13 +644,8 @@
|
|
|
628
644
|
--components-list-native-background: #565558;
|
|
629
645
|
--components-form-opacity-disabled: 50%;
|
|
630
646
|
--components-form-opacity-default: 100%;
|
|
631
|
-
--components-datagrid-body-subtext: #0000ff;
|
|
632
|
-
--components-datagrid-body-text: #ff0000;
|
|
633
|
-
--components-datagrid-header-text: #ff0000;
|
|
634
647
|
--components-button-gr-as-complementary-border-hover: rgba(255, 255, 255, 0);
|
|
635
648
|
--components-button-gr-as-complementary-border: rgba(255, 255, 255, 0);
|
|
636
|
-
--components-button-lower-border-hover-2: rgba(255, 255, 255, 0);
|
|
637
|
-
--components-button-lower-border-2: rgba(255, 255, 255, 0);
|
|
638
649
|
--components-button-lower-border-hover: rgba(255, 255, 255, 0);
|
|
639
650
|
--components-button-lower-border-active: rgba(255, 255, 255, 0);
|
|
640
651
|
--components-button-lower-border: rgba(255, 255, 255, 0);
|
|
@@ -678,11 +689,22 @@
|
|
|
678
689
|
--color-white: #ffffff;
|
|
679
690
|
--color-black: #000000;
|
|
680
691
|
--color-interaction-container-neutral-background: rgba(255, 255, 255, 0);
|
|
692
|
+
--components-toggle-shape-hover: var(--color-gray-spark-400);
|
|
693
|
+
--components-toggle-shape-default: var(--color-gray-spark-300);
|
|
694
|
+
--components-toggle-background-disabled-checked: var(--color-gray-spark-150);
|
|
695
|
+
--components-toggle-background-disabled: var(--color-gray-spark-150);
|
|
696
|
+
--components-toggle-background-default: var(--color-interaction-container-neutral-background);
|
|
697
|
+
--components-toggle-border-disabled-checked: var(--color-gray-spark-150);
|
|
698
|
+
--components-toggle-border-disabled: var(--color-gray-spark-150);
|
|
699
|
+
--components-toggle-border-hover: var(--color-gray-spark-400);
|
|
700
|
+
--components-toggle-border-default: var(--color-gray-spark-300);
|
|
681
701
|
--components-tooltip-border: var(--color-gray-spark-900);
|
|
682
702
|
--components-tooltip-background: var(--color-gray-spark-900);
|
|
683
703
|
--components-popover-background: var(--color-gray-spark-00);
|
|
684
704
|
--components-menu-contextual-item-background: var(--color-interaction-container-neutral-background);
|
|
685
705
|
--components-field-time-background-default: var(--color-interaction-container-neutral-background);
|
|
706
|
+
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
707
|
+
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
686
708
|
--components-overlay-background: var(--color-gray-spark-850);
|
|
687
709
|
--components-button-destructive-high-icon-hover: var(--color-base-white);
|
|
688
710
|
--components-button-destructive-high-icon: var(--color-base-white);
|
|
@@ -716,8 +738,6 @@
|
|
|
716
738
|
--components-form-shape-background-hover: var(--color-gray-spark-100);
|
|
717
739
|
--components-form-shape-background-default: var(--color-gray-spark-75);
|
|
718
740
|
--components-form-field-background-checked: var(--color-orange-500);
|
|
719
|
-
--components-datagrid-body-background-default: var(--color-interaction-container-neutral-background);
|
|
720
|
-
--components-datagrid-header-background: var(--color-interaction-container-neutral-background);
|
|
721
741
|
--components-button-gr-as-complementary-icon-hover: var(--color-base-black);
|
|
722
742
|
--components-button-gr-as-complementary-icon: var(--color-base-black);
|
|
723
743
|
--components-button-gr-as-complementary-text-hover: var(--color-base-black);
|
|
@@ -926,6 +946,12 @@
|
|
|
926
946
|
--color-interaction-container-neutral-border-active: var(--color-orange-600);
|
|
927
947
|
--color-interaction-container-neutral-background-active: var(--color-orange-50);
|
|
928
948
|
--components-togglegroup-high-border: var(--color-interaction-container-branded-low-border);
|
|
949
|
+
--components-toggle-shape-hover-checked: var(--color-interaction-container-branded-high-icon);
|
|
950
|
+
--components-toggle-shape-default-checked: var(--color-interaction-container-branded-high-icon);
|
|
951
|
+
--components-toggle-background-hover-checked: var(--color-interaction-container-branded-high-background-hover);
|
|
952
|
+
--components-toggle-background-default-checked: var(--color-interaction-container-branded-high-background);
|
|
953
|
+
--components-toggle-border-hover-checked: var(--color-interaction-container-branded-high-border-hover);
|
|
954
|
+
--components-toggle-border-default-checked: var(--color-interaction-container-branded-high-border);
|
|
929
955
|
--components-tooltip-supporting-text: var(--color-content-inverted-medium-text);
|
|
930
956
|
--components-tooltip-text: var(--color-content-inverted-high-text);
|
|
931
957
|
--components-slider-handler-border-focus: var(--components-form-field-background-checked);
|
|
@@ -957,10 +983,6 @@
|
|
|
957
983
|
--components-menu-contextual-border: var(--color-content-low-border);
|
|
958
984
|
--components-menu-contextual-background: var(--color-level-00-background);
|
|
959
985
|
--components-calendar-background: var(--color-level-00-background);
|
|
960
|
-
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
961
|
-
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
962
|
-
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
963
|
-
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
964
986
|
--components-calendar-cell-text-today: var(--color-content-high-text);
|
|
965
987
|
--components-calendar-cell-text-outside-month: var(--color-content-lower-text);
|
|
966
988
|
--components-calendar-cell-text-in-range: var(--color-interaction-container-branded-low-text-active);
|
|
@@ -970,11 +992,24 @@
|
|
|
970
992
|
--components-calendar-cell-background-hover: var(--color-interaction-container-branded-low-background-hover);
|
|
971
993
|
--components-calendar-cell-background-in-range: var(--color-interaction-container-branded-low-background-active);
|
|
972
994
|
--components-calendar-cell-background-selected: var(--color-interaction-container-branded-high-background-active);
|
|
995
|
+
--components-calendar-weeks-text-hover: var(--color-content-high-text);
|
|
996
|
+
--components-calendar-weeks-text: var(--color-content-high-text);
|
|
997
|
+
--components-calendar-weeks-background-hover: var(--color-level-15-background);
|
|
998
|
+
--components-calendar-weeks-background: var(--color-level-10-background);
|
|
973
999
|
--components-calendar-header-text: var(--color-content-high-text);
|
|
974
1000
|
--components-calendar-border: var(--color-content-low-border);
|
|
975
1001
|
--components-field-time-border-active: var(--color-interaction-container-neutral-icon-active);
|
|
976
1002
|
--components-field-time-text-active: var(--color-interaction-container-neutral-text-active);
|
|
977
1003
|
--components-field-time-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1004
|
+
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
1005
|
+
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
1006
|
+
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
1007
|
+
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1008
|
+
--components-datagrid-body-subtext: var(--color-content-low-text);
|
|
1009
|
+
--components-datagrid-body-text: var(--color-content-medium-text);
|
|
1010
|
+
--components-datagrid-body-border: var(--color-content-low-border);
|
|
1011
|
+
--components-datagrid-header-text: var(--color-content-high-text);
|
|
1012
|
+
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
978
1013
|
--components-buttongroup-low-border: var(--color-interaction-container-branded-low-border);
|
|
979
1014
|
--components-buttongroup-medium-border: var(--color-interaction-container-branded-low-border);
|
|
980
1015
|
--components-buttongroup-high-background: var(--color-interaction-container-branded-high-background);
|
|
@@ -1083,12 +1118,6 @@
|
|
|
1083
1118
|
--components-form-text-label-default: var(--color-content-high-text);
|
|
1084
1119
|
--components-form-text-info-icon: var(--color-content-low-text);
|
|
1085
1120
|
--components-form-text-required: var(--color-feedback-error-low-icon);
|
|
1086
|
-
--components-datagrid-expander-expander-background: var(--color-level-10-background);
|
|
1087
|
-
--components-datagrid-expander-border: var(--color-content-low-border);
|
|
1088
|
-
--components-datagrid-expander-content-background: var(--color-level-00-background);
|
|
1089
|
-
--components-datagrid-body-background-active: var(--color-interaction-container-neutral-background-active);
|
|
1090
|
-
--components-datagrid-body-border: var(--color-content-low-border);
|
|
1091
|
-
--components-datagrid-header-border: var(--color-content-medium-border);
|
|
1092
1121
|
--components-button-medium-text-hover: var(--color-interaction-container-branded-low-text-hover);
|
|
1093
1122
|
--components-button-medium-text-active: var(--color-interaction-container-branded-low-text-active);
|
|
1094
1123
|
--components-button-medium-text: var(--color-interaction-container-branded-low-text);
|
|
@@ -1148,6 +1177,9 @@
|
|
|
1148
1177
|
--components-togglegroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
1149
1178
|
--components-togglegroup-low-border: var(--color-interaction-container-neutral-border);
|
|
1150
1179
|
--components-togglegroup-high-background: var(--color-interaction-container-branded-low-background);
|
|
1180
|
+
--components-toggle-shape-disabled-checked: var(--color-interaction-container-neutral-icon);
|
|
1181
|
+
--components-toggle-shape-disabled: var(--color-interaction-container-neutral-icon);
|
|
1182
|
+
--components-toggle-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1151
1183
|
--components-slider-handler-border-readonly: var(--components-form-field-background-readonly);
|
|
1152
1184
|
--components-slider-handler-border-disabled: var(--components-form-field-background-disabled);
|
|
1153
1185
|
--components-slider-handler-border-error: var(--components-form-field-background-error);
|
|
@@ -1175,6 +1207,7 @@
|
|
|
1175
1207
|
--components-field-time-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
1176
1208
|
--components-field-time-text-default: var(--color-interaction-container-neutral-text);
|
|
1177
1209
|
--components-field-time-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1210
|
+
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1178
1211
|
--components-buttongroup-lower-background: var(--color-interaction-container-branded-low-background);
|
|
1179
1212
|
--components-buttongroup-lower-border: var(--color-interaction-container-neutral-border);
|
|
1180
1213
|
--components-buttongroup-low-background: var(--color-interaction-container-branded-low-background);
|
|
@@ -1182,7 +1215,6 @@
|
|
|
1182
1215
|
--components-breadcrumb-text: var(--color-interaction-link-low-text);
|
|
1183
1216
|
--components-list-dropdown-item-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1184
1217
|
--components-form-shape-foreground-disabled: var(--components-form-shape-border-default);
|
|
1185
|
-
--components-datagrid-body-background-hover: var(--color-interaction-container-neutral-background-hover);
|
|
1186
1218
|
--components-button-medium-background: var(--color-interaction-container-branded-low-background);
|
|
1187
1219
|
--components-button-lower-text-hover: var(--color-interaction-container-neutral-text-hover);
|
|
1188
1220
|
--components-button-lower-text: var(--color-interaction-container-neutral-text);
|
package/dist/js/ocean_dark.d.ts
CHANGED
|
@@ -287,8 +287,6 @@ export const ComponentsButtonLowTextHover : string;
|
|
|
287
287
|
export const ComponentsButtonLowerBorder : string;
|
|
288
288
|
export const ComponentsButtonLowerBorderActive : string;
|
|
289
289
|
export const ComponentsButtonLowerBorderHover : string;
|
|
290
|
-
export const ComponentsButtonLowerBorder2 : string;
|
|
291
|
-
export const ComponentsButtonLowerBorderHover2 : string;
|
|
292
290
|
export const ComponentsButtonLowerBackground : string;
|
|
293
291
|
export const ComponentsButtonLowerBackgroundActive : string;
|
|
294
292
|
export const ComponentsButtonLowerBackgroundHover : string;
|
|
@@ -318,18 +316,6 @@ export const ComponentsButtonMediumIconHover : string;
|
|
|
318
316
|
export const ComponentsButtonMediumText : string;
|
|
319
317
|
export const ComponentsButtonMediumTextActive : string;
|
|
320
318
|
export const ComponentsButtonMediumTextHover : string;
|
|
321
|
-
export const ComponentsDatagridHeaderText : string;
|
|
322
|
-
export const ComponentsDatagridHeaderBorder : string;
|
|
323
|
-
export const ComponentsDatagridHeaderBackground : string;
|
|
324
|
-
export const ComponentsDatagridBodyText : string;
|
|
325
|
-
export const ComponentsDatagridBodySubtext : string;
|
|
326
|
-
export const ComponentsDatagridBodyBorder : string;
|
|
327
|
-
export const ComponentsDatagridBodyBackgroundDefault : string;
|
|
328
|
-
export const ComponentsDatagridBodyBackgroundActive : string;
|
|
329
|
-
export const ComponentsDatagridBodyBackgroundHover : string;
|
|
330
|
-
export const ComponentsDatagridExpanderContentBackground : string;
|
|
331
|
-
export const ComponentsDatagridExpanderBorder : string;
|
|
332
|
-
export const ComponentsDatagridExpanderExpanderBackground : string;
|
|
333
319
|
export const ComponentsFormOpacityDefault : string;
|
|
334
320
|
export const ComponentsFormOpacityDisabled : string;
|
|
335
321
|
export const ComponentsFormTextRequired : string;
|
|
@@ -495,6 +481,18 @@ export const ComponentsButtongroupLowBorder : string;
|
|
|
495
481
|
export const ComponentsButtongroupLowBackground : string;
|
|
496
482
|
export const ComponentsButtongroupLowerBorder : string;
|
|
497
483
|
export const ComponentsButtongroupLowerBackground : string;
|
|
484
|
+
export const ComponentsDatagridHeaderBorder : string;
|
|
485
|
+
export const ComponentsDatagridHeaderText : string;
|
|
486
|
+
export const ComponentsDatagridHeaderBackground : string;
|
|
487
|
+
export const ComponentsDatagridBodyBorder : string;
|
|
488
|
+
export const ComponentsDatagridBodyText : string;
|
|
489
|
+
export const ComponentsDatagridBodySubtext : string;
|
|
490
|
+
export const ComponentsDatagridBodyBackgroundDefault : string;
|
|
491
|
+
export const ComponentsDatagridBodyBackgroundActive : string;
|
|
492
|
+
export const ComponentsDatagridBodyBackgroundHover : string;
|
|
493
|
+
export const ComponentsDatagridExpanderContentBackground : string;
|
|
494
|
+
export const ComponentsDatagridExpanderBorder : string;
|
|
495
|
+
export const ComponentsDatagridExpanderExpanderBackground : string;
|
|
498
496
|
export const ComponentsFieldTimeBackgroundDefault : string;
|
|
499
497
|
export const ComponentsFieldTimeBackgroundHover : string;
|
|
500
498
|
export const ComponentsFieldTimeBackgroundActive : string;
|
|
@@ -504,6 +502,10 @@ export const ComponentsFieldTimeTextActive : string;
|
|
|
504
502
|
export const ComponentsFieldTimeBorderActive : string;
|
|
505
503
|
export const ComponentsCalendarBorder : string;
|
|
506
504
|
export const ComponentsCalendarHeaderText : string;
|
|
505
|
+
export const ComponentsCalendarWeeksBackground : string;
|
|
506
|
+
export const ComponentsCalendarWeeksBackgroundHover : string;
|
|
507
|
+
export const ComponentsCalendarWeeksText : string;
|
|
508
|
+
export const ComponentsCalendarWeeksTextHover : string;
|
|
507
509
|
export const ComponentsCalendarCellBackground : string;
|
|
508
510
|
export const ComponentsCalendarCellBackgroundSelected : string;
|
|
509
511
|
export const ComponentsCalendarCellBackgroundInRange : string;
|
|
@@ -518,10 +520,6 @@ export const ComponentsCalendarCellTextInRange : string;
|
|
|
518
520
|
export const ComponentsCalendarCellTextHover : string;
|
|
519
521
|
export const ComponentsCalendarCellTextOutsideMonth : string;
|
|
520
522
|
export const ComponentsCalendarCellTextToday : string;
|
|
521
|
-
export const ComponentsCalendarWeeksBackground : string;
|
|
522
|
-
export const ComponentsCalendarWeeksBackgroundHover : string;
|
|
523
|
-
export const ComponentsCalendarWeeksText : string;
|
|
524
|
-
export const ComponentsCalendarWeeksTextHover : string;
|
|
525
523
|
export const ComponentsCalendarBackground : string;
|
|
526
524
|
export const ComponentsMenuContextualBackground : string;
|
|
527
525
|
export const ComponentsMenuContextualBorder : string;
|
|
@@ -576,6 +574,24 @@ export const ComponentsTooltipBackground : string;
|
|
|
576
574
|
export const ComponentsTooltipBorder : string;
|
|
577
575
|
export const ComponentsTooltipText : string;
|
|
578
576
|
export const ComponentsTooltipSupportingText : string;
|
|
577
|
+
export const ComponentsToggleBorderDefault : string;
|
|
578
|
+
export const ComponentsToggleBorderDefaultChecked : string;
|
|
579
|
+
export const ComponentsToggleBorderHover : string;
|
|
580
|
+
export const ComponentsToggleBorderHoverChecked : string;
|
|
581
|
+
export const ComponentsToggleBorderDisabled : string;
|
|
582
|
+
export const ComponentsToggleBorderDisabledChecked : string;
|
|
583
|
+
export const ComponentsToggleBackgroundDefault : string;
|
|
584
|
+
export const ComponentsToggleBackgroundDefaultChecked : string;
|
|
585
|
+
export const ComponentsToggleBackgroundHover : string;
|
|
586
|
+
export const ComponentsToggleBackgroundHoverChecked : string;
|
|
587
|
+
export const ComponentsToggleBackgroundDisabled : string;
|
|
588
|
+
export const ComponentsToggleBackgroundDisabledChecked : string;
|
|
589
|
+
export const ComponentsToggleShapeDefault : string;
|
|
590
|
+
export const ComponentsToggleShapeDefaultChecked : string;
|
|
591
|
+
export const ComponentsToggleShapeHover : string;
|
|
592
|
+
export const ComponentsToggleShapeHoverChecked : string;
|
|
593
|
+
export const ComponentsToggleShapeDisabled : string;
|
|
594
|
+
export const ComponentsToggleShapeDisabledChecked : string;
|
|
579
595
|
export const ComponentsTogglegroupHighBorder : string;
|
|
580
596
|
export const ComponentsTogglegroupHighBackground : string;
|
|
581
597
|
export const ComponentsTogglegroupLowBorder : string;
|