@finos/legend-extension-dsl-data-quality 2.1.50 → 2.1.51
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/lib/data-quality-custom-selector.css +2 -2
- package/lib/data-quality-custom-selector.css.map +1 -1
- package/lib/index.css +2 -2
- package/lib/index.css.map +1 -1
- package/lib/package.json +1 -1
- package/package.json +8 -8
- package/style/_data-quality-relation-comparison-editor.scss +30 -30
- package/style/_data-quality-relation-validation-builder.scss +43 -43
- package/style/_data-quality-relation-validation-suggestion-panel.scss +8 -8
- package/style/_data-quality-validation-builder.scss +109 -104
- package/style/_data-quality-validation-gui-editor.scss +20 -20
- package/style/data-quality-custom-selector.scss +11 -11
- package/style/index.scss +14 -14
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
width: 100%;
|
|
32
32
|
display: flex;
|
|
33
33
|
flex-direction: column;
|
|
34
|
-
background: var(--color-
|
|
34
|
+
background: var(--color-bg-app);
|
|
35
35
|
}
|
|
36
36
|
|
|
37
37
|
&__main {
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
@include flexVCenter;
|
|
45
45
|
|
|
46
46
|
height: 3.2rem;
|
|
47
|
-
background: var(--color-
|
|
47
|
+
background: var(--color-bg-panel);
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
&__header__statuses {
|
|
@@ -53,7 +53,7 @@
|
|
|
53
53
|
height: 2.2rem;
|
|
54
54
|
margin-left: 0.5rem;
|
|
55
55
|
padding: 0 0.2rem;
|
|
56
|
-
background: var(--color-
|
|
56
|
+
background: var(--color-bg-panel-header);
|
|
57
57
|
border-radius: 0.2rem;
|
|
58
58
|
}
|
|
59
59
|
|
|
@@ -64,11 +64,11 @@
|
|
|
64
64
|
width: 2.2rem;
|
|
65
65
|
|
|
66
66
|
svg {
|
|
67
|
-
color: var(--color-
|
|
67
|
+
color: var(--color-text-muted);
|
|
68
68
|
}
|
|
69
69
|
|
|
70
70
|
&--action:hover svg {
|
|
71
|
-
color: var(--color-
|
|
71
|
+
color: var(--color-text-muted);
|
|
72
72
|
}
|
|
73
73
|
|
|
74
74
|
&__icon {
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
}
|
|
104
104
|
|
|
105
105
|
&__button[disabled] {
|
|
106
|
-
color: var(--color-
|
|
106
|
+
color: var(--color-text-disabled);
|
|
107
107
|
}
|
|
108
108
|
}
|
|
109
109
|
}
|
|
@@ -116,16 +116,16 @@
|
|
|
116
116
|
border-radius: 0.2rem;
|
|
117
117
|
margin-right: 0.5rem;
|
|
118
118
|
font-weight: 500;
|
|
119
|
-
border: 0.1rem solid var(--color-
|
|
119
|
+
border: 0.1rem solid var(--color-border-strong);
|
|
120
120
|
|
|
121
121
|
&__label {
|
|
122
122
|
font-size: 1.2rem;
|
|
123
|
-
color: var(--color-
|
|
123
|
+
color: var(--color-text-disabled);
|
|
124
124
|
}
|
|
125
125
|
|
|
126
126
|
&__icon {
|
|
127
127
|
margin-left: 1rem;
|
|
128
|
-
color: var(--color-
|
|
128
|
+
color: var(--color-text-disabled);
|
|
129
129
|
}
|
|
130
130
|
|
|
131
131
|
svg {
|
|
@@ -154,11 +154,11 @@
|
|
|
154
154
|
height: 3.4rem;
|
|
155
155
|
min-height: 3.4rem;
|
|
156
156
|
padding-left: 0.5rem;
|
|
157
|
-
color: var(--color-
|
|
157
|
+
color: var(--color-text-secondary);
|
|
158
158
|
font-weight: bold;
|
|
159
|
-
background: var(--color-
|
|
159
|
+
background: var(--color-bg-panel);
|
|
160
160
|
border-radius: 0.2rem 0.2rem 0 0;
|
|
161
|
-
border-top: 0.1rem solid var(--color-
|
|
161
|
+
border-top: 0.1rem solid var(--color-border-default);
|
|
162
162
|
}
|
|
163
163
|
|
|
164
164
|
&__header__title__label {
|
|
@@ -166,24 +166,24 @@
|
|
|
166
166
|
|
|
167
167
|
padding: 0.7rem;
|
|
168
168
|
height: 2.2rem;
|
|
169
|
-
background: var(--color-
|
|
169
|
+
background: var(--color-bg-elevated);
|
|
170
170
|
}
|
|
171
171
|
|
|
172
172
|
&__header__action {
|
|
173
|
-
color: var(--color-
|
|
173
|
+
color: var(--color-text-muted);
|
|
174
174
|
}
|
|
175
175
|
|
|
176
176
|
&__header__action svg {
|
|
177
|
-
color: var(--color-
|
|
177
|
+
color: var(--color-text-muted);
|
|
178
178
|
}
|
|
179
179
|
|
|
180
180
|
&__header__action:hover svg {
|
|
181
|
-
color: var(--color-
|
|
181
|
+
color: var(--color-text-primary);
|
|
182
182
|
}
|
|
183
183
|
|
|
184
184
|
&__header__action[disabled] svg,
|
|
185
185
|
&__header__action[disabled]:hover svg {
|
|
186
|
-
color: var(--color-
|
|
186
|
+
color: var(--color-text-muted);
|
|
187
187
|
}
|
|
188
188
|
|
|
189
189
|
&__header__action--toggled svg {
|
|
@@ -201,9 +201,9 @@
|
|
|
201
201
|
|
|
202
202
|
&__content {
|
|
203
203
|
height: calc(100% - 3.4rem);
|
|
204
|
-
background: var(--color-
|
|
204
|
+
background: var(--color-bg-panel-header);
|
|
205
205
|
border-radius: 0 0 0.2rem 0.2rem;
|
|
206
|
-
border-bottom: 0.1rem solid var(--color-
|
|
206
|
+
border-bottom: 0.1rem solid var(--color-border-subtle);
|
|
207
207
|
box-shadow: var(--color-dark-shade-280) 0 0.1rem 0.5rem 0;
|
|
208
208
|
}
|
|
209
209
|
}
|
|
@@ -214,7 +214,7 @@
|
|
|
214
214
|
|
|
215
215
|
height: 2.2rem;
|
|
216
216
|
background: var(--color-blue-100);
|
|
217
|
-
color: var(--color-
|
|
217
|
+
color: var(--color-text-on-accent);
|
|
218
218
|
padding: 0 0.5rem 0 1rem;
|
|
219
219
|
|
|
220
220
|
&__left {
|
|
@@ -241,14 +241,14 @@
|
|
|
241
241
|
color: var(--color-dark-shade-300);
|
|
242
242
|
|
|
243
243
|
&--toggled {
|
|
244
|
-
color: var(--color-
|
|
244
|
+
color: var(--color-text-on-accent);
|
|
245
245
|
}
|
|
246
246
|
}
|
|
247
247
|
}
|
|
248
248
|
|
|
249
249
|
&__view-diff-btn {
|
|
250
250
|
&:not([disabled]) {
|
|
251
|
-
color: var(--color-
|
|
251
|
+
color: var(--color-text-on-accent);
|
|
252
252
|
}
|
|
253
253
|
|
|
254
254
|
svg {
|
|
@@ -260,7 +260,7 @@
|
|
|
260
260
|
@include flexCenter;
|
|
261
261
|
|
|
262
262
|
background: none;
|
|
263
|
-
color: var(--color-
|
|
263
|
+
color: var(--color-text-on-accent);
|
|
264
264
|
cursor: pointer;
|
|
265
265
|
padding: 0 0.5rem;
|
|
266
266
|
|
|
@@ -298,9 +298,9 @@
|
|
|
298
298
|
width: 100%;
|
|
299
299
|
height: 2.8rem;
|
|
300
300
|
line-height: 2.8rem;
|
|
301
|
-
background: var(--color-
|
|
302
|
-
border: 0.1rem solid var(--color-
|
|
303
|
-
color: var(--color-
|
|
301
|
+
background: var(--color-bg-panel);
|
|
302
|
+
border: 0.1rem solid var(--color-border-strong);
|
|
303
|
+
color: var(--color-text-secondary);
|
|
304
304
|
|
|
305
305
|
&:focus {
|
|
306
306
|
border: 0.1rem solid var(--color-blue-200);
|
|
@@ -334,6 +334,16 @@
|
|
|
334
334
|
text-decoration-style: solid;
|
|
335
335
|
}
|
|
336
336
|
}
|
|
337
|
+
|
|
338
|
+
// NOTE: scoped under `.data-quality-validation`. Previously these selectors
|
|
339
|
+
// lived at the top level which forced a hardcoded light grey on every disabled
|
|
340
|
+
// dropdown-combo button across the app — a theme leak. The base
|
|
341
|
+
// `.btn__dropdown-combo` styles already handle disabled state in a theme-aware
|
|
342
|
+
// way; this override is kept narrowly for the data-quality builder.
|
|
343
|
+
.btn__dropdown-combo__label[disabled],
|
|
344
|
+
.btn__dropdown-combo__dropdown-btn[disabled] {
|
|
345
|
+
background: var(--color-bg-tag);
|
|
346
|
+
}
|
|
337
347
|
}
|
|
338
348
|
|
|
339
349
|
.data-quality-validation__setup {
|
|
@@ -343,7 +353,7 @@
|
|
|
343
353
|
|
|
344
354
|
&__content {
|
|
345
355
|
padding: 0.5rem;
|
|
346
|
-
border-bottom: 0.1rem solid var(--color-
|
|
356
|
+
border-bottom: 0.1rem solid var(--color-border-default);
|
|
347
357
|
overflow: hidden;
|
|
348
358
|
border-radius: 0.2rem;
|
|
349
359
|
}
|
|
@@ -361,7 +371,7 @@
|
|
|
361
371
|
border-radius: 0.2rem 0.2rem 0.2rem 0;
|
|
362
372
|
|
|
363
373
|
&__title {
|
|
364
|
-
color: var(--color-
|
|
374
|
+
color: var(--color-text-secondary);
|
|
365
375
|
font-size: 1rem;
|
|
366
376
|
font-weight: 500;
|
|
367
377
|
}
|
|
@@ -373,7 +383,7 @@
|
|
|
373
383
|
width: 3rem;
|
|
374
384
|
|
|
375
385
|
svg {
|
|
376
|
-
color: var(--color-
|
|
386
|
+
color: var(--color-text-secondary);
|
|
377
387
|
}
|
|
378
388
|
}
|
|
379
389
|
}
|
|
@@ -395,7 +405,7 @@
|
|
|
395
405
|
&__item__label {
|
|
396
406
|
@include flexCenter;
|
|
397
407
|
|
|
398
|
-
background: var(--color-
|
|
408
|
+
background: var(--color-bg-panel);
|
|
399
409
|
margin-right: 0.5rem;
|
|
400
410
|
}
|
|
401
411
|
|
|
@@ -435,7 +445,7 @@
|
|
|
435
445
|
cursor: default;
|
|
436
446
|
width: 2rem;
|
|
437
447
|
font-size: 1.2rem;
|
|
438
|
-
color: var(--color-
|
|
448
|
+
color: var(--color-text-muted);
|
|
439
449
|
}
|
|
440
450
|
}
|
|
441
451
|
|
|
@@ -461,7 +471,7 @@
|
|
|
461
471
|
height: 1.6rem;
|
|
462
472
|
font-size: 1.2rem;
|
|
463
473
|
font-weight: 500;
|
|
464
|
-
background: var(--color-
|
|
474
|
+
background: var(--color-bg-hover);
|
|
465
475
|
padding: 0 0.5rem;
|
|
466
476
|
border-radius: 0.2rem;
|
|
467
477
|
}
|
|
@@ -502,7 +512,7 @@
|
|
|
502
512
|
|
|
503
513
|
&__option__path {
|
|
504
514
|
font-size: 1.2rem;
|
|
505
|
-
color: var(--color-
|
|
515
|
+
color: var(--color-text-muted);
|
|
506
516
|
margin-left: 0.5rem;
|
|
507
517
|
line-height: 1.4rem;
|
|
508
518
|
}
|
|
@@ -528,7 +538,7 @@
|
|
|
528
538
|
&__header__action--active.panel__header__action:hover,
|
|
529
539
|
&__header__action--active.panel__header__action {
|
|
530
540
|
svg {
|
|
531
|
-
color: var(--color-
|
|
541
|
+
color: var(--color-text-primary);
|
|
532
542
|
}
|
|
533
543
|
}
|
|
534
544
|
|
|
@@ -550,7 +560,7 @@
|
|
|
550
560
|
&__preview-data-modal__placeholder {
|
|
551
561
|
@include flexCenter;
|
|
552
562
|
|
|
553
|
-
color: var(--color-
|
|
563
|
+
color: var(--color-text-muted);
|
|
554
564
|
font-family: 'Roboto Mono', monospace;
|
|
555
565
|
min-height: 5vw;
|
|
556
566
|
}
|
|
@@ -562,7 +572,7 @@
|
|
|
562
572
|
|
|
563
573
|
.table {
|
|
564
574
|
width: 100%;
|
|
565
|
-
color: var(--color-
|
|
575
|
+
color: var(--color-text-muted);
|
|
566
576
|
font-family: 'Roboto Mono', monospace;
|
|
567
577
|
}
|
|
568
578
|
}
|
|
@@ -630,7 +640,7 @@
|
|
|
630
640
|
|
|
631
641
|
.data-quality-validation__tooltip {
|
|
632
642
|
border-radius: 0.2rem !important;
|
|
633
|
-
background: var(--color-
|
|
643
|
+
background: var(--color-bg-panel-header) !important;
|
|
634
644
|
opacity: 0.9 !important;
|
|
635
645
|
transition: none;
|
|
636
646
|
// as this tooltip can contain long documentation, it's best we limit its dimension
|
|
@@ -642,14 +652,14 @@
|
|
|
642
652
|
}
|
|
643
653
|
|
|
644
654
|
&__arrow {
|
|
645
|
-
color: var(--color-
|
|
655
|
+
color: var(--color-text-muted) !important;
|
|
646
656
|
opacity: 0.9 !important;
|
|
647
657
|
}
|
|
648
658
|
|
|
649
659
|
&__header {
|
|
650
660
|
font-size: 1.5rem;
|
|
651
661
|
padding-bottom: 0.5rem;
|
|
652
|
-
border-bottom: 1px solid var(--color-
|
|
662
|
+
border-bottom: 1px solid var(--color-border-strong);
|
|
653
663
|
}
|
|
654
664
|
|
|
655
665
|
&__content {
|
|
@@ -663,7 +673,7 @@
|
|
|
663
673
|
|
|
664
674
|
&__item__label {
|
|
665
675
|
font-size: 1.3rem;
|
|
666
|
-
color: var(--color-
|
|
676
|
+
color: var(--color-text-disabled);
|
|
667
677
|
}
|
|
668
678
|
|
|
669
679
|
&__item__value {
|
|
@@ -679,7 +689,7 @@
|
|
|
679
689
|
margin-left: 0.5rem;
|
|
680
690
|
|
|
681
691
|
svg {
|
|
682
|
-
color: var(--color-
|
|
692
|
+
color: var(--color-text-primary);
|
|
683
693
|
|
|
684
694
|
&:hover {
|
|
685
695
|
color: white;
|
|
@@ -696,11 +706,11 @@
|
|
|
696
706
|
&__taggedValues {
|
|
697
707
|
max-height: 20rem;
|
|
698
708
|
overflow-y: scroll;
|
|
699
|
-
background-color: var(--color-
|
|
709
|
+
background-color: var(--color-bg-panel);
|
|
700
710
|
margin-top: 0.5rem;
|
|
701
711
|
margin-left: 1rem;
|
|
702
712
|
opacity: 0.9;
|
|
703
|
-
border: 1rem solid var(--color-
|
|
713
|
+
border: 1rem solid var(--color-border-subtle);
|
|
704
714
|
|
|
705
715
|
&__show-btn {
|
|
706
716
|
height: 1.5rem;
|
|
@@ -732,7 +742,7 @@
|
|
|
732
742
|
|
|
733
743
|
&__expand-icon svg {
|
|
734
744
|
font-size: 1rem;
|
|
735
|
-
color: var(--color-
|
|
745
|
+
color: var(--color-text-secondary);
|
|
736
746
|
}
|
|
737
747
|
|
|
738
748
|
&__node__container:hover {
|
|
@@ -741,7 +751,7 @@
|
|
|
741
751
|
|
|
742
752
|
&__node__container:hover &__node__action {
|
|
743
753
|
svg {
|
|
744
|
-
color: var(--color-
|
|
754
|
+
color: var(--color-text-disabled);
|
|
745
755
|
}
|
|
746
756
|
}
|
|
747
757
|
|
|
@@ -759,7 +769,7 @@
|
|
|
759
769
|
height: 2rem;
|
|
760
770
|
line-height: 2rem;
|
|
761
771
|
min-width: 0;
|
|
762
|
-
color: var(--color-
|
|
772
|
+
color: var(--color-text-muted);
|
|
763
773
|
user-select: none;
|
|
764
774
|
}
|
|
765
775
|
|
|
@@ -802,7 +812,7 @@
|
|
|
802
812
|
font-weight: 700;
|
|
803
813
|
font-size: 1.1rem;
|
|
804
814
|
font-family: 'Roboto Mono', monospace;
|
|
805
|
-
color: var(--color-
|
|
815
|
+
color: var(--color-text-muted);
|
|
806
816
|
height: 2rem;
|
|
807
817
|
line-height: 2rem;
|
|
808
818
|
margin-left: 0.5rem;
|
|
@@ -838,11 +848,11 @@
|
|
|
838
848
|
}
|
|
839
849
|
|
|
840
850
|
&:hover svg {
|
|
841
|
-
color: var(--color-
|
|
851
|
+
color: var(--color-text-secondary) !important;
|
|
842
852
|
}
|
|
843
853
|
|
|
844
854
|
&[disabled] svg {
|
|
845
|
-
color: var(--color-
|
|
855
|
+
color: var(--color-text-muted);
|
|
846
856
|
}
|
|
847
857
|
}
|
|
848
858
|
|
|
@@ -862,7 +872,7 @@
|
|
|
862
872
|
&__node__container--unmapped &__type-icon &__icon,
|
|
863
873
|
&__node__container--unmapped &__node__label__derived-property,
|
|
864
874
|
&__node__container--unmapped &__node__label__multiple {
|
|
865
|
-
color: var(--color-
|
|
875
|
+
color: var(--color-text-muted);
|
|
866
876
|
}
|
|
867
877
|
|
|
868
878
|
&__node__container--highlighted &__node__label,
|
|
@@ -893,7 +903,7 @@
|
|
|
893
903
|
height: 2.8rem;
|
|
894
904
|
margin-top: 0.3rem;
|
|
895
905
|
font-size: 1.2rem;
|
|
896
|
-
border-bottom: 0.1rem solid var(--color-
|
|
906
|
+
border-bottom: 0.1rem solid var(--color-border-subtle);
|
|
897
907
|
|
|
898
908
|
&__hint-icon {
|
|
899
909
|
@include flexCenter;
|
|
@@ -901,7 +911,7 @@
|
|
|
901
911
|
width: 3rem;
|
|
902
912
|
|
|
903
913
|
svg {
|
|
904
|
-
color: var(--color-
|
|
914
|
+
color: var(--color-text-disabled);
|
|
905
915
|
}
|
|
906
916
|
}
|
|
907
917
|
}
|
|
@@ -932,12 +942,12 @@
|
|
|
932
942
|
|
|
933
943
|
&__label__icon {
|
|
934
944
|
font-size: 1.4rem;
|
|
935
|
-
color: var(--color-
|
|
945
|
+
color: var(--color-text-secondary);
|
|
936
946
|
}
|
|
937
947
|
|
|
938
948
|
&__label__title {
|
|
939
949
|
margin-left: 0.5rem;
|
|
940
|
-
color: var(--color-
|
|
950
|
+
color: var(--color-text-secondary);
|
|
941
951
|
font-size: 1.2rem;
|
|
942
952
|
font-weight: 500;
|
|
943
953
|
}
|
|
@@ -945,18 +955,18 @@
|
|
|
945
955
|
&__label:hover &__label__icon,
|
|
946
956
|
&__label:hover &__label__title,
|
|
947
957
|
&__dropdown-btn:hover svg {
|
|
948
|
-
color: var(--color-
|
|
958
|
+
color: var(--color-text-primary);
|
|
949
959
|
}
|
|
950
960
|
|
|
951
961
|
&__label[disabled],
|
|
952
962
|
&__dropdown-btn[disabled] {
|
|
953
|
-
background: var(--color-
|
|
963
|
+
background: var(--color-bg-hover);
|
|
954
964
|
}
|
|
955
965
|
|
|
956
966
|
&__label[disabled] &__label__icon,
|
|
957
967
|
&__label[disabled] &__label__title,
|
|
958
968
|
&__dropdown-btn[disabled] svg {
|
|
959
|
-
color: var(--color-
|
|
969
|
+
color: var(--color-text-disabled);
|
|
960
970
|
}
|
|
961
971
|
}
|
|
962
972
|
}
|
|
@@ -1002,12 +1012,12 @@
|
|
|
1002
1012
|
height: 3.4rem;
|
|
1003
1013
|
|
|
1004
1014
|
svg {
|
|
1005
|
-
color: var(--color-
|
|
1015
|
+
color: var(--color-text-muted);
|
|
1006
1016
|
}
|
|
1007
1017
|
|
|
1008
1018
|
&:hover {
|
|
1009
1019
|
svg {
|
|
1010
|
-
color: var(--color-
|
|
1020
|
+
color: var(--color-text-secondary);
|
|
1011
1021
|
}
|
|
1012
1022
|
}
|
|
1013
1023
|
}
|
|
@@ -1027,13 +1037,13 @@
|
|
|
1027
1037
|
}
|
|
1028
1038
|
|
|
1029
1039
|
&__expand-icon svg {
|
|
1030
|
-
color: var(--color-
|
|
1040
|
+
color: var(--color-text-secondary);
|
|
1031
1041
|
font-size: 1.2rem;
|
|
1032
1042
|
}
|
|
1033
1043
|
|
|
1034
1044
|
&__node__label {
|
|
1035
1045
|
display: flex;
|
|
1036
|
-
color: var(--color-
|
|
1046
|
+
color: var(--color-text-muted);
|
|
1037
1047
|
}
|
|
1038
1048
|
|
|
1039
1049
|
&__node__constraint {
|
|
@@ -1078,13 +1088,13 @@
|
|
|
1078
1088
|
}
|
|
1079
1089
|
|
|
1080
1090
|
&__node__type__label {
|
|
1081
|
-
background: var(--color-
|
|
1082
|
-
color: var(--color-
|
|
1091
|
+
background: var(--color-bg-hover);
|
|
1092
|
+
color: var(--color-text-secondary);
|
|
1083
1093
|
}
|
|
1084
1094
|
|
|
1085
1095
|
&__node__sub-type__label {
|
|
1086
|
-
background: var(--color-
|
|
1087
|
-
color: var(--color-
|
|
1096
|
+
background: var(--color-bg-tag);
|
|
1097
|
+
color: var(--color-text-muted);
|
|
1088
1098
|
border-radius: 0.2rem 1.4rem 1.4rem 0.2rem;
|
|
1089
1099
|
padding-right: 0.7rem;
|
|
1090
1100
|
}
|
|
@@ -1129,11 +1139,11 @@
|
|
|
1129
1139
|
justify-content: space-between;
|
|
1130
1140
|
height: 1.6rem;
|
|
1131
1141
|
padding-left: 1rem;
|
|
1132
|
-
background: var(--color-
|
|
1142
|
+
background: var(--color-bg-elevated);
|
|
1133
1143
|
border-radius: 0.2rem 0.2rem 0.2rem 0;
|
|
1134
1144
|
|
|
1135
1145
|
&__title {
|
|
1136
|
-
color: var(--color-
|
|
1146
|
+
color: var(--color-text-secondary);
|
|
1137
1147
|
font-size: 1rem;
|
|
1138
1148
|
font-weight: 500;
|
|
1139
1149
|
}
|
|
@@ -1145,7 +1155,7 @@
|
|
|
1145
1155
|
width: 3rem;
|
|
1146
1156
|
|
|
1147
1157
|
svg {
|
|
1148
|
-
color: var(--color-
|
|
1158
|
+
color: var(--color-text-secondary);
|
|
1149
1159
|
}
|
|
1150
1160
|
}
|
|
1151
1161
|
}
|
|
@@ -1169,7 +1179,7 @@
|
|
|
1169
1179
|
&__item__label {
|
|
1170
1180
|
@include flexCenter;
|
|
1171
1181
|
|
|
1172
|
-
background: var(--color-
|
|
1182
|
+
background: var(--color-bg-panel);
|
|
1173
1183
|
margin-right: 0.5rem;
|
|
1174
1184
|
}
|
|
1175
1185
|
|
|
@@ -1254,7 +1264,7 @@
|
|
|
1254
1264
|
&__title,
|
|
1255
1265
|
&:hover svg,
|
|
1256
1266
|
svg {
|
|
1257
|
-
color: var(--color-
|
|
1267
|
+
color: var(--color-text-on-accent);
|
|
1258
1268
|
}
|
|
1259
1269
|
}
|
|
1260
1270
|
|
|
@@ -1288,7 +1298,7 @@
|
|
|
1288
1298
|
border-color: var(--color-dark-shade-50);
|
|
1289
1299
|
|
|
1290
1300
|
svg {
|
|
1291
|
-
color: var(--color-
|
|
1301
|
+
color: var(--color-text-muted);
|
|
1292
1302
|
}
|
|
1293
1303
|
}
|
|
1294
1304
|
|
|
@@ -1314,11 +1324,6 @@
|
|
|
1314
1324
|
}
|
|
1315
1325
|
}
|
|
1316
1326
|
|
|
1317
|
-
.btn__dropdown-combo__label[disabled],
|
|
1318
|
-
.btn__dropdown-combo__dropdown-btn[disabled] {
|
|
1319
|
-
background: var(--color-light-grey-400);
|
|
1320
|
-
}
|
|
1321
|
-
|
|
1322
1327
|
.ag-row-selected .ag-cell-focus {
|
|
1323
1328
|
background: var(--color-purple-0) !important;
|
|
1324
1329
|
}
|
|
@@ -1340,7 +1345,7 @@
|
|
|
1340
1345
|
display: flex;
|
|
1341
1346
|
justify-content: center;
|
|
1342
1347
|
font-size: 1.2rem;
|
|
1343
|
-
color: var(--color-
|
|
1348
|
+
color: var(--color-text-muted);
|
|
1344
1349
|
margin-left: 0.5rem;
|
|
1345
1350
|
font-family: 'Roboto Mono', monospace;
|
|
1346
1351
|
}
|
|
@@ -1372,7 +1377,7 @@
|
|
|
1372
1377
|
&__label {
|
|
1373
1378
|
@include flexCenter;
|
|
1374
1379
|
|
|
1375
|
-
background: var(--color-
|
|
1380
|
+
background: var(--color-bg-elevated);
|
|
1376
1381
|
padding: 0 1rem;
|
|
1377
1382
|
height: 2.2rem;
|
|
1378
1383
|
border-radius: 0.2rem 0 0 0.2rem;
|
|
@@ -1383,19 +1388,19 @@
|
|
|
1383
1388
|
&__toggler__btn {
|
|
1384
1389
|
@include flexVCenter;
|
|
1385
1390
|
|
|
1386
|
-
background: var(--color-
|
|
1391
|
+
background: var(--color-bg-elevated);
|
|
1387
1392
|
padding: 0 0.5rem 0 0;
|
|
1388
1393
|
height: 2.2rem;
|
|
1389
1394
|
|
|
1390
1395
|
svg {
|
|
1391
1396
|
font-size: 2rem;
|
|
1392
|
-
color: var(--color-
|
|
1397
|
+
color: var(--color-text-inverted);
|
|
1393
1398
|
}
|
|
1394
1399
|
|
|
1395
1400
|
&[disabled] svg,
|
|
1396
1401
|
&[disabled]:hover svg {
|
|
1397
1402
|
cursor: not-allowed;
|
|
1398
|
-
color: var(--color-
|
|
1403
|
+
color: var(--color-text-muted);
|
|
1399
1404
|
}
|
|
1400
1405
|
}
|
|
1401
1406
|
|
|
@@ -1408,7 +1413,7 @@
|
|
|
1408
1413
|
&[disabled] svg,
|
|
1409
1414
|
&[disabled]:hover svg {
|
|
1410
1415
|
cursor: not-allowed;
|
|
1411
|
-
color: var(--color-
|
|
1416
|
+
color: var(--color-text-inverted);
|
|
1412
1417
|
}
|
|
1413
1418
|
}
|
|
1414
1419
|
}
|
|
@@ -1422,7 +1427,7 @@
|
|
|
1422
1427
|
&__label {
|
|
1423
1428
|
@include flexCenter;
|
|
1424
1429
|
|
|
1425
|
-
background: var(--color-
|
|
1430
|
+
background: var(--color-bg-elevated);
|
|
1426
1431
|
padding: 0 1rem;
|
|
1427
1432
|
height: 100%;
|
|
1428
1433
|
border-radius: 0.2rem 0 0 0.2rem;
|
|
@@ -1435,7 +1440,7 @@
|
|
|
1435
1440
|
width: 6rem;
|
|
1436
1441
|
|
|
1437
1442
|
&:not(:focus) {
|
|
1438
|
-
border: 0.1rem solid var(--color-
|
|
1443
|
+
border: 0.1rem solid var(--color-border-default);
|
|
1439
1444
|
}
|
|
1440
1445
|
|
|
1441
1446
|
&[disabled] {
|
|
@@ -1453,7 +1458,7 @@
|
|
|
1453
1458
|
&__label {
|
|
1454
1459
|
@include flexCenter;
|
|
1455
1460
|
|
|
1456
|
-
background: var(--color-
|
|
1461
|
+
background: var(--color-bg-elevated);
|
|
1457
1462
|
padding: 0 1rem;
|
|
1458
1463
|
height: 100%;
|
|
1459
1464
|
border-radius: 0.2rem 0 0 0.2rem;
|
|
@@ -1465,7 +1470,7 @@
|
|
|
1465
1470
|
height: 100%;
|
|
1466
1471
|
|
|
1467
1472
|
&:not(:focus) {
|
|
1468
|
-
border: 0.1rem solid var(--color-
|
|
1473
|
+
border: 0.1rem solid var(--color-border-default);
|
|
1469
1474
|
}
|
|
1470
1475
|
|
|
1471
1476
|
&[disabled] {
|
|
@@ -1503,7 +1508,7 @@
|
|
|
1503
1508
|
font-size: 2rem;
|
|
1504
1509
|
font-weight: bold;
|
|
1505
1510
|
height: 2.8rem;
|
|
1506
|
-
color: var(--color-
|
|
1511
|
+
color: var(--color-text-primary);
|
|
1507
1512
|
cursor: default;
|
|
1508
1513
|
}
|
|
1509
1514
|
}
|
|
@@ -1595,19 +1600,19 @@
|
|
|
1595
1600
|
|
|
1596
1601
|
&__label__icon {
|
|
1597
1602
|
font-size: 1.2rem;
|
|
1598
|
-
color: var(--color-
|
|
1603
|
+
color: var(--color-text-secondary);
|
|
1599
1604
|
}
|
|
1600
1605
|
|
|
1601
1606
|
&__label__title {
|
|
1602
1607
|
margin-left: 0.7rem;
|
|
1603
|
-
color: var(--color-
|
|
1608
|
+
color: var(--color-text-secondary);
|
|
1604
1609
|
font-size: 1.2rem;
|
|
1605
1610
|
font-weight: 500;
|
|
1606
1611
|
}
|
|
1607
1612
|
|
|
1608
1613
|
&__label:hover &__label__icon,
|
|
1609
1614
|
&__label:hover &__label__title {
|
|
1610
|
-
color: var(--color-
|
|
1615
|
+
color: var(--color-text-primary);
|
|
1611
1616
|
}
|
|
1612
1617
|
}
|
|
1613
1618
|
|
|
@@ -1619,11 +1624,11 @@
|
|
|
1619
1624
|
height: 100%;
|
|
1620
1625
|
font-size: 1.2rem;
|
|
1621
1626
|
font-weight: 500;
|
|
1622
|
-
color: var(--color-
|
|
1627
|
+
color: var(--color-text-primary);
|
|
1623
1628
|
gap: 0.5rem;
|
|
1624
1629
|
|
|
1625
1630
|
& svg {
|
|
1626
|
-
color: var(--color-
|
|
1631
|
+
color: var(--color-text-primary);
|
|
1627
1632
|
}
|
|
1628
1633
|
|
|
1629
1634
|
&--green {
|
|
@@ -1633,10 +1638,10 @@
|
|
|
1633
1638
|
&--green[disabled] {
|
|
1634
1639
|
opacity: 0.8;
|
|
1635
1640
|
background: var(--color-green-80) !important;
|
|
1636
|
-
color: var(--color-
|
|
1641
|
+
color: var(--color-text-on-accent);
|
|
1637
1642
|
|
|
1638
1643
|
& svg {
|
|
1639
|
-
color: var(--color-
|
|
1644
|
+
color: var(--color-text-on-accent);
|
|
1640
1645
|
}
|
|
1641
1646
|
}
|
|
1642
1647
|
|
|
@@ -1655,20 +1660,20 @@
|
|
|
1655
1660
|
|
|
1656
1661
|
margin-left: 0.5rem;
|
|
1657
1662
|
height: 100%;
|
|
1658
|
-
border: 0.1rem solid var(--color-
|
|
1659
|
-
background: var(--color-
|
|
1660
|
-
color: var(--color-
|
|
1663
|
+
border: 0.1rem solid var(--color-border-default);
|
|
1664
|
+
background: var(--color-bg-elevated);
|
|
1665
|
+
color: var(--color-text-primary);
|
|
1661
1666
|
|
|
1662
1667
|
&[disabled],
|
|
1663
1668
|
&[disabled]:hover {
|
|
1664
|
-
background: var(--color-
|
|
1665
|
-
border-color: var(--color-
|
|
1666
|
-
color: var(--color-
|
|
1669
|
+
background: var(--color-bg-panel-header);
|
|
1670
|
+
border-color: var(--color-border-default);
|
|
1671
|
+
color: var(--color-text-disabled);
|
|
1667
1672
|
opacity: 0.8;
|
|
1668
1673
|
}
|
|
1669
1674
|
|
|
1670
1675
|
&:hover {
|
|
1671
|
-
background: var(--color-
|
|
1676
|
+
background: var(--color-bg-tag);
|
|
1672
1677
|
}
|
|
1673
1678
|
|
|
1674
1679
|
&__label {
|
|
@@ -1704,9 +1709,9 @@
|
|
|
1704
1709
|
|
|
1705
1710
|
display: inline-flex;
|
|
1706
1711
|
height: 100%;
|
|
1707
|
-
color: var(--color-
|
|
1712
|
+
color: var(--color-text-muted);
|
|
1708
1713
|
padding: 0 1rem;
|
|
1709
|
-
border-right: 0.1rem solid var(--color-
|
|
1714
|
+
border-right: 0.1rem solid var(--color-border-subtle);
|
|
1710
1715
|
white-space: nowrap;
|
|
1711
1716
|
cursor: pointer;
|
|
1712
1717
|
}
|
|
@@ -1729,7 +1734,7 @@
|
|
|
1729
1734
|
|
|
1730
1735
|
border-radius: 0.2rem;
|
|
1731
1736
|
margin-left: 1rem;
|
|
1732
|
-
color: var(--color-
|
|
1737
|
+
color: var(--color-text-secondary);
|
|
1733
1738
|
|
|
1734
1739
|
svg {
|
|
1735
1740
|
font-size: 1.2rem;
|