@cloudtower/eagle 0.35.6 → 0.35.8

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 (34) hide show
  1. package/dist/cjs/core/Duration/index.js +78 -0
  2. package/dist/cjs/core/index.js +15 -12
  3. package/dist/cjs/hooks/useFormatDuration.js +35 -0
  4. package/dist/cjs/index.js +247 -245
  5. package/dist/cjs/stats1.html +1 -1
  6. package/dist/cjs/utils/formatDuration.js +67 -0
  7. package/dist/components.css +1506 -1506
  8. package/dist/esm/core/Duration/index.js +72 -0
  9. package/dist/esm/core/index.js +4 -2
  10. package/dist/esm/hooks/useFormatDuration.js +33 -0
  11. package/dist/esm/index.js +1 -0
  12. package/dist/esm/stats1.html +1 -1
  13. package/dist/esm/utils/formatDuration.js +65 -0
  14. package/dist/linaria.merged.scss +1897 -1897
  15. package/dist/src/core/Duration/duration.type.d.ts +42 -0
  16. package/dist/src/core/Duration/index.d.ts +4 -0
  17. package/dist/src/core/index.d.ts +4 -0
  18. package/dist/src/coreX/Copy/CopyButton.d.ts +5 -0
  19. package/dist/src/coreX/Copy/CopyButton.type.d.ts +8 -0
  20. package/dist/src/coreX/Copy/CopyTooltip.d.ts +5 -0
  21. package/dist/src/coreX/Copy/CopyTooltip.typs.d.ts +16 -0
  22. package/dist/src/coreX/Copy/index.d.ts +2 -0
  23. package/dist/src/coreX/index.d.ts +1 -0
  24. package/dist/src/hooks/__tests__/useFormatDuration.test.d.ts +1 -0
  25. package/dist/src/hooks/index.d.ts +1 -0
  26. package/dist/src/hooks/useFormatDuration.d.ts +31 -0
  27. package/dist/src/utils/__test__/formatDuration.spec.d.ts +1 -0
  28. package/dist/src/utils/formatDuration.d.ts +28 -0
  29. package/dist/src/utils/index.d.ts +1 -0
  30. package/dist/stories/docs/core/Duration.stories.d.ts +88 -0
  31. package/dist/stories/docs/coreX/Copy/CopyButton.stories.d.ts +66 -0
  32. package/dist/stories/docs/coreX/Copy/CopyTooltip.stories.d.ts +66 -0
  33. package/dist/style.css +1506 -1506
  34. package/package.json +6 -4
@@ -428,47 +428,6 @@
428
428
  }
429
429
 
430
430
 
431
- .E_b1nip9bk {
432
- padding: 4px 11px;
433
- }
434
-
435
- .E_bqamoqe {
436
- white-space: nowrap;
437
- filter: drop-shadow(0px 2px 8px rgba(0, 136, 255, 0.1));
438
-
439
- & > .ant-btn {
440
- &.ant-btn-ordinary-onTint:not(.ant-btn-dangerous) {
441
- --color: #{$text-light-general};
442
-
443
- &[disabled],
444
- &:hover[disabled] {
445
- --color: #{$text-light-general};
446
- }
447
- }
448
- }
449
-
450
- & > .ant-btn:not(:only-child) {
451
- & + .ant-btn {
452
- margin-left: 1px;
453
- }
454
-
455
- &:first-child {
456
- border-top-right-radius: 0;
457
- border-bottom-right-radius: 0;
458
- }
459
-
460
- &:last-child {
461
- border-top-left-radius: 0;
462
- border-bottom-left-radius: 0;
463
- }
464
-
465
- &:not(:first-child, :last-child) {
466
- border-radius: unset;
467
- }
468
- }
469
- }
470
-
471
-
472
431
  .E_d133fzv0 {
473
432
  .ant-dropdown-menu-item-group {
474
433
  .ant-dropdown-menu-item-group-title {
@@ -603,6 +562,47 @@
603
562
  }
604
563
 
605
564
 
565
+ .E_b1nip9bk {
566
+ padding: 4px 11px;
567
+ }
568
+
569
+ .E_bqamoqe {
570
+ white-space: nowrap;
571
+ filter: drop-shadow(0px 2px 8px rgba(0, 136, 255, 0.1));
572
+
573
+ & > .ant-btn {
574
+ &.ant-btn-ordinary-onTint:not(.ant-btn-dangerous) {
575
+ --color: #{$text-light-general};
576
+
577
+ &[disabled],
578
+ &:hover[disabled] {
579
+ --color: #{$text-light-general};
580
+ }
581
+ }
582
+ }
583
+
584
+ & > .ant-btn:not(:only-child) {
585
+ & + .ant-btn {
586
+ margin-left: 1px;
587
+ }
588
+
589
+ &:first-child {
590
+ border-top-right-radius: 0;
591
+ border-bottom-right-radius: 0;
592
+ }
593
+
594
+ &:last-child {
595
+ border-top-left-radius: 0;
596
+ border-bottom-left-radius: 0;
597
+ }
598
+
599
+ &:not(:first-child, :last-child) {
600
+ border-radius: unset;
601
+ }
602
+ }
603
+ }
604
+
605
+
606
606
  .E_fzh9mnb {
607
607
  width: 100%;
608
608
  height: 100%;
@@ -684,6 +684,43 @@
684
684
  }
685
685
 
686
686
 
687
+ .E_a1wfy30z {
688
+ .ant-input-number-handler-wrap {
689
+ display: var(--a1wfy30z-0);
690
+ }
691
+ .ant-input-number-input-wrap {
692
+ padding: 4px 11px;
693
+ display: inline-flex;
694
+ line-height: 1.5715;
695
+ height: inherit;
696
+ }
697
+
698
+ .ant-input-number-input-wrap::after {
699
+ content: var(--a1wfy30z-1);
700
+ display: var(--a1wfy30z-2);
701
+ flex: none;
702
+ align-items: center;
703
+ margin-left: 4px;
704
+ }
705
+
706
+ .ant-input-number-input-wrap::before {
707
+ content: var(--a1wfy30z-3);
708
+ display: var(--a1wfy30z-4);
709
+ flex: none;
710
+ align-items: center;
711
+ margin-right: 4px;
712
+ cursor: auto;
713
+ }
714
+
715
+ .ant-input-number-input {
716
+ padding: 0;
717
+ margin: 0;
718
+ height: auto;
719
+ font-size: inherit;
720
+ }
721
+ }
722
+
723
+
687
724
  .E_atcz0kf {
688
725
  .ant-input-suffix {
689
726
  margin-left: 8px;
@@ -694,20 +731,6 @@
694
731
  }
695
732
 
696
733
 
697
- .E_i1inqkme {
698
- height: 18px;
699
- line-height: 18px;
700
- padding: 0 4px;
701
- border-radius: 4px;
702
- background: rgba(235, 239, 245, 0.6);
703
- border: 1px solid rgba(223, 228, 235, 0.6);
704
- display: flex;
705
- align-items: center;
706
- white-space: nowrap;
707
- margin-right: 4px;
708
- }
709
-
710
-
711
734
  .E_itxley7 {
712
735
  &.ant-input-group.ant-input-group-compact {
713
736
  display: flex;
@@ -770,40 +793,17 @@
770
793
  }
771
794
 
772
795
 
773
- .E_a1wfy30z {
774
- .ant-input-number-handler-wrap {
775
- display: var(--a1wfy30z-0);
776
- }
777
- .ant-input-number-input-wrap {
778
- padding: 4px 11px;
779
- display: inline-flex;
780
- line-height: 1.5715;
781
- height: inherit;
782
- }
783
-
784
- .ant-input-number-input-wrap::after {
785
- content: var(--a1wfy30z-1);
786
- display: var(--a1wfy30z-2);
787
- flex: none;
788
- align-items: center;
789
- margin-left: 4px;
790
- }
791
-
792
- .ant-input-number-input-wrap::before {
793
- content: var(--a1wfy30z-3);
794
- display: var(--a1wfy30z-4);
795
- flex: none;
796
- align-items: center;
797
- margin-right: 4px;
798
- cursor: auto;
799
- }
800
-
801
- .ant-input-number-input {
802
- padding: 0;
803
- margin: 0;
804
- height: auto;
805
- font-size: inherit;
806
- }
796
+ .E_i1inqkme {
797
+ height: 18px;
798
+ line-height: 18px;
799
+ padding: 0 4px;
800
+ border-radius: 4px;
801
+ background: rgba(235, 239, 245, 0.6);
802
+ border: 1px solid rgba(223, 228, 235, 0.6);
803
+ display: flex;
804
+ align-items: center;
805
+ white-space: nowrap;
806
+ margin-right: 4px;
807
807
  }
808
808
 
809
809
 
@@ -888,6 +888,17 @@
888
888
  }
889
889
 
890
890
 
891
+ .E_ivqqkzv {
892
+ height: 24px;
893
+ width: 56px !important;
894
+ margin-right: 4px;
895
+ }
896
+
897
+ .E_c1wk4q29 {
898
+ color: $text-secondary-light;
899
+ }
900
+
901
+
891
902
  .E_owd0kml {
892
903
  display: inline-block;
893
904
  }
@@ -898,6 +909,73 @@
898
909
  }
899
910
 
900
911
 
912
+ .E_phljevk {
913
+ display: flex;
914
+ justify-content: space-between;
915
+ align-items: center;
916
+ padding: 10px 0;
917
+ color: $text-light-secondary;
918
+ font-size: 12px;
919
+ line-height: 24px;
920
+
921
+ .pagination-left {
922
+ padding: 2px 8px;
923
+ }
924
+
925
+ .dropdown-trigger {
926
+ display: flex;
927
+ align-items: center;
928
+ border-radius: 6px;
929
+ cursor: pointer;
930
+ transition: all 0.3s ease;
931
+
932
+ &:hover {
933
+ background: $fills-interaction-light-general-hover;
934
+ color: $text-light-general;
935
+ }
936
+ .icon-inner {
937
+ margin-left: 4px;
938
+ }
939
+ }
940
+
941
+ .pagination-right {
942
+ display: flex;
943
+ align-items: center;
944
+ color: $blue-60;
945
+ font-weight: bold;
946
+ .icon-inner {
947
+ margin-left: 4px;
948
+ }
949
+ .prev-btn,
950
+ .next-btn {
951
+ padding: 0 8px;
952
+ > span {
953
+ color: $text-light-general;
954
+ }
955
+ }
956
+
957
+ .next-btn {
958
+ .icon-inner {
959
+ transform: rotate(180deg);
960
+ }
961
+ }
962
+ }
963
+ }
964
+
965
+ .E_d12rtyeg {
966
+ &.ant-dropdown .ant-dropdown-menu {
967
+ max-height: calc(100vh - 128px);
968
+ overflow-y: auto;
969
+
970
+ .ant-dropdown-menu-item {
971
+ padding: 4px 20px;
972
+ font-size: 12px;
973
+ line-height: 18px;
974
+ }
975
+ }
976
+ }
977
+
978
+
901
979
  .E_rapgekc {
902
980
  &.ant-radio-wrapper {
903
981
  display: inline-flex;
@@ -1079,80 +1157,34 @@
1079
1157
  }
1080
1158
 
1081
1159
 
1082
- .E_ivqqkzv {
1083
- height: 24px;
1084
- width: 56px !important;
1085
- margin-right: 4px;
1160
+ .E_i11gg7mj {
1161
+ .ant-input-prefix {
1162
+ margin-right: 8px;
1163
+ }
1164
+ .ant-input-suffix {
1165
+ margin-left: 8px;
1166
+ }
1086
1167
  }
1087
1168
 
1088
- .E_c1wk4q29 {
1089
- color: $text-secondary-light;
1090
- }
1091
-
1169
+ .E_cc368xp {
1170
+ color: $gray-120;
1171
+ border-right: 1px solid $gray-a60-5;
1172
+ margin-right: 8px;
1173
+ padding-right: 8px;
1174
+ }
1092
1175
 
1093
- .E_phljevk {
1176
+ .E_i11o6xqj {
1094
1177
  display: flex;
1095
- justify-content: space-between;
1096
- align-items: center;
1097
- padding: 10px 0;
1098
- color: $text-light-secondary;
1099
- font-size: 12px;
1100
- line-height: 24px;
1101
-
1102
- .pagination-left {
1103
- padding: 2px 8px;
1104
- }
1178
+ gap: 4px;
1105
1179
 
1106
- .dropdown-trigger {
1107
- display: flex;
1108
- align-items: center;
1109
- border-radius: 6px;
1180
+ .icon-wrapper {
1110
1181
  cursor: pointer;
1111
- transition: all 0.3s ease;
1112
-
1113
- &:hover {
1114
- background: $fills-interaction-light-general-hover;
1115
- color: $text-light-general;
1116
- }
1117
- .icon-inner {
1118
- margin-left: 4px;
1119
- }
1120
- }
1121
-
1122
- .pagination-right {
1123
- display: flex;
1124
- align-items: center;
1125
- color: $blue-60;
1126
- font-weight: bold;
1127
- .icon-inner {
1128
- margin-left: 4px;
1129
- }
1130
- .prev-btn,
1131
- .next-btn {
1132
- padding: 0 8px;
1133
- > span {
1134
- color: $text-light-general;
1135
- }
1136
- }
1137
-
1138
- .next-btn {
1139
- .icon-inner {
1140
- transform: rotate(180deg);
1141
- }
1142
- }
1143
1182
  }
1144
1183
  }
1145
1184
 
1146
- .E_d12rtyeg {
1147
- &.ant-dropdown .ant-dropdown-menu {
1148
- max-height: calc(100vh - 128px);
1149
- overflow-y: auto;
1150
-
1151
- .ant-dropdown-menu-item {
1152
- padding: 4px 20px;
1153
- font-size: 12px;
1154
- line-height: 18px;
1155
- }
1185
+ .E_d19ruhdj {
1186
+ &.icon-wrapper {
1187
+ cursor: not-allowed;
1156
1188
  }
1157
1189
  }
1158
1190
 
@@ -1201,98 +1233,6 @@
1201
1233
  }
1202
1234
 
1203
1235
 
1204
- .E_i11gg7mj {
1205
- .ant-input-prefix {
1206
- margin-right: 8px;
1207
- }
1208
- .ant-input-suffix {
1209
- margin-left: 8px;
1210
- }
1211
- }
1212
-
1213
- .E_cc368xp {
1214
- color: $gray-120;
1215
- border-right: 1px solid $gray-a60-5;
1216
- margin-right: 8px;
1217
- padding-right: 8px;
1218
- }
1219
-
1220
- .E_i11o6xqj {
1221
- display: flex;
1222
- gap: 4px;
1223
-
1224
- .icon-wrapper {
1225
- cursor: pointer;
1226
- }
1227
- }
1228
-
1229
- .E_d19ruhdj {
1230
- &.icon-wrapper {
1231
- cursor: not-allowed;
1232
- }
1233
- }
1234
-
1235
-
1236
- .E_s1dizucg {
1237
- &.ant-switch {
1238
- min-width: 40px;
1239
- height: 24px;
1240
- background: $fills-trans-quinary-light;
1241
- overflow: hidden;
1242
- &:focus {
1243
- box-shadow: 0 0 0 2px $strokes-light-trans-1;
1244
- }
1245
- }
1246
- &.ant-switch-small {
1247
- min-width: 26px;
1248
- height: 16px;
1249
- }
1250
- &.ant-switch-large {
1251
- min-width: 52px;
1252
- height: 32px;
1253
- }
1254
-
1255
- &.ant-switch .ant-switch-handle {
1256
- height: 20px;
1257
- width: 20px;
1258
- &::before {
1259
- border-radius: 10px;
1260
- transition-delay: 120ms;
1261
- }
1262
- }
1263
- &.ant-switch-small .ant-switch-handle {
1264
- height: 14px;
1265
- width: 14px;
1266
- top: 1px;
1267
- left: 1px;
1268
- }
1269
- &.ant-switch-large .ant-switch-handle {
1270
- height: 28px;
1271
- width: 28px;
1272
- &::before {
1273
- border-radius: 14px;
1274
- }
1275
- }
1276
-
1277
- &.ant-switch-checked {
1278
- background-color: $green-60;
1279
- }
1280
- &.ant-switch-checked .ant-switch-handle {
1281
- left: calc(100% - 20px - 2px);
1282
- }
1283
- &.ant-switch-small.ant-switch-checked .ant-switch-handle {
1284
- left: calc(100% - 14px - 1px);
1285
- }
1286
- &.ant-switch-large.ant-switch-checked .ant-switch-handle {
1287
- left: calc(100% - 28px - 2px);
1288
- }
1289
- }
1290
-
1291
- .E_c1up6e3y {
1292
- margin-left: 5px;
1293
- }
1294
-
1295
-
1296
1236
  .E_cnujxq2 {
1297
1237
  display: flex;
1298
1238
  flex-direction: column;
@@ -2106,70 +2046,69 @@
2106
2046
  }
2107
2047
 
2108
2048
 
2109
- .E_a1b5xrg3 {
2110
- .user-icon-inner {
2111
- display: inline-flex;
2112
- align-items: center;
2113
- justify-content: center;
2114
- color: $white;
2115
- font-weight: bold;
2116
- font-size: 12px;
2117
- width: 24px;
2049
+ .E_s1dizucg {
2050
+ &.ant-switch {
2051
+ min-width: 40px;
2118
2052
  height: 24px;
2119
- border-radius: 50%;
2120
- background: var(--a1b5xrg3-0);
2053
+ background: $fills-trans-quinary-light;
2054
+ overflow: hidden;
2055
+ &:focus {
2056
+ box-shadow: 0 0 0 2px $strokes-light-trans-1;
2057
+ }
2058
+ }
2059
+ &.ant-switch-small {
2060
+ min-width: 26px;
2061
+ height: 16px;
2062
+ }
2063
+ &.ant-switch-large {
2064
+ min-width: 52px;
2065
+ height: 32px;
2121
2066
  }
2122
- &.btn-item {
2123
- transition: all 160ms ease;
2124
- cursor: pointer;
2125
- width: 56px;
2126
- height: 40px;
2127
- display: inline-flex;
2128
- align-items: center;
2129
- justify-content: center;
2130
- border-radius: 6px;
2131
2067
 
2132
- &:hover {
2133
- box-shadow:
2134
- 0px 0px 20px rgba(107, 125, 153, 0.18),
2135
- 0px 25px 80px rgba(45, 58, 86, 0.3);
2068
+ &.ant-switch .ant-switch-handle {
2069
+ height: 20px;
2070
+ width: 20px;
2071
+ &::before {
2072
+ border-radius: 10px;
2073
+ transition-delay: 120ms;
2136
2074
  }
2137
-
2138
- &:active {
2139
- transform: translateY(2px);
2140
- transition: all 320ms ease;
2075
+ }
2076
+ &.ant-switch-small .ant-switch-handle {
2077
+ height: 14px;
2078
+ width: 14px;
2079
+ top: 1px;
2080
+ left: 1px;
2081
+ }
2082
+ &.ant-switch-large .ant-switch-handle {
2083
+ height: 28px;
2084
+ width: 28px;
2085
+ &::before {
2086
+ border-radius: 14px;
2141
2087
  }
2142
2088
  }
2143
- }
2144
-
2145
2089
 
2146
- .E_iq1gosr {
2147
- display: inline-block;
2090
+ &.ant-switch-checked {
2091
+ background-color: $green-60;
2092
+ }
2093
+ &.ant-switch-checked .ant-switch-handle {
2094
+ left: calc(100% - 20px - 2px);
2095
+ }
2096
+ &.ant-switch-small.ant-switch-checked .ant-switch-handle {
2097
+ left: calc(100% - 14px - 1px);
2098
+ }
2099
+ &.ant-switch-large.ant-switch-checked .ant-switch-handle {
2100
+ left: calc(100% - 28px - 2px);
2101
+ }
2148
2102
  }
2149
2103
 
2150
-
2151
- .E_tju3gfj {
2152
- .date {
2153
- margin-right: 4px;
2104
+ .E_c1up6e3y {
2105
+ margin-left: 5px;
2154
2106
  }
2155
- }
2156
-
2157
-
2158
- .E_m196gn1d {
2159
- min-width: 1280px;
2160
- }
2161
2107
 
2162
2108
 
2163
- .E_t1m2x205 {
2164
- .ant-tooltip-arrow {
2165
- display: none;
2166
- }
2167
- .ant-tooltip-inner {
2168
- background: $gray-a80-9;
2169
- border-radius: 4px;
2170
- &:has(.eagle-ellipsis-content) {
2171
- visibility: hidden;
2172
- }
2109
+ .E_tju3gfj {
2110
+ .date {
2111
+ margin-right: 4px;
2173
2112
  }
2174
2113
  }
2175
2114
 
@@ -2263,6 +2202,111 @@
2263
2202
  }
2264
2203
 
2265
2204
 
2205
+ .E_s1sck0th {
2206
+ padding: 0 8px;
2207
+ border-radius: 4px;
2208
+ }
2209
+
2210
+ .E_m855nr1 {
2211
+ padding: 2px 8px;
2212
+ border-radius: 3px;
2213
+ }
2214
+
2215
+ .E_l1270xpg {
2216
+ padding: 3px 8px;
2217
+ border-radius: 2px;
2218
+ }
2219
+
2220
+ .E_t14rextb {
2221
+ &.ant-tag:hover {
2222
+ opacity: unset;
2223
+ }
2224
+ &.ant-tag.ui-kit-token:not(.ant-tag-hidden) {
2225
+ margin: 0;
2226
+ margin-right: 8px;
2227
+ display: inline-flex;
2228
+ align-items: center;
2229
+ border: none;
2230
+ & .ant-tag-close-icon {
2231
+ width: 16px;
2232
+ height: 16px;
2233
+ color: inherit;
2234
+ margin-left: 4px;
2235
+ opacity: 0.6;
2236
+ display: inline-flex;
2237
+ &:hover {
2238
+ opacity: 1;
2239
+ }
2240
+ }
2241
+ &.ant-tag-blue {
2242
+ color: $fills-light-general-general;
2243
+ background-color: $fills-light-general-general-light;
2244
+ }
2245
+ &.ant-tag-red {
2246
+ color: $fills-light-serious-serious;
2247
+ background-color: $fills-light-serious-serious-light;
2248
+ }
2249
+ &.ant-tag-yellow {
2250
+ color: $fills-light-notice-notice-dark;
2251
+ background-color: $fills-light-notice-notice-light;
2252
+ }
2253
+ &.ant-tag-green {
2254
+ color: $fills-light-positive-positive-dark;
2255
+ background-color: $fills-light-positive-positive-light;
2256
+ }
2257
+ &.ant-tag-gray {
2258
+ color: $text-light-super;
2259
+ background-color: $fills-element-light-container-general;
2260
+ }
2261
+ &.ant-tag-purple {
2262
+ color: $text-colorful-purple;
2263
+ background-color: $fill-purple-light;
2264
+ }
2265
+
2266
+ &.ui-kit-token-checked {
2267
+ color: $text-light-on-tint;
2268
+ &.ant-tag-red {
2269
+ background-color: $fills-light-serious-serious;
2270
+ }
2271
+ &.ant-tag-yellow {
2272
+ background-color: $fills-light-notice-notice;
2273
+ }
2274
+ &.ant-tag-green {
2275
+ background-color: $fills-light-positive-positive;
2276
+ }
2277
+ &.ant-tag-blue {
2278
+ background-color: $fills-light-general-general;
2279
+ }
2280
+ &.ant-tag-gray {
2281
+ background-color: $gray-70;
2282
+ }
2283
+ &.ant-tag-purple {
2284
+ background-color: $fill-purple-base;
2285
+ }
2286
+ }
2287
+ }
2288
+ }
2289
+
2290
+
2291
+ .E_iq1gosr {
2292
+ display: inline-block;
2293
+ }
2294
+
2295
+
2296
+ .E_t1m2x205 {
2297
+ .ant-tooltip-arrow {
2298
+ display: none;
2299
+ }
2300
+ .ant-tooltip-inner {
2301
+ background: $gray-a80-9;
2302
+ border-radius: 4px;
2303
+ &:has(.eagle-ellipsis-content) {
2304
+ visibility: hidden;
2305
+ }
2306
+ }
2307
+ }
2308
+
2309
+
2266
2310
  .E_dsnbhzf {
2267
2311
  @include Inter(bold);
2268
2312
  font-size: 32px;
@@ -2617,92 +2661,56 @@
2617
2661
  }
2618
2662
 
2619
2663
 
2620
- .E_s1sck0th {
2621
- padding: 0 8px;
2622
- border-radius: 4px;
2623
- }
2624
-
2625
- .E_m855nr1 {
2626
- padding: 2px 8px;
2627
- border-radius: 3px;
2628
- }
2664
+ .E_m196gn1d {
2665
+ min-width: 1280px;
2666
+ }
2629
2667
 
2630
- .E_l1270xpg {
2631
- padding: 3px 8px;
2632
- border-radius: 2px;
2633
- }
2634
2668
 
2635
- .E_t14rextb {
2636
- &.ant-tag:hover {
2637
- opacity: unset;
2669
+ .E_a1b5xrg3 {
2670
+ .user-icon-inner {
2671
+ display: inline-flex;
2672
+ align-items: center;
2673
+ justify-content: center;
2674
+ color: $white;
2675
+ font-weight: bold;
2676
+ font-size: 12px;
2677
+ width: 24px;
2678
+ height: 24px;
2679
+ border-radius: 50%;
2680
+ background: var(--a1b5xrg3-0);
2638
2681
  }
2639
- &.ant-tag.ui-kit-token:not(.ant-tag-hidden) {
2640
- margin: 0;
2641
- margin-right: 8px;
2682
+ &.btn-item {
2683
+ transition: all 160ms ease;
2684
+ cursor: pointer;
2685
+ width: 56px;
2686
+ height: 40px;
2642
2687
  display: inline-flex;
2643
2688
  align-items: center;
2644
- border: none;
2645
- & .ant-tag-close-icon {
2646
- width: 16px;
2647
- height: 16px;
2648
- color: inherit;
2649
- margin-left: 4px;
2650
- opacity: 0.6;
2651
- display: inline-flex;
2652
- &:hover {
2653
- opacity: 1;
2654
- }
2655
- }
2656
- &.ant-tag-blue {
2657
- color: $fills-light-general-general;
2658
- background-color: $fills-light-general-general-light;
2659
- }
2660
- &.ant-tag-red {
2661
- color: $fills-light-serious-serious;
2662
- background-color: $fills-light-serious-serious-light;
2663
- }
2664
- &.ant-tag-yellow {
2665
- color: $fills-light-notice-notice-dark;
2666
- background-color: $fills-light-notice-notice-light;
2667
- }
2668
- &.ant-tag-green {
2669
- color: $fills-light-positive-positive-dark;
2670
- background-color: $fills-light-positive-positive-light;
2671
- }
2672
- &.ant-tag-gray {
2673
- color: $text-light-super;
2674
- background-color: $fills-element-light-container-general;
2675
- }
2676
- &.ant-tag-purple {
2677
- color: $text-colorful-purple;
2678
- background-color: $fill-purple-light;
2689
+ justify-content: center;
2690
+ border-radius: 6px;
2691
+
2692
+ &:hover {
2693
+ box-shadow:
2694
+ 0px 0px 20px rgba(107, 125, 153, 0.18),
2695
+ 0px 25px 80px rgba(45, 58, 86, 0.3);
2679
2696
  }
2680
2697
 
2681
- &.ui-kit-token-checked {
2682
- color: $text-light-on-tint;
2683
- &.ant-tag-red {
2684
- background-color: $fills-light-serious-serious;
2685
- }
2686
- &.ant-tag-yellow {
2687
- background-color: $fills-light-notice-notice;
2688
- }
2689
- &.ant-tag-green {
2690
- background-color: $fills-light-positive-positive;
2691
- }
2692
- &.ant-tag-blue {
2693
- background-color: $fills-light-general-general;
2694
- }
2695
- &.ant-tag-gray {
2696
- background-color: $gray-70;
2697
- }
2698
- &.ant-tag-purple {
2699
- background-color: $fill-purple-base;
2700
- }
2698
+ &:active {
2699
+ transform: translateY(2px);
2700
+ transition: all 320ms ease;
2701
2701
  }
2702
2702
  }
2703
2703
  }
2704
2704
 
2705
2705
 
2706
+ .E_c1yyuluq {
2707
+ border-radius: 8px;
2708
+ .ant-card-body {
2709
+ padding: 20px 24px 24px 24px;
2710
+ }
2711
+ }
2712
+
2713
+
2706
2714
  .E_ccrbeuz {
2707
2715
  .ant-collapse-item {
2708
2716
  border: 0px;
@@ -2735,14 +2743,6 @@
2735
2743
  }
2736
2744
 
2737
2745
 
2738
- .E_c1yyuluq {
2739
- border-radius: 8px;
2740
- .ant-card-body {
2741
- padding: 20px 24px 24px 24px;
2742
- }
2743
- }
2744
-
2745
-
2746
2746
  .E_b1lj76ty {
2747
2747
  width: 100%;
2748
2748
  height: 100%;
@@ -2781,73 +2781,6 @@
2781
2781
  }
2782
2782
 
2783
2783
 
2784
- .E_suhck3k {
2785
- height: 24px;
2786
- width: 24px;
2787
- border-radius: 6px;
2788
- padding: 4px;
2789
- &:hover {
2790
- background-color: $fill-outstanding-light;
2791
- svg {
2792
- path {
2793
- fill: blue;
2794
- }
2795
- }
2796
- }
2797
- }
2798
-
2799
-
2800
- .E_ryby9ds {
2801
- display: flex;
2802
- align-items: center;
2803
- .order {
2804
- height: 24px;
2805
- width: 24px;
2806
- border-radius: 20px;
2807
- color: $text-light-general;
2808
- background: $fill-light-element-container-outstanding;
2809
- display: flex;
2810
- align-items: center;
2811
- justify-content: center;
2812
- margin-right: 6px;
2813
- }
2814
- }
2815
-
2816
-
2817
- .E_m5foqp8 {
2818
- &.medium {
2819
- --footer-height: 96px;
2820
- --modal-content-width: 720px;
2821
- --modal-content-min-height: 200px;
2822
- --modal-header-padding: 40px 60px 8px;
2823
- --modal-content-padding-top: 24px;
2824
- --modal-content-padding-bottom: 32px;
2825
- --modal-content-padding-x: 60px;
2826
- --modal-footer-padding: 0 60px;
2827
-
2828
- &.content-full.ant-modal {
2829
- height: calc(100vh - 80px);
2830
- width: calc(100vw - 160px);
2831
- .ant-modal-content {
2832
- width: 100%;
2833
- height: 100%;
2834
- max-width: unset;
2835
- max-height: unset;
2836
- display: flex;
2837
- flex-direction: column;
2838
- }
2839
- .ant-modal-body {
2840
- flex: 1;
2841
- }
2842
- }
2843
-
2844
- .initializing-title {
2845
- height: 32px;
2846
- }
2847
- }
2848
- }
2849
-
2850
-
2851
2784
  .E_hrhfj7c {
2852
2785
  display: none;
2853
2786
  }
@@ -3040,6 +2973,22 @@
3040
2973
  }
3041
2974
 
3042
2975
 
2976
+ .E_suhck3k {
2977
+ height: 24px;
2978
+ width: 24px;
2979
+ border-radius: 6px;
2980
+ padding: 4px;
2981
+ &:hover {
2982
+ background-color: $fill-outstanding-light;
2983
+ svg {
2984
+ path {
2985
+ fill: blue;
2986
+ }
2987
+ }
2988
+ }
2989
+ }
2990
+
2991
+
3043
2992
  .E_s17wv897 {
3044
2993
  &.ant-select,
3045
2994
  &.ant-select div.ant-select-selector {
@@ -3142,6 +3091,57 @@
3142
3091
  }
3143
3092
 
3144
3093
 
3094
+ .E_ryby9ds {
3095
+ display: flex;
3096
+ align-items: center;
3097
+ .order {
3098
+ height: 24px;
3099
+ width: 24px;
3100
+ border-radius: 20px;
3101
+ color: $text-light-general;
3102
+ background: $fill-light-element-container-outstanding;
3103
+ display: flex;
3104
+ align-items: center;
3105
+ justify-content: center;
3106
+ margin-right: 6px;
3107
+ }
3108
+ }
3109
+
3110
+
3111
+ .E_m5foqp8 {
3112
+ &.medium {
3113
+ --footer-height: 96px;
3114
+ --modal-content-width: 720px;
3115
+ --modal-content-min-height: 200px;
3116
+ --modal-header-padding: 40px 60px 8px;
3117
+ --modal-content-padding-top: 24px;
3118
+ --modal-content-padding-bottom: 32px;
3119
+ --modal-content-padding-x: 60px;
3120
+ --modal-footer-padding: 0 60px;
3121
+
3122
+ &.content-full.ant-modal {
3123
+ height: calc(100vh - 80px);
3124
+ width: calc(100vw - 160px);
3125
+ .ant-modal-content {
3126
+ width: 100%;
3127
+ height: 100%;
3128
+ max-width: unset;
3129
+ max-height: unset;
3130
+ display: flex;
3131
+ flex-direction: column;
3132
+ }
3133
+ .ant-modal-body {
3134
+ flex: 1;
3135
+ }
3136
+ }
3137
+
3138
+ .initializing-title {
3139
+ height: 32px;
3140
+ }
3141
+ }
3142
+ }
3143
+
3144
+
3145
3145
  .E_s4ivdfu {
3146
3146
  &.ant-select {
3147
3147
  .ant-select-selection-placeholder {
@@ -3935,363 +3935,242 @@
3935
3935
  }
3936
3936
 
3937
3937
 
3938
- .E_ckui4s7 {
3939
- color: $text-primary-light;
3940
- line-height: 22px;
3941
- display: inline-flex;
3942
- .ant-checkbox { height: 22px; display: flex; align-items: center; top: 0; } .ant-checkbox-checked::after { border: none; } &.ant-checkbox-wrapper:hover .ant-checkbox-inner, &.ant-checkbox-wrapper.__pseudo-states-hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner { border-color: $fills-light-general-general; } .ant-checkbox .ant-checkbox-inner { border: 1px solid $strokes-light-trans-4; } .ant-checkbox.ant-checkbox-checked, .ant-checkbox.ant-checkbox-indeterminate { .ant-checkbox-inner { border: 1px solid $fills-light-general-general; } } .ant-checkbox.ant-checkbox-indeterminate .ant-checkbox-inner { background: $fills-light-general-general; &:after { background-color: $white; height: 2px; width: 10px; border-radius: 2px; } } &.ant-checkbox-wrapper-disabled { opacity: 0.5; .ant-checkbox-disabled .ant-checkbox-inner { background: $fills-light-trans-3; border-color: $strokes-light-trans-4 !important; } .ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner:after { border-color: $text-primary-light; } .ant-checkbox-disabled.ant-checkbox-indeterminate .ant-checkbox-inner:after { background: $text-primary-light; } } .ant-checkbox + span, .ant-checkbox-disabled + span { padding: 0; .main { display: inline-block; margin-left: 12px; color: $text-primary-light; } .sub { margin-left: 28px; color: $text-secondary-light; } } &.compact { .ant-checkbox + span, .ant-checkbox-disabled + span { .main { margin-left: 8px; } .sub { margin-left: 24px; } } }
3943
- }
3944
-
3938
+ .E_l48ei06 {
3939
+ @at-root {
3940
+ button#{&}.ant-btn,
3941
+ button#{&}.ant-btn.ant-btn-sm,
3942
+ button#{&}.ant-btn.ant-btn-lg {
3943
+ font-size: 12px;
3944
+ line-height: 18px;
3945
+ height: 18px;
3946
+ }
3947
+ button#{&} {
3948
+ color: #0080FF;
3949
+ height: unset;
3950
+ .button-prefix-icon {
3951
+ margin-right: 4px;
3952
+ }
3953
+ .button-suffix-icon {
3954
+ margin-left: 4px;
3955
+ }
3945
3956
 
3946
- .E_c1kghdax {
3947
- color: $text-primary-light;
3948
- padding: 7px 12px;
3949
- display: flex;
3950
- justify-content: space-between;
3951
- align-items: center;
3957
+ &:hover,
3958
+ &.__pseudo-states-hover {
3959
+ color: #009DFF;
3960
+ }
3952
3961
 
3953
- &.has-arrow {
3954
- padding-left: 10px;
3962
+ &:active,
3963
+ &.__pseudo-states-active {
3964
+ color: #005ED1;
3965
+ }
3966
+ &.ui-kit-link-disabled {
3967
+ color: #0080FF;
3968
+ }
3969
+ &.ui-kit-link-primary {
3970
+ color: #00122E;
3955
3971
 
3956
- .title-wrapper {
3957
- cursor: pointer;
3958
- color: $text-light-primary;
3972
+ &:hover,
3973
+ &.__pseudo-states-hover {
3974
+ color: #0080FF;
3975
+ }
3959
3976
 
3960
- &.is-open {
3961
- color: $text-primary-light;
3962
- font-weight: 600;
3977
+ &:active,
3978
+ &.__pseudo-states-active {
3979
+ color: #005ED1;
3980
+ }
3963
3981
 
3964
- .collapse-arrow {
3965
- transform: rotate(90deg);
3982
+ &.ui-kit-link-disabled {
3983
+ color: #00122E;
3966
3984
  }
3967
3985
  }
3968
- }
3969
- }
3970
3986
 
3971
- .sub-info {
3972
- font-size: 12px;
3973
- line-height: 18px;
3974
- }
3975
-
3976
- .title-wrapper {
3977
- display: flex;
3978
- align-items: center;
3979
- user-select: none;
3980
- flex-grow: 1;
3981
- font-size: 12px;
3982
- line-height: 18px;
3983
- color: $text-primary-light;
3984
- font-weight: 700;
3985
- }
3986
-
3987
- .collapse-arrow {
3988
- transition: all 50ms ease-out 0ms;
3989
- margin-right: 2px;
3990
- }
3991
- }
3992
-
3993
-
3994
- .E_t1tbywr9 {
3995
- width: 100%;
3996
- flex: 1;
3997
- display: flex;
3998
- flex-direction: column;
3987
+ &.ui-kit-link-secondary {
3988
+ color: #2C3852BF;
3999
3989
 
4000
- &.medium {
4001
- .tab-bar {
4002
- height: 32px;
3990
+ &:hover,
3991
+ &.__pseudo-states-hover {
3992
+ color: #0080FF;
3993
+ }
4003
3994
 
4004
- .common-tab-bar {
4005
- height: 32px;
3995
+ &:active,
3996
+ &.__pseudo-states-active {
3997
+ color: #005ED1;
3998
+ }
4006
3999
 
4007
- .tab-item-title {
4008
- height: 32px;
4009
- border-top-left-radius: 6px;
4010
- border-top-right-radius: 6px;
4011
- padding-right: 16px;
4012
- padding-left: 16px;
4013
- font-size: 16px;
4000
+ &.ui-kit-link-disabled {
4001
+ color: #2C3852BF;
4014
4002
  }
4015
4003
  }
4016
4004
  }
4017
4005
  }
4006
+ }
4018
4007
 
4019
- &.small {
4020
- .tab-bar {
4021
- height: 24px;
4022
-
4023
- .common-tab-bar {
4024
- height: 24px;
4025
4008
 
4026
- .tab-item-title {
4027
- height: 24px;
4028
- border-top-left-radius: 4px;
4029
- border-top-right-radius: 4px;
4030
- padding-right: 12px;
4031
- padding-left: 12px;
4032
- font-size: 14px;
4033
- }
4034
- }
4035
- }
4036
- }
4037
-
4038
- .tab-bar {
4039
- max-width: 100%;
4040
- display: flex;
4041
- place-items: center;
4042
- border-bottom: 1px solid $fills-trans-terdiary-light;
4009
+ .E_l1ucdodl {
4010
+ $prefix: ui-kit-status-legend;
4011
+ margin: 0;
4012
+ border-radius: 20px;
4013
+ padding: 2px 10px;
4014
+ height: 22px;
4015
+ display: flex;
4016
+ align-items: center;
4043
4017
 
4044
- .common-tab-bar {
4045
- overflow: hidden;
4046
- display: flex;
4047
- place-items: center;
4018
+ &.ui-kit-status-legend.on-tint {
4019
+ color: $text-neutral-ontint;
4020
+ }
4021
+ &.tag-hover {
4022
+ cursor: pointer;
4023
+ }
4048
4024
 
4049
- .tab-item-title {
4050
- &:first-child:not(.__selected):not(:hover) {
4051
- padding-left: 0px;
4052
- }
4025
+ &.#{$prefix} {
4026
+ color: $text-neutral-primary;
4027
+ .#{$prefix}-icon {
4028
+ margin-right: 6px;
4029
+ }
4030
+ .#{$prefix}-number {
4031
+ margin-left: 8px;
4032
+ color: #2C385299;
4033
+ &.#{$prefix}-number.on-tint {
4034
+ color: $text-neutral-ontint;
4053
4035
  }
4054
-
4055
- & + .tab-item-title {
4056
- margin-left: 12px;
4057
- position: relative;
4058
-
4059
- &::before {
4060
- content: "";
4061
- width: 1px;
4062
- height: 24px;
4063
- background: $strokes-light-trans-3;
4064
- position: absolute;
4065
- left: -6px;
4066
- top: 50%;
4067
- transform: translateY(-50%);
4068
- }
4036
+ }
4037
+ &.eagle-legend-blue {
4038
+ .#{$prefix}-icon {
4039
+ background-color: $fill-outstanding-base;
4069
4040
  }
4070
4041
  }
4071
-
4072
- .tab-item-title {
4073
- flex-shrink: 0;
4074
- display: flex;
4075
- place-items: center;
4076
- cursor: pointer;
4077
- color: $text-neutral-secondary;
4078
- transition:
4079
- color 100ms ease-out,
4080
- background-color 100ms ease-out,
4081
- padding-left 320ms ease 80ms;
4082
-
4083
- &:hover {
4084
- padding-left: 16px;
4085
- color: $text-light-general;
4086
- background: $fill-outstanding-lighthover;
4042
+ &.eagle-legend-red {
4043
+ .#{$prefix}-icon {
4044
+ background-color: $fill-serious-base;
4087
4045
  }
4088
-
4089
- & + .tab-item-title {
4090
- margin-left: 2px;
4046
+ }
4047
+ &.eagle-legend-yellow {
4048
+ .#{$prefix}-icon {
4049
+ background-color: $fill-notice-base;
4091
4050
  }
4092
-
4093
- &.more {
4094
- &:not(.__selected) {
4095
- width: 16px;
4096
- height: 16px;
4097
- padding: 0;
4098
- border-radius: 2px;
4099
- margin-left: 8px;
4100
- }
4101
-
4102
- &.__selected.tab-title-text {
4103
- margin-left: 8px;
4104
- }
4051
+ }
4052
+ &.eagle-legend-green {
4053
+ .#{$prefix}-icon {
4054
+ background-color: $fill-positive-base;
4105
4055
  }
4106
-
4107
- &.__selected {
4108
- padding-left: 16px;
4109
- background: $fills-light-general-general-light;
4110
- color: $text-light-general;
4056
+ }
4057
+ &.eagle-legend-gray {
4058
+ .#{$prefix}-icon:not(.ui-kit-status-legend-icon-loading) {
4059
+ background-color: $gray-70;
4111
4060
  }
4112
-
4113
- &.__hidden {
4114
- display: none;
4061
+ }
4062
+ &.eagle-legend-purple {
4063
+ .#{$prefix}-icon:not(.ui-kit-status-legend-icon-loading) {
4064
+ background-color: $purple-50;
4115
4065
  }
4116
4066
  }
4117
4067
  }
4118
4068
  }
4119
4069
 
4120
- .E_ti12z2 {
4121
- &.ant-dropdown-open {
4122
- color: $text-light-general;
4123
- background: $fills-light-trans-3;
4124
- }
4070
+ .E_s1qj66nc {
4071
+ width: 8px;
4072
+ height: 8px;
4073
+ border-radius: 50%;
4074
+ display: inline-block;
4125
4075
  }
4126
4076
 
4127
- .E_m19lu3v {
4128
- cursor: default;
4129
- & .menu-wrapper {
4130
- min-width: 160px;
4131
- max-width: 400px;
4132
- padding: 6px;
4133
- background: $white;
4134
- box-shadow:
4135
- 0px 0px 10px rgba(107, 125, 153, 0.18),
4136
- 0px 12px 40px rgba(45, 58, 86, 0.3);
4137
- border-radius: 8px;
4138
- max-height: calc(100vh - 250px);
4139
- overflow: auto;
4077
+ .E_s5x1boq {
4078
+ width: 8px;
4079
+ height: 8px;
4080
+ border-radius: 2px;
4081
+ display: inline-block;
4082
+ }
4140
4083
 
4141
- & .tab-menu-item {
4142
- display: flex;
4143
- place-items: center;
4144
- width: var(--itemWidth);
4084
+ .E_c1xm185 {
4085
+ color: #2C385299;
4086
+ }
4145
4087
 
4146
- & + .tab-menu-item {
4147
- margin-top: 8px;
4148
- }
4088
+ .E_c1x5l5qc {
4089
+ flex: 1;
4090
+ }
4149
4091
 
4150
- &.__selected {
4151
- padding: 6px;
4152
- background: $fills-light-general-general-light;
4153
- color: $text-light-general;
4154
4092
 
4155
- &E_l1fbkbzo {
4156
- @include Inter(bold !important);
4157
- }
4158
- }
4093
+ .E_sddwhm6 {
4094
+ $prefix: ui-kit-status-capsule;
4095
+ margin: 0;
4096
+ border-radius: 20px;
4097
+ padding: 2px 10px;
4098
+ height: 22px;
4159
4099
 
4160
- &.ant-dropdown-menu-item {
4161
- padding: 5px 12px;
4162
- border-radius: 4px;
4100
+ &.ant-tag.#{$prefix}.off-white {
4101
+ background-color: $fill-neutral-trans-1 !important;
4102
+ &.tag-hover:hover,
4103
+ &.__pseudo-states-hover {
4104
+ background-color: $fill-neutral-trans-2 !important;
4105
+ }
4106
+ }
4107
+ &.ant-tag.#{$prefix} {
4108
+ color: $text-neutral-primary;
4109
+ .#{$prefix}-icon {
4110
+ margin-right: 6px;
4111
+ }
4112
+ .#{$prefix}-number {
4113
+ margin-left: 8px;
4114
+ color: #2C385299;
4115
+ }
4116
+ &.ant-tag-blue {
4117
+ background-color: $fill-outstanding-light;
4118
+ .#{$prefix}-icon {
4119
+ background-color: $fill-outstanding-base;
4163
4120
  }
4164
-
4165
- &.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):hover {
4166
- color: $text-light-general;
4167
- background: $fills-light-trans-3;
4121
+ &.tag-hover:hover,
4122
+ &.__pseudo-states-hover {
4123
+ background-color: $fill-outstanding-light-hover;
4168
4124
  }
4169
-
4170
- &-text {
4171
- text-align: left;
4172
- flex: 1;
4173
- overflow: hidden;
4174
- text-overflow: ellipsis;
4175
- white-space: nowrap;
4125
+ }
4126
+ &.ant-tag-red {
4127
+ background-color: $fill-serious-light;
4128
+ .#{$prefix}-icon {
4129
+ background-color: $fill-serious-base;
4130
+ }
4131
+ &.tag-hover:hover,
4132
+ &.__pseudo-states-hover {
4133
+ background-color: $fill-serious-light-hover;
4134
+ }
4135
+ }
4136
+ &.ant-tag-yellow {
4137
+ background-color: $fill-notice-light;
4138
+ .#{$prefix}-icon {
4139
+ background-color: $fill-notice-base;
4140
+ }
4141
+ &.tag-hover:hover,
4142
+ &.__pseudo-states-hover {
4143
+ background-color: $fill-notice-light-hover;
4144
+ }
4145
+ }
4146
+ &.ant-tag-green {
4147
+ background-color: $fill-positive-light;
4148
+ .#{$prefix}-icon {
4149
+ background-color: $fill-positive-base;
4150
+ }
4151
+ &.tag-hover:hover,
4152
+ &.__pseudo-states-hover {
4153
+ background-color: $fill-positive-light-hover;
4154
+ }
4155
+ }
4156
+ &.ant-tag-gray {
4157
+ background-color: $fill-neutral-trans-2;
4158
+ .#{$prefix}-icon:not(.ui-kit-status-capsule-icon-loading) {
4159
+ background-color: $gray-70;
4160
+ }
4161
+ &.tag-hover:hover,
4162
+ &.__pseudo-states-hover {
4163
+ background-color: $fill-neutral-trans-3-trans-2-hover;
4176
4164
  }
4177
4165
  }
4178
4166
  }
4179
4167
  }
4180
4168
 
4181
- .E_i1bmwe2m {
4182
- margin: auto;
4183
- cursor: pointer;
4184
- line-height: normal;
4185
- height: 16px;
4186
- margin-right: 3px;
4187
-
4188
- .icon-inner {
4189
- display: block;
4190
- height: 16px;
4191
- }
4192
- }
4193
-
4194
-
4195
- .E_b14q2gmw {
4196
- box-shadow: 0px 0.119595px 0.438513px rgba(129, 138, 153, 0.14),
4197
- 0px 0.271728px 0.996336px rgba(129, 138, 153, 0.106447),
4198
- 0px 0.472931px 1.73408px rgba(129, 138, 153, 0.0912224),
4199
- 0px 0.751293px 2.75474px rgba(129, 138, 153, 0.0799253),
4200
- 0px 1.15919px 4.25036px rgba(129, 138, 153, 0.07),
4201
- 0px 1.80882px 6.63236px rgba(129, 138, 153, 0.0600747),
4202
- 0px 3.00293px 11.0107px rgba(129, 138, 153, 0.0487776),
4203
- 0px 6px 22px rgba(129, 138, 153, 0.0335534);
4204
- }
4205
-
4206
- .E_c1eym6el {
4207
- border-radius: 8px;
4208
- background-color: white;
4209
- &.hoverable {
4210
- cursor: pointer;
4211
-
4212
- &:hover {
4213
- transition: all 200ms ease;
4214
- box-shadow: 0px 9px 22px rgb(107 125 153 / 23%),
4215
- 0px 1.12694px 2.75474px rgb(107 125 153 / 12%);
4216
- transform: translateY(-4px);
4217
- }
4218
- }
4219
- }
4220
-
4221
-
4222
- .E_c1yd35n {
4223
- padding: 0 12px 14px 12px;
4224
- }
4225
-
4226
-
4227
- .E_l48ei06 {
4228
- @at-root {
4229
- button#{&}.ant-btn,
4230
- button#{&}.ant-btn.ant-btn-sm,
4231
- button#{&}.ant-btn.ant-btn-lg {
4232
- font-size: 12px;
4233
- line-height: 18px;
4234
- height: 18px;
4235
- }
4236
- button#{&} {
4237
- color: #0080FF;
4238
- height: unset;
4239
- .button-prefix-icon {
4240
- margin-right: 4px;
4241
- }
4242
- .button-suffix-icon {
4243
- margin-left: 4px;
4244
- }
4245
-
4246
- &:hover,
4247
- &.__pseudo-states-hover {
4248
- color: #009DFF;
4249
- }
4250
-
4251
- &:active,
4252
- &.__pseudo-states-active {
4253
- color: #005ED1;
4254
- }
4255
- &.ui-kit-link-disabled {
4256
- color: #0080FF;
4257
- }
4258
- &.ui-kit-link-primary {
4259
- color: #00122E;
4260
-
4261
- &:hover,
4262
- &.__pseudo-states-hover {
4263
- color: #0080FF;
4264
- }
4265
-
4266
- &:active,
4267
- &.__pseudo-states-active {
4268
- color: #005ED1;
4269
- }
4270
-
4271
- &.ui-kit-link-disabled {
4272
- color: #00122E;
4273
- }
4274
- }
4275
-
4276
- &.ui-kit-link-secondary {
4277
- color: #2C3852BF;
4278
-
4279
- &:hover,
4280
- &.__pseudo-states-hover {
4281
- color: #0080FF;
4282
- }
4283
-
4284
- &:active,
4285
- &.__pseudo-states-active {
4286
- color: #005ED1;
4287
- }
4288
-
4289
- &.ui-kit-link-disabled {
4290
- color: #2C3852BF;
4291
- }
4292
- }
4293
- }
4294
- }
4169
+ .E_satwmqm {
4170
+ width: 8px;
4171
+ height: 8px;
4172
+ border-radius: 50%;
4173
+ display: inline-block;
4295
4174
  }
4296
4175
 
4297
4176
 
@@ -4733,173 +4612,532 @@
4733
4612
  }
4734
4613
 
4735
4614
 
4736
- .E_l1ucdodl {
4737
- $prefix: ui-kit-status-legend;
4738
- margin: 0;
4739
- border-radius: 20px;
4740
- padding: 2px 10px;
4741
- height: 22px;
4615
+ .E_ckui4s7 {
4616
+ color: $text-primary-light;
4617
+ line-height: 22px;
4618
+ display: inline-flex;
4619
+ .ant-checkbox { height: 22px; display: flex; align-items: center; top: 0; } .ant-checkbox-checked::after { border: none; } &.ant-checkbox-wrapper:hover .ant-checkbox-inner, &.ant-checkbox-wrapper.__pseudo-states-hover .ant-checkbox-inner, .ant-checkbox:hover .ant-checkbox-inner { border-color: $fills-light-general-general; } .ant-checkbox .ant-checkbox-inner { border: 1px solid $strokes-light-trans-4; } .ant-checkbox.ant-checkbox-checked, .ant-checkbox.ant-checkbox-indeterminate { .ant-checkbox-inner { border: 1px solid $fills-light-general-general; } } .ant-checkbox.ant-checkbox-indeterminate .ant-checkbox-inner { background: $fills-light-general-general; &:after { background-color: $white; height: 2px; width: 10px; border-radius: 2px; } } &.ant-checkbox-wrapper-disabled { opacity: 0.5; .ant-checkbox-disabled .ant-checkbox-inner { background: $fills-light-trans-3; border-color: $strokes-light-trans-4 !important; } .ant-checkbox-disabled.ant-checkbox-checked .ant-checkbox-inner:after { border-color: $text-primary-light; } .ant-checkbox-disabled.ant-checkbox-indeterminate .ant-checkbox-inner:after { background: $text-primary-light; } } .ant-checkbox + span, .ant-checkbox-disabled + span { padding: 0; .main { display: inline-block; margin-left: 12px; color: $text-primary-light; } .sub { margin-left: 28px; color: $text-secondary-light; } } &.compact { .ant-checkbox + span, .ant-checkbox-disabled + span { .main { margin-left: 8px; } .sub { margin-left: 24px; } } }
4620
+ }
4621
+
4622
+
4623
+ .E_c1yd35n {
4624
+ padding: 0 12px 14px 12px;
4625
+ }
4626
+
4627
+
4628
+ .E_c1kghdax {
4629
+ color: $text-primary-light;
4630
+ padding: 7px 12px;
4742
4631
  display: flex;
4632
+ justify-content: space-between;
4743
4633
  align-items: center;
4744
4634
 
4745
- &.ui-kit-status-legend.on-tint {
4746
- color: $text-neutral-ontint;
4747
- }
4748
- &.tag-hover {
4749
- cursor: pointer;
4750
- }
4635
+ &.has-arrow {
4636
+ padding-left: 10px;
4751
4637
 
4752
- &.#{$prefix} {
4753
- color: $text-neutral-primary;
4754
- .#{$prefix}-icon {
4755
- margin-right: 6px;
4756
- }
4757
- .#{$prefix}-number {
4758
- margin-left: 8px;
4759
- color: #2C385299;
4760
- &.#{$prefix}-number.on-tint {
4761
- color: $text-neutral-ontint;
4762
- }
4763
- }
4764
- &.eagle-legend-blue {
4765
- .#{$prefix}-icon {
4766
- background-color: $fill-outstanding-base;
4767
- }
4768
- }
4769
- &.eagle-legend-red {
4770
- .#{$prefix}-icon {
4771
- background-color: $fill-serious-base;
4772
- }
4773
- }
4774
- &.eagle-legend-yellow {
4775
- .#{$prefix}-icon {
4776
- background-color: $fill-notice-base;
4777
- }
4778
- }
4779
- &.eagle-legend-green {
4780
- .#{$prefix}-icon {
4781
- background-color: $fill-positive-base;
4782
- }
4783
- }
4784
- &.eagle-legend-gray {
4785
- .#{$prefix}-icon:not(.ui-kit-status-legend-icon-loading) {
4786
- background-color: $gray-70;
4787
- }
4788
- }
4789
- &.eagle-legend-purple {
4790
- .#{$prefix}-icon:not(.ui-kit-status-legend-icon-loading) {
4791
- background-color: $purple-50;
4638
+ .title-wrapper {
4639
+ cursor: pointer;
4640
+ color: $text-light-primary;
4641
+
4642
+ &.is-open {
4643
+ color: $text-primary-light;
4644
+ font-weight: 600;
4645
+
4646
+ .collapse-arrow {
4647
+ transform: rotate(90deg);
4648
+ }
4792
4649
  }
4793
4650
  }
4794
4651
  }
4795
- }
4796
4652
 
4797
- .E_s1qj66nc {
4798
- width: 8px;
4799
- height: 8px;
4800
- border-radius: 50%;
4801
- display: inline-block;
4802
- }
4653
+ .sub-info {
4654
+ font-size: 12px;
4655
+ line-height: 18px;
4656
+ }
4803
4657
 
4804
- .E_s5x1boq {
4805
- width: 8px;
4806
- height: 8px;
4807
- border-radius: 2px;
4808
- display: inline-block;
4658
+ .title-wrapper {
4659
+ display: flex;
4660
+ align-items: center;
4661
+ user-select: none;
4662
+ flex-grow: 1;
4663
+ font-size: 12px;
4664
+ line-height: 18px;
4665
+ color: $text-primary-light;
4666
+ font-weight: 700;
4667
+ }
4668
+
4669
+ .collapse-arrow {
4670
+ transition: all 50ms ease-out 0ms;
4671
+ margin-right: 2px;
4672
+ }
4809
4673
  }
4810
4674
 
4811
- .E_c1xm185 {
4812
- color: #2C385299;
4813
- }
4814
4675
 
4815
- .E_c1x5l5qc {
4816
- flex: 1;
4817
- }
4676
+ .E_m11nzl2x {
4677
+ color: $text-light-secondary;
4678
+ text-align: center;
4818
4679
 
4680
+ display: flex;
4681
+ align-items: center;
4682
+ justify-content: center;
4683
+ flex-direction: column;
4684
+ height: 100%;
4819
4685
 
4820
- .E_sddwhm6 {
4821
- $prefix: ui-kit-status-capsule;
4822
- margin: 0;
4823
- border-radius: 20px;
4824
- padding: 2px 10px;
4825
- height: 22px;
4686
+ .link {
4687
+ color: $text-light-general;
4688
+ cursor: pointer;
4689
+ }
4690
+ }
4826
4691
 
4827
- &.ant-tag.#{$prefix}.off-white {
4828
- background-color: $fill-neutral-trans-1 !important;
4829
- &.tag-hover:hover,
4830
- &.__pseudo-states-hover {
4831
- background-color: $fill-neutral-trans-2 !important;
4692
+ .E_mn7joto {
4693
+ width: 100%;
4694
+ height: 100%;
4695
+ display: flex;
4696
+ flex-direction: column;
4697
+
4698
+ .name-toolbar {
4699
+ width: 100%;
4700
+ display: flex;
4701
+ line-height: 30px;
4702
+ justify-content: space-between;
4703
+ .metric-extra {
4704
+ display: flex;
4705
+ font-size: 12px;
4706
+ align-items: center;
4707
+
4708
+ .info-item {
4709
+ color: $gray-60;
4710
+ }
4711
+ .info-item + .info-item {
4712
+ margin-left: 10px;
4713
+ }
4714
+
4715
+ .menu-trigger {
4716
+ margin-left: 10px;
4717
+ cursor: pointer;
4718
+ }
4832
4719
  }
4833
4720
  }
4834
- &.ant-tag.#{$prefix} {
4835
- color: $text-neutral-primary;
4836
- .#{$prefix}-icon {
4837
- margin-right: 6px;
4721
+
4722
+ .content {
4723
+ flex: 1;
4724
+ width: 100%;
4725
+ display: flex;
4726
+ justify-content: center;
4727
+ align-items: center;
4728
+ }
4729
+ .single-content {
4730
+ height: 65px;
4731
+ }
4732
+ }
4733
+
4734
+ .E_l1bifhon {
4735
+ display: flex;
4736
+ align-items: center;
4737
+ white-space: nowrap;
4738
+ overflow: hidden;
4739
+ width: 100%;
4740
+
4741
+ .ant-dropdown-trigger {
4742
+ font-size: 12px;
4743
+ margin-left: 8px;
4744
+ }
4745
+ }
4746
+
4747
+ .E_ltthzck {
4748
+ display: flex;
4749
+ justify-content: flex-start;
4750
+ align-items: center;
4751
+ font-size: 12px;
4752
+ cursor: pointer;
4753
+ &:not(:first-child) {
4754
+ margin-left: 8px;
4755
+ }
4756
+
4757
+ &.deselected,
4758
+ &.hovering {
4759
+ opacity: 0.3;
4760
+
4761
+ &:not(.hoverering-self) .color-block {
4762
+ background: #b4beca !important;
4763
+ border-radius: 2px;
4838
4764
  }
4839
- .#{$prefix}-number {
4840
- margin-left: 8px;
4841
- color: #2C385299;
4765
+ }
4766
+ &.hoverering-self {
4767
+ opacity: 1;
4768
+ }
4769
+ .dropdown-trigger {
4770
+ margin-left: 12px;
4771
+ }
4772
+ .legend-name {
4773
+ color: $text-light-primary;
4774
+ }
4775
+ .icon-suffix-wrapper {
4776
+ display: flex;
4777
+ align-items: center;
4778
+ margin-left: 4px;
4779
+ }
4780
+ }
4781
+
4782
+ .E_l1mumj7o {
4783
+ display: flex;
4784
+ justify-content: flex-start;
4785
+ align-items: center;
4786
+ font-size: 12px;
4787
+ cursor: pointer;
4788
+
4789
+ &.deselected,
4790
+ &.hovering {
4791
+ opacity: 0.3;
4792
+
4793
+ &:not(.hoverering-self) .color-block {
4794
+ background: #b4beca !important;
4795
+ border-radius: 2px;
4842
4796
  }
4843
- &.ant-tag-blue {
4844
- background-color: $fill-outstanding-light;
4845
- .#{$prefix}-icon {
4846
- background-color: $fill-outstanding-base;
4797
+ }
4798
+ .legend-name {
4799
+ color: $text-light-primary;
4800
+ }
4801
+ &.hoverering-self {
4802
+ opacity: 1;
4803
+ }
4804
+ .icon-suffix-wrapper {
4805
+ margin-left: 4px;
4806
+ display: flex;
4807
+ align-items: center;
4808
+ }
4809
+ }
4810
+
4811
+ .E_c14rn6j5 {
4812
+ display: inline-block;
4813
+ height: 8px;
4814
+ width: 8px;
4815
+ margin-right: 6px;
4816
+ border-radius: 2px;
4817
+ }
4818
+
4819
+ .E_e45tc5l {
4820
+ .ant-dropdown-menu-item {
4821
+ display: flex;
4822
+ align-items: center;
4823
+ font-size: 12px;
4824
+ margin: 0;
4825
+ }
4826
+ }
4827
+
4828
+ .E_lqeaosa {
4829
+ position: relative;
4830
+
4831
+ &.hidden-xaxis .pointer-wrapper {
4832
+ bottom: -12px;
4833
+ }
4834
+
4835
+ .metric-toolbar {
4836
+ display: flex;
4837
+ justify-content: space-between;
4838
+ line-height: 30px;
4839
+ .metric-extra {
4840
+ display: flex;
4841
+ flex-shrink: 0;
4842
+ font-size: 12px;
4843
+ align-items: center;
4844
+
4845
+ .info-item {
4846
+ color: $gray-60;
4847
4847
  }
4848
- &.tag-hover:hover,
4849
- &.__pseudo-states-hover {
4850
- background-color: $fill-outstanding-light-hover;
4848
+ .info-item + .info-item {
4849
+ margin-left: 10px;
4850
+ }
4851
+
4852
+ .menu-trigger {
4853
+ margin-left: 10px;
4854
+ cursor: pointer;
4851
4855
  }
4852
4856
  }
4853
- &.ant-tag-red {
4854
- background-color: $fill-serious-light;
4855
- .#{$prefix}-icon {
4856
- background-color: $fill-serious-base;
4857
+ }
4858
+
4859
+ .recharts-xAxis {
4860
+ font-size: 12px;
4861
+ }
4862
+
4863
+ .pointer-wrapper {
4864
+ position: absolute;
4865
+ bottom: 10px;
4866
+ padding: 0 8px;
4867
+ font-size: 12px;
4868
+ color: $white;
4869
+ transform: translateX(-50%);
4870
+ }
4871
+ }
4872
+
4873
+ .E_t2pr38p {
4874
+ min-width: 200px;
4875
+ background-color: $fill-neutral-trans-8;
4876
+ border-radius: 4px;
4877
+ box-shadow: 0px 1px 4px 0px rgba(29, 50, 108, 0.6);
4878
+ padding: 8px;
4879
+ }
4880
+
4881
+ .E_tecdsj7 {
4882
+ display: flex;
4883
+ align-items: center;
4884
+ background-color: unset;
4885
+ color: $text-neutral-ontint;
4886
+ justify-content: space-between;
4887
+ font-size: 12px;
4888
+ padding-top: 6px;
4889
+
4890
+ &:first-child {
4891
+ padding-top: 3px;
4892
+ }
4893
+ &:last-child {
4894
+ padding-bottom: 3px;
4895
+ }
4896
+ .column-value {
4897
+ color: $text-neutral-ontint;
4898
+ margin-left: 8px;
4899
+ }
4900
+ }
4901
+
4902
+ .E_ljhvvia {
4903
+ display: inline-block;
4904
+ height: 8px;
4905
+ width: 8px;
4906
+ margin-right: 8px;
4907
+ border-radius: 2px;
4908
+ &.borderd {
4909
+ border: 1px solid $stroke-neutral-white;
4910
+ }
4911
+ }
4912
+
4913
+
4914
+ .E_t1tbywr9 {
4915
+ width: 100%;
4916
+ flex: 1;
4917
+ display: flex;
4918
+ flex-direction: column;
4919
+
4920
+ &.medium {
4921
+ .tab-bar {
4922
+ height: 32px;
4923
+
4924
+ .common-tab-bar {
4925
+ height: 32px;
4926
+
4927
+ .tab-item-title {
4928
+ height: 32px;
4929
+ border-top-left-radius: 6px;
4930
+ border-top-right-radius: 6px;
4931
+ padding-right: 16px;
4932
+ padding-left: 16px;
4933
+ font-size: 16px;
4934
+ }
4857
4935
  }
4858
- &.tag-hover:hover,
4859
- &.__pseudo-states-hover {
4860
- background-color: $fill-serious-light-hover;
4936
+ }
4937
+ }
4938
+
4939
+ &.small {
4940
+ .tab-bar {
4941
+ height: 24px;
4942
+
4943
+ .common-tab-bar {
4944
+ height: 24px;
4945
+
4946
+ .tab-item-title {
4947
+ height: 24px;
4948
+ border-top-left-radius: 4px;
4949
+ border-top-right-radius: 4px;
4950
+ padding-right: 12px;
4951
+ padding-left: 12px;
4952
+ font-size: 14px;
4953
+ }
4861
4954
  }
4862
4955
  }
4863
- &.ant-tag-yellow {
4864
- background-color: $fill-notice-light;
4865
- .#{$prefix}-icon {
4866
- background-color: $fill-notice-base;
4956
+ }
4957
+
4958
+ .tab-bar {
4959
+ max-width: 100%;
4960
+ display: flex;
4961
+ place-items: center;
4962
+ border-bottom: 1px solid $fills-trans-terdiary-light;
4963
+
4964
+ .common-tab-bar {
4965
+ overflow: hidden;
4966
+ display: flex;
4967
+ place-items: center;
4968
+
4969
+ .tab-item-title {
4970
+ &:first-child:not(.__selected):not(:hover) {
4971
+ padding-left: 0px;
4972
+ }
4867
4973
  }
4868
- &.tag-hover:hover,
4869
- &.__pseudo-states-hover {
4870
- background-color: $fill-notice-light-hover;
4974
+
4975
+ & + .tab-item-title {
4976
+ margin-left: 12px;
4977
+ position: relative;
4978
+
4979
+ &::before {
4980
+ content: "";
4981
+ width: 1px;
4982
+ height: 24px;
4983
+ background: $strokes-light-trans-3;
4984
+ position: absolute;
4985
+ left: -6px;
4986
+ top: 50%;
4987
+ transform: translateY(-50%);
4988
+ }
4871
4989
  }
4872
4990
  }
4873
- &.ant-tag-green {
4874
- background-color: $fill-positive-light;
4875
- .#{$prefix}-icon {
4876
- background-color: $fill-positive-base;
4991
+
4992
+ .tab-item-title {
4993
+ flex-shrink: 0;
4994
+ display: flex;
4995
+ place-items: center;
4996
+ cursor: pointer;
4997
+ color: $text-neutral-secondary;
4998
+ transition:
4999
+ color 100ms ease-out,
5000
+ background-color 100ms ease-out,
5001
+ padding-left 320ms ease 80ms;
5002
+
5003
+ &:hover {
5004
+ padding-left: 16px;
5005
+ color: $text-light-general;
5006
+ background: $fill-outstanding-lighthover;
4877
5007
  }
4878
- &.tag-hover:hover,
4879
- &.__pseudo-states-hover {
4880
- background-color: $fill-positive-light-hover;
5008
+
5009
+ & + .tab-item-title {
5010
+ margin-left: 2px;
5011
+ }
5012
+
5013
+ &.more {
5014
+ &:not(.__selected) {
5015
+ width: 16px;
5016
+ height: 16px;
5017
+ padding: 0;
5018
+ border-radius: 2px;
5019
+ margin-left: 8px;
5020
+ }
5021
+
5022
+ &.__selected.tab-title-text {
5023
+ margin-left: 8px;
5024
+ }
5025
+ }
5026
+
5027
+ &.__selected {
5028
+ padding-left: 16px;
5029
+ background: $fills-light-general-general-light;
5030
+ color: $text-light-general;
5031
+ }
5032
+
5033
+ &.__hidden {
5034
+ display: none;
4881
5035
  }
4882
5036
  }
4883
- &.ant-tag-gray {
4884
- background-color: $fill-neutral-trans-2;
4885
- .#{$prefix}-icon:not(.ui-kit-status-capsule-icon-loading) {
4886
- background-color: $gray-70;
5037
+ }
5038
+ }
5039
+
5040
+ .E_ti12z2 {
5041
+ &.ant-dropdown-open {
5042
+ color: $text-light-general;
5043
+ background: $fills-light-trans-3;
5044
+ }
5045
+ }
5046
+
5047
+ .E_m19lu3v {
5048
+ cursor: default;
5049
+ & .menu-wrapper {
5050
+ min-width: 160px;
5051
+ max-width: 400px;
5052
+ padding: 6px;
5053
+ background: $white;
5054
+ box-shadow:
5055
+ 0px 0px 10px rgba(107, 125, 153, 0.18),
5056
+ 0px 12px 40px rgba(45, 58, 86, 0.3);
5057
+ border-radius: 8px;
5058
+ max-height: calc(100vh - 250px);
5059
+ overflow: auto;
5060
+
5061
+ & .tab-menu-item {
5062
+ display: flex;
5063
+ place-items: center;
5064
+ width: var(--itemWidth);
5065
+
5066
+ & + .tab-menu-item {
5067
+ margin-top: 8px;
4887
5068
  }
4888
- &.tag-hover:hover,
4889
- &.__pseudo-states-hover {
4890
- background-color: $fill-neutral-trans-3-trans-2-hover;
5069
+
5070
+ &.__selected {
5071
+ padding: 6px;
5072
+ background: $fills-light-general-general-light;
5073
+ color: $text-light-general;
5074
+
5075
+ &E_l1fbkbzo {
5076
+ @include Inter(bold !important);
5077
+ }
4891
5078
  }
5079
+
5080
+ &.ant-dropdown-menu-item {
5081
+ padding: 5px 12px;
5082
+ border-radius: 4px;
5083
+ }
5084
+
5085
+ &.ant-dropdown-menu-item:not(.ant-dropdown-menu-item-disabled):hover {
5086
+ color: $text-light-general;
5087
+ background: $fills-light-trans-3;
5088
+ }
5089
+
5090
+ &-text {
5091
+ text-align: left;
5092
+ flex: 1;
5093
+ overflow: hidden;
5094
+ text-overflow: ellipsis;
5095
+ white-space: nowrap;
5096
+ }
5097
+ }
5098
+ }
5099
+ }
5100
+
5101
+ .E_i1bmwe2m {
5102
+ margin: auto;
5103
+ cursor: pointer;
5104
+ line-height: normal;
5105
+ height: 16px;
5106
+ margin-right: 3px;
5107
+
5108
+ .icon-inner {
5109
+ display: block;
5110
+ height: 16px;
5111
+ }
5112
+ }
5113
+
5114
+
5115
+ .E_b14q2gmw {
5116
+ box-shadow: 0px 0.119595px 0.438513px rgba(129, 138, 153, 0.14),
5117
+ 0px 0.271728px 0.996336px rgba(129, 138, 153, 0.106447),
5118
+ 0px 0.472931px 1.73408px rgba(129, 138, 153, 0.0912224),
5119
+ 0px 0.751293px 2.75474px rgba(129, 138, 153, 0.0799253),
5120
+ 0px 1.15919px 4.25036px rgba(129, 138, 153, 0.07),
5121
+ 0px 1.80882px 6.63236px rgba(129, 138, 153, 0.0600747),
5122
+ 0px 3.00293px 11.0107px rgba(129, 138, 153, 0.0487776),
5123
+ 0px 6px 22px rgba(129, 138, 153, 0.0335534);
5124
+ }
5125
+
5126
+ .E_c1eym6el {
5127
+ border-radius: 8px;
5128
+ background-color: white;
5129
+ &.hoverable {
5130
+ cursor: pointer;
5131
+
5132
+ &:hover {
5133
+ transition: all 200ms ease;
5134
+ box-shadow: 0px 9px 22px rgb(107 125 153 / 23%),
5135
+ 0px 1.12694px 2.75474px rgb(107 125 153 / 12%);
5136
+ transform: translateY(-4px);
4892
5137
  }
4893
5138
  }
4894
5139
  }
4895
5140
 
4896
- .E_satwmqm {
4897
- width: 8px;
4898
- height: 8px;
4899
- border-radius: 50%;
4900
- display: inline-block;
4901
- }
4902
-
4903
5141
 
4904
5142
  .E_lht19u8 {
4905
5143
  width: 64px;
@@ -4941,257 +5179,19 @@
4941
5179
  animation: loading-indicator2 1100ms ease-out infinite;
4942
5180
  }
4943
5181
 
4944
- .E_l17lbdo6 {
4945
- position: absolute;
4946
- width: 5px;
4947
- height: 48px;
4948
- left: 52.9px;
4949
- top: 51.8px;
4950
-
4951
- background: linear-gradient(180deg, #0080ff 0%, rgba(0, 128, 255, 0.16) 100%);
4952
- border-radius: 5px;
4953
- transform: rotate(112deg);
4954
- transform-origin: top left;
4955
-
4956
- animation: loading-indicator3 1100ms ease-out infinite;
4957
- }
4958
-
4959
-
4960
- .E_m11nzl2x {
4961
- color: $text-light-secondary;
4962
- text-align: center;
4963
-
4964
- display: flex;
4965
- align-items: center;
4966
- justify-content: center;
4967
- flex-direction: column;
4968
- height: 100%;
4969
-
4970
- .link {
4971
- color: $text-light-general;
4972
- cursor: pointer;
4973
- }
4974
- }
4975
-
4976
- .E_mn7joto {
4977
- width: 100%;
4978
- height: 100%;
4979
- display: flex;
4980
- flex-direction: column;
4981
-
4982
- .name-toolbar {
4983
- width: 100%;
4984
- display: flex;
4985
- line-height: 30px;
4986
- justify-content: space-between;
4987
- .metric-extra {
4988
- display: flex;
4989
- font-size: 12px;
4990
- align-items: center;
4991
-
4992
- .info-item {
4993
- color: $gray-60;
4994
- }
4995
- .info-item + .info-item {
4996
- margin-left: 10px;
4997
- }
4998
-
4999
- .menu-trigger {
5000
- margin-left: 10px;
5001
- cursor: pointer;
5002
- }
5003
- }
5004
- }
5005
-
5006
- .content {
5007
- flex: 1;
5008
- width: 100%;
5009
- display: flex;
5010
- justify-content: center;
5011
- align-items: center;
5012
- }
5013
- .single-content {
5014
- height: 65px;
5015
- }
5016
- }
5017
-
5018
- .E_l1bifhon {
5019
- display: flex;
5020
- align-items: center;
5021
- white-space: nowrap;
5022
- overflow: hidden;
5023
- width: 100%;
5024
-
5025
- .ant-dropdown-trigger {
5026
- font-size: 12px;
5027
- margin-left: 8px;
5028
- }
5029
- }
5030
-
5031
- .E_ltthzck {
5032
- display: flex;
5033
- justify-content: flex-start;
5034
- align-items: center;
5035
- font-size: 12px;
5036
- cursor: pointer;
5037
- &:not(:first-child) {
5038
- margin-left: 8px;
5039
- }
5040
-
5041
- &.deselected,
5042
- &.hovering {
5043
- opacity: 0.3;
5044
-
5045
- &:not(.hoverering-self) .color-block {
5046
- background: #b4beca !important;
5047
- border-radius: 2px;
5048
- }
5049
- }
5050
- &.hoverering-self {
5051
- opacity: 1;
5052
- }
5053
- .dropdown-trigger {
5054
- margin-left: 12px;
5055
- }
5056
- .legend-name {
5057
- color: $text-light-primary;
5058
- }
5059
- .icon-suffix-wrapper {
5060
- display: flex;
5061
- align-items: center;
5062
- margin-left: 4px;
5063
- }
5064
- }
5065
-
5066
- .E_l1mumj7o {
5067
- display: flex;
5068
- justify-content: flex-start;
5069
- align-items: center;
5070
- font-size: 12px;
5071
- cursor: pointer;
5072
-
5073
- &.deselected,
5074
- &.hovering {
5075
- opacity: 0.3;
5076
-
5077
- &:not(.hoverering-self) .color-block {
5078
- background: #b4beca !important;
5079
- border-radius: 2px;
5080
- }
5081
- }
5082
- .legend-name {
5083
- color: $text-light-primary;
5084
- }
5085
- &.hoverering-self {
5086
- opacity: 1;
5087
- }
5088
- .icon-suffix-wrapper {
5089
- margin-left: 4px;
5090
- display: flex;
5091
- align-items: center;
5092
- }
5093
- }
5094
-
5095
- .E_c14rn6j5 {
5096
- display: inline-block;
5097
- height: 8px;
5098
- width: 8px;
5099
- margin-right: 6px;
5100
- border-radius: 2px;
5101
- }
5102
-
5103
- .E_e45tc5l {
5104
- .ant-dropdown-menu-item {
5105
- display: flex;
5106
- align-items: center;
5107
- font-size: 12px;
5108
- margin: 0;
5109
- }
5110
- }
5111
-
5112
- .E_lqeaosa {
5113
- position: relative;
5114
-
5115
- &.hidden-xaxis .pointer-wrapper {
5116
- bottom: -12px;
5117
- }
5118
-
5119
- .metric-toolbar {
5120
- display: flex;
5121
- justify-content: space-between;
5122
- line-height: 30px;
5123
- .metric-extra {
5124
- display: flex;
5125
- flex-shrink: 0;
5126
- font-size: 12px;
5127
- align-items: center;
5128
-
5129
- .info-item {
5130
- color: $gray-60;
5131
- }
5132
- .info-item + .info-item {
5133
- margin-left: 10px;
5134
- }
5135
-
5136
- .menu-trigger {
5137
- margin-left: 10px;
5138
- cursor: pointer;
5139
- }
5140
- }
5141
- }
5142
-
5143
- .recharts-xAxis {
5144
- font-size: 12px;
5145
- }
5146
-
5147
- .pointer-wrapper {
5148
- position: absolute;
5149
- bottom: 10px;
5150
- padding: 0 8px;
5151
- font-size: 12px;
5152
- color: $white;
5153
- transform: translateX(-50%);
5154
- }
5155
- }
5156
-
5157
- .E_t2pr38p {
5158
- min-width: 200px;
5159
- background-color: $fill-neutral-trans-8;
5160
- border-radius: 4px;
5161
- box-shadow: 0px 1px 4px 0px rgba(29, 50, 108, 0.6);
5162
- padding: 8px;
5163
- }
5164
-
5165
- .E_tecdsj7 {
5166
- display: flex;
5167
- align-items: center;
5168
- background-color: unset;
5169
- color: $text-neutral-ontint;
5170
- justify-content: space-between;
5171
- font-size: 12px;
5172
- padding-top: 6px;
5173
-
5174
- &:first-child {
5175
- padding-top: 3px;
5176
- }
5177
- &:last-child {
5178
- padding-bottom: 3px;
5179
- }
5180
- .column-value {
5181
- color: $text-neutral-ontint;
5182
- margin-left: 8px;
5183
- }
5184
- }
5185
-
5186
- .E_ljhvvia {
5187
- display: inline-block;
5188
- height: 8px;
5189
- width: 8px;
5190
- margin-right: 8px;
5191
- border-radius: 2px;
5192
- &.borderd {
5193
- border: 1px solid $stroke-neutral-white;
5194
- }
5182
+ .E_l17lbdo6 {
5183
+ position: absolute;
5184
+ width: 5px;
5185
+ height: 48px;
5186
+ left: 52.9px;
5187
+ top: 51.8px;
5188
+
5189
+ background: linear-gradient(180deg, #0080ff 0%, rgba(0, 128, 255, 0.16) 100%);
5190
+ border-radius: 5px;
5191
+ transform: rotate(112deg);
5192
+ transform-origin: top left;
5193
+
5194
+ animation: loading-indicator3 1100ms ease-out infinite;
5195
5195
  }
5196
5196
 
5197
5197
 
@@ -5376,18 +5376,6 @@
5376
5376
  }
5377
5377
 
5378
5378
 
5379
- .E_w7ob4th {
5380
- &.outside-tag {
5381
- padding-left: 0;
5382
- .inside-tag {
5383
- border-radius: 4px 0 0 4px;
5384
- padding-right: 4px;
5385
- margin-right: 4px;
5386
- }
5387
- }
5388
- }
5389
-
5390
-
5391
5379
  .E_sjob3jg {
5392
5380
  $item: ant-steps-item;
5393
5381
  --item-min-width: 60px;
@@ -5612,62 +5600,14 @@
5612
5600
  }
5613
5601
 
5614
5602
 
5615
- .E_bpgac8u {
5616
- color: #FFFFFF;
5617
- display: flex;
5618
- gap: 8px;
5619
- padding: 8px 0;
5620
- display: flex;
5621
- justify-content: center;
5622
- white-space: pre-wrap;
5623
- align-items: center;
5624
- .dashed-btn {
5625
- border-bottom: 1px solid white;
5626
- cursor: pointer;
5627
- }
5628
- }
5629
-
5630
- .E_envn4g3 {
5631
- background: #F0483E;
5632
- }
5633
-
5634
- .E_i12w18eu {
5635
- background: #0080FF;
5636
- }
5637
-
5638
- .E_wujsnt4 {
5639
- background-color: #E07F00;
5640
- }
5641
-
5642
-
5643
- .E_slr2ynn {
5644
- padding: 0 8px;
5645
- height: 18px;
5646
- }
5647
-
5648
- .E_m140wbb6 {
5649
- padding: 2px 8px;
5650
- height: 24px;
5651
- }
5652
-
5653
- .E_t1fozc1i {
5654
- margin: 0;
5655
- }
5656
-
5657
- .E_i1vxv4ln {
5658
- margin-right: 4px;
5659
- height: 16px;
5660
- }
5661
-
5662
- .E_n1afl31m {
5663
- &.ant-tag.ant-tag-gray {
5664
- font-weight: 700;
5665
- color: $text-neutral-primary;
5666
- background-color: $fill-neutral-trans-1;
5667
- border: 1px solid $stroke-neutral-trans-2;
5668
- word-break: break-all;
5669
- display: inline;
5670
- white-space: normal;
5603
+ .E_w7ob4th {
5604
+ &.outside-tag {
5605
+ padding-left: 0;
5606
+ .inside-tag {
5607
+ border-radius: 4px 0 0 4px;
5608
+ padding-right: 4px;
5609
+ margin-right: 4px;
5610
+ }
5671
5611
  }
5672
5612
  }
5673
5613
 
@@ -5890,6 +5830,38 @@
5890
5830
  }
5891
5831
 
5892
5832
 
5833
+ .E_slr2ynn {
5834
+ padding: 0 8px;
5835
+ height: 18px;
5836
+ }
5837
+
5838
+ .E_m140wbb6 {
5839
+ padding: 2px 8px;
5840
+ height: 24px;
5841
+ }
5842
+
5843
+ .E_t1fozc1i {
5844
+ margin: 0;
5845
+ }
5846
+
5847
+ .E_i1vxv4ln {
5848
+ margin-right: 4px;
5849
+ height: 16px;
5850
+ }
5851
+
5852
+ .E_n1afl31m {
5853
+ &.ant-tag.ant-tag-gray {
5854
+ font-weight: 700;
5855
+ color: $text-neutral-primary;
5856
+ background-color: $fill-neutral-trans-1;
5857
+ border: 1px solid $stroke-neutral-trans-2;
5858
+ word-break: break-all;
5859
+ display: inline;
5860
+ white-space: normal;
5861
+ }
5862
+ }
5863
+
5864
+
5893
5865
  .E_i1g85yz3 {
5894
5866
  margin-right: 4px;
5895
5867
  height: 16px;
@@ -5931,63 +5903,36 @@
5931
5903
  }
5932
5904
 
5933
5905
 
5934
- .E_b1jaupqb {
5935
- color: #F0483E;
5936
- }
5937
-
5938
-
5939
- .E_t59qhqp {
5940
- padding: 0px;
5941
- padding-top: 5px;
5942
- padding-left: 5px;
5943
-
5944
- .ant-timeline-item {
5945
- margin-bottom: 16px;
5946
- padding-bottom: 0px;
5947
- }
5948
- .ant-timeline-item-last,
5949
- .compact.ant-timeline-item-last {
5950
- margin-bottom: 0;
5951
- }
5952
- .compact.ant-timeline-item {
5953
- margin-bottom: 12px;
5954
- }
5955
- .info-action {
5956
- align-self: baseline;
5906
+ .E_bpgac8u {
5907
+ color: #FFFFFF;
5908
+ display: flex;
5909
+ gap: 8px;
5910
+ padding: 8px 0;
5911
+ display: flex;
5912
+ justify-content: center;
5913
+ white-space: pre-wrap;
5914
+ align-items: center;
5915
+ .dashed-btn {
5916
+ border-bottom: 1px solid white;
5917
+ cursor: pointer;
5957
5918
  }
5958
5919
  }
5959
5920
 
5960
- .E_t2e44lg {
5961
- .ant-timeline-item-content {
5962
- margin-left: 18px;
5963
- }
5964
- .item-time {
5965
- display: flex;
5966
- flex-direction: column;
5967
- gap: 4px;
5968
- margin-top: 4px;
5969
- }
5970
-
5971
- &:last-child {
5972
- .ant-timeline-item-content {
5973
- padding-bottom: 0;
5974
- }
5975
- }
5921
+ .E_envn4g3 {
5922
+ background: #F0483E;
5976
5923
  }
5977
5924
 
5978
- .E_e14ua30y {
5979
- display: flex;
5980
- flex-direction: column;
5981
- align-items: center;
5982
- justify-content: center;
5925
+ .E_i12w18eu {
5926
+ background: #0080FF;
5983
5927
  }
5984
5928
 
5985
- .E_s1ikqzph {
5986
- color: #2C3852BF;
5929
+ .E_wujsnt4 {
5930
+ background-color: #E07F00;
5987
5931
  }
5988
5932
 
5989
- .E_i15astnl {
5990
- color: #00122E;
5933
+
5934
+ .E_b1jaupqb {
5935
+ color: #F0483E;
5991
5936
  }
5992
5937
 
5993
5938
 
@@ -6193,25 +6138,80 @@
6193
6138
  flex-shrink: 0;
6194
6139
  }
6195
6140
 
6196
- .E_ejcjd85 {
6197
- color: $red-60;
6141
+ .E_ejcjd85 {
6142
+ color: $red-60;
6143
+ display: flex;
6144
+ align-items: center;
6145
+ height: 32px;
6146
+ }
6147
+
6148
+ .E_e1lj3r2s {
6149
+ margin-right: 4px;
6150
+ flex-shrink: 0;
6151
+ }
6152
+
6153
+ .E_eb58k2y {
6154
+ align-self: flex-start;
6155
+ margin-top: 5px;
6156
+ }
6157
+
6158
+ .E_c1bad0d {
6159
+ font-weight: bold;
6160
+ }
6161
+
6162
+
6163
+ .E_t59qhqp {
6164
+ padding: 0px;
6165
+ padding-top: 5px;
6166
+ padding-left: 5px;
6167
+
6168
+ .ant-timeline-item {
6169
+ margin-bottom: 16px;
6170
+ padding-bottom: 0px;
6171
+ }
6172
+ .ant-timeline-item-last,
6173
+ .compact.ant-timeline-item-last {
6174
+ margin-bottom: 0;
6175
+ }
6176
+ .compact.ant-timeline-item {
6177
+ margin-bottom: 12px;
6178
+ }
6179
+ .info-action {
6180
+ align-self: baseline;
6181
+ }
6182
+ }
6183
+
6184
+ .E_t2e44lg {
6185
+ .ant-timeline-item-content {
6186
+ margin-left: 18px;
6187
+ }
6188
+ .item-time {
6189
+ display: flex;
6190
+ flex-direction: column;
6191
+ gap: 4px;
6192
+ margin-top: 4px;
6193
+ }
6194
+
6195
+ &:last-child {
6196
+ .ant-timeline-item-content {
6197
+ padding-bottom: 0;
6198
+ }
6199
+ }
6200
+ }
6201
+
6202
+ .E_e14ua30y {
6198
6203
  display: flex;
6204
+ flex-direction: column;
6199
6205
  align-items: center;
6200
- height: 32px;
6201
- }
6202
-
6203
- .E_e1lj3r2s {
6204
- margin-right: 4px;
6205
- flex-shrink: 0;
6206
+ justify-content: center;
6206
6207
  }
6207
6208
 
6208
- .E_eb58k2y {
6209
- align-self: flex-start;
6210
- margin-top: 5px;
6209
+ .E_s1ikqzph {
6210
+ color: #2C3852BF;
6211
6211
  }
6212
6212
 
6213
- .E_c1bad0d {
6214
- font-weight: bold;
6213
+ .E_i15astnl {
6214
+ color: #00122E;
6215
6215
  }
6216
6216
 
6217
6217
 
@@ -6505,16 +6505,6 @@
6505
6505
  }
6506
6506
 
6507
6507
 
6508
- .E_a9y3flr {
6509
- margin-left: 8px;
6510
- }
6511
-
6512
- .E_a1njc627 {
6513
- font-size: 12px;
6514
- color: $text-neutral-primary;
6515
- }
6516
-
6517
-
6518
6508
  .E_f16blduf {
6519
6509
  &.ant-form-item {
6520
6510
  margin-bottom: 0;
@@ -6541,6 +6531,16 @@
6541
6531
  }
6542
6532
 
6543
6533
 
6534
+ .E_a9y3flr {
6535
+ margin-left: 8px;
6536
+ }
6537
+
6538
+ .E_a1njc627 {
6539
+ font-size: 12px;
6540
+ color: $text-neutral-primary;
6541
+ }
6542
+
6543
+
6544
6544
  .E_d1u4ndxc {
6545
6545
  color: #2C3852BF;
6546
6546
  font-size: 12px;
@@ -6607,76 +6607,58 @@
6607
6607
  }
6608
6608
 
6609
6609
 
6610
- .E_s1ebs0ra {
6611
- display: flex;
6612
- align-items: center;
6613
- justify-content: space-between;
6614
- background: $backgrounds-light-grouped;
6615
- padding: 8px 12px;
6616
- position: sticky;
6617
- top: 0;
6618
- z-index: 1;
6619
- margin-bottom: -52px;
6620
-
6621
- .select-total {
6622
- display: flex;
6623
- align-items: center;
6624
- font-weight: 700;
6625
- flex-shrink: 0;
6610
+ .E_c18bcrac {
6611
+ display: inline-block;
6612
+ width: 100%;
6613
+ .recharts-wrapper {
6614
+ margin-left: 4px;
6615
+ }
6616
+ }
6626
6617
 
6627
- .icon-wrapper {
6628
- cursor: pointer;
6629
- margin-left: 8px;
6630
- width: 32px;
6631
- height: 32px;
6632
- border-radius: 50%;
6633
- justify-content: center;
6618
+ .E_cro7kg2 {
6619
+ padding: 4px;
6634
6620
 
6635
- &:hover {
6636
- background: $fills-light-trans-2;
6637
- }
6638
- }
6621
+ .unit {
6622
+ color: white;
6639
6623
  }
6640
- .action-group {
6641
- flex: 1;
6642
- margin-left: 88px;
6643
- white-space: nowrap;
6644
- text-align: right;
6645
- position: relative;
6646
- padding: 4px 0;
6647
- margin-top: -4px;
6648
- overflow: hidden;
6649
- .sub-menu-delete {
6650
- transform: translateY(-4px);
6651
- }
6652
- button {
6653
- border: none;
6654
- }
6655
- > *:not(:last-child) {
6656
- margin-right: 8px;
6657
- }
6624
+ }
6658
6625
 
6659
- > button:last-child {
6660
- margin-right: 4px;
6661
- }
6662
- .more-btn {
6663
- cursor: pointer;
6664
- width: 32px;
6665
- height: 32px;
6666
- justify-content: center;
6667
- border-radius: 50%;
6626
+ .E_c14wcxf0 {
6627
+ display: flex;
6628
+ justify-content: space-between;
6629
+ align-items: center;
6630
+ font-size: 13px;
6631
+ line-height: 24px;
6632
+ color: #cccccc;
6633
+ white-space: nowrap;
6668
6634
 
6669
- &:hover {
6670
- background: $white;
6671
- }
6672
- }
6635
+ label {
6636
+ margin-right: 32px;
6673
6637
  }
6674
6638
  }
6675
6639
 
6676
- .E_mzzncgx {
6677
- display: inline-flex;
6678
- align-items: center;
6679
- gap: 4px;
6640
+ .E_coy29mj.E_c14wcxf0 {
6641
+ font-weight: bold;
6642
+ color: white;
6643
+ }
6644
+
6645
+ .E_s11212zy {
6646
+ width: 8px;
6647
+ height: 8px;
6648
+ border-radius: 2px;
6649
+ display: inline-block;
6650
+ background: var(--s11212zy-0);
6651
+ border: 1px solid $fills-light-white;
6652
+ box-sizing: content-box;
6653
+ margin-right: 6px;
6654
+ }
6655
+
6656
+ .E_p1lyky6c {
6657
+ & > :first-child {
6658
+ font-weight: bold;
6659
+ color: white;
6660
+ margin-right: 4px;
6661
+ }
6680
6662
  }
6681
6663
 
6682
6664
 
@@ -6778,58 +6760,76 @@
6778
6760
  }
6779
6761
 
6780
6762
 
6781
- .E_c18bcrac {
6782
- display: inline-block;
6783
- width: 100%;
6784
- .recharts-wrapper {
6785
- margin-left: 4px;
6786
- }
6787
- }
6788
-
6789
- .E_cro7kg2 {
6790
- padding: 4px;
6791
-
6792
- .unit {
6793
- color: white;
6794
- }
6795
- }
6796
-
6797
- .E_c14wcxf0 {
6763
+ .E_s1ebs0ra {
6798
6764
  display: flex;
6799
- justify-content: space-between;
6800
6765
  align-items: center;
6801
- font-size: 13px;
6802
- line-height: 24px;
6803
- color: #cccccc;
6804
- white-space: nowrap;
6766
+ justify-content: space-between;
6767
+ background: $backgrounds-light-grouped;
6768
+ padding: 8px 12px;
6769
+ position: sticky;
6770
+ top: 0;
6771
+ z-index: 1;
6772
+ margin-bottom: -52px;
6805
6773
 
6806
- label {
6807
- margin-right: 32px;
6774
+ .select-total {
6775
+ display: flex;
6776
+ align-items: center;
6777
+ font-weight: 700;
6778
+ flex-shrink: 0;
6779
+
6780
+ .icon-wrapper {
6781
+ cursor: pointer;
6782
+ margin-left: 8px;
6783
+ width: 32px;
6784
+ height: 32px;
6785
+ border-radius: 50%;
6786
+ justify-content: center;
6787
+
6788
+ &:hover {
6789
+ background: $fills-light-trans-2;
6790
+ }
6791
+ }
6808
6792
  }
6809
- }
6793
+ .action-group {
6794
+ flex: 1;
6795
+ margin-left: 88px;
6796
+ white-space: nowrap;
6797
+ text-align: right;
6798
+ position: relative;
6799
+ padding: 4px 0;
6800
+ margin-top: -4px;
6801
+ overflow: hidden;
6802
+ .sub-menu-delete {
6803
+ transform: translateY(-4px);
6804
+ }
6805
+ button {
6806
+ border: none;
6807
+ }
6808
+ > *:not(:last-child) {
6809
+ margin-right: 8px;
6810
+ }
6810
6811
 
6811
- .E_coy29mj.E_c14wcxf0 {
6812
- font-weight: bold;
6813
- color: white;
6814
- }
6812
+ > button:last-child {
6813
+ margin-right: 4px;
6814
+ }
6815
+ .more-btn {
6816
+ cursor: pointer;
6817
+ width: 32px;
6818
+ height: 32px;
6819
+ justify-content: center;
6820
+ border-radius: 50%;
6815
6821
 
6816
- .E_s11212zy {
6817
- width: 8px;
6818
- height: 8px;
6819
- border-radius: 2px;
6820
- display: inline-block;
6821
- background: var(--s11212zy-0);
6822
- border: 1px solid $fills-light-white;
6823
- box-sizing: content-box;
6824
- margin-right: 6px;
6822
+ &:hover {
6823
+ background: $white;
6824
+ }
6825
+ }
6826
+ }
6825
6827
  }
6826
6828
 
6827
- .E_p1lyky6c {
6828
- & > :first-child {
6829
- font-weight: bold;
6830
- color: white;
6831
- margin-right: 4px;
6832
- }
6829
+ .E_mzzncgx {
6830
+ display: inline-flex;
6831
+ align-items: center;
6832
+ gap: 4px;
6833
6833
  }
6834
6834
 
6835
6835
 
@@ -7010,6 +7010,15 @@
7010
7010
  }
7011
7011
 
7012
7012
 
7013
+ .E_tqjc4ui {
7014
+ @at-root {
7015
+ span#{&} {
7016
+ margin: 0 2px;
7017
+ }
7018
+ }
7019
+ }
7020
+
7021
+
7013
7022
  .E_n12mqh7z {
7014
7023
  display: flex;
7015
7024
  align-items: center;
@@ -7031,317 +7040,171 @@
7031
7040
  }
7032
7041
 
7033
7042
 
7034
- .E_tqjc4ui {
7035
- @at-root {
7036
- span#{&} {
7037
- margin: 0 2px;
7038
- }
7039
- }
7043
+ .E_ou7iq30 {
7044
+ overflow: hidden;
7045
+ text-overflow: ellipsis;
7040
7046
  }
7041
7047
 
7048
+ .E_s1tui002 {
7049
+ white-space: nowrap;
7050
+ }
7042
7051
 
7043
- .E_t160l1cm {
7044
- display: flex;
7045
- flex-direction: column;
7046
- flex: 1;
7047
-
7048
- .tab-bar {
7049
- flex-shrink: 0;
7050
- display: flex;
7051
- border-bottom: 1px solid $strokes-translucent-1-light;
7052
- }
7053
-
7054
- .tab-content {
7055
- height: 100%;
7056
- }
7057
-
7058
- .tab-menu-item {
7059
- margin-right: 2px;
7060
- padding: 1px 12px;
7061
- line-height: 24px;
7062
- height: 24px;
7063
- color: $text-secondary-light;
7064
- border-radius: 4px 4px 0 0;
7065
- cursor: pointer;
7066
- transition:
7067
- color 100ms ease-out,
7068
- background-color 100ms ease-out,
7069
- padding-left 320ms ease 80ms;
7070
-
7071
- &:first-child {
7072
- padding-left: 0;
7073
-
7074
- &:hover,
7075
- &.tab-menu-item-selected {
7076
- padding-left: 12px;
7077
- }
7078
- }
7079
-
7080
- &:hover {
7081
- color: $blue-60;
7082
- background: $fills-trans-terdiary-light;
7083
-
7084
- .expand-arrow path {
7085
- fill: $blue-60;
7086
- }
7087
- }
7088
-
7089
- &:active {
7090
- background: $fills-trans-quaternary-light;
7091
- }
7092
-
7093
- &.ant-dropdown-open {
7094
- color: $blue-60;
7095
- background: $fills-trans-terdiary-light;
7096
-
7097
- &:active {
7098
- background: $fills-trans-quaternary-light;
7099
- }
7100
-
7101
- &.tab-menu-item-selected {
7102
- background: rgba($blue-60, 0.16);
7103
- }
7104
-
7105
- .expand-arrow path {
7106
- fill: $blue-60;
7107
- }
7108
- }
7109
-
7110
- &.tab-menu-item-selected {
7111
- color: $blue-60;
7112
- background: rgba($blue-60, 0.1);
7113
-
7114
- &:hover {
7115
- background: rgba($blue-60, 0.16);
7116
- }
7117
-
7118
- .expand-arrow path {
7119
- fill: $blue-100;
7120
- }
7121
- }
7052
+ .E_mxrc2zg {
7053
+ display: -webkit-box;
7054
+ -webkit-line-clamp: var(--mxrc2zg-0);
7055
+ -webkit-box-orient: vertical;
7056
+ word-break: break-all;
7057
+ }
7122
7058
 
7123
- .expand-arrow {
7124
- margin-left: 8px;
7125
- height: 22px;
7126
- }
7127
- .expand-arrow path {
7128
- fill: $text-secondary-light;
7129
- }
7059
+ .E_t1vv6d68 {
7060
+ .ant-tooltip-arrow {
7061
+ display: none;
7130
7062
  }
7131
-
7132
- .tab-menu-item-group {
7133
- padding: 0;
7134
- display: flex;
7135
- align-items: center;
7136
- overflow: hidden;
7137
-
7138
- .main-title {
7139
- opacity: 0;
7140
- max-width: 0;
7141
- transition:
7142
- max-width 320ms ease,
7143
- opacity 240ms ease;
7144
- }
7145
-
7146
- .sub-title {
7147
- padding: 1px 12px;
7148
- position: relative;
7149
- display: flex;
7150
-
7151
- > .slash-arrow {
7152
- opacity: 0;
7153
- position: absolute;
7154
- top: 50%;
7155
- left: 0;
7156
- transform: translate(-50%, -50%);
7157
- transition: opacity 100ms linear;
7158
- fill: rgba($blue-60, 0.2);
7159
- }
7160
- }
7161
-
7162
- &.tab-menu-item-selected {
7163
- color: $blue-60;
7164
-
7165
- .main-title {
7166
- padding: 1px 12px;
7167
- display: inline-block;
7168
- opacity: 1;
7169
- max-width: 160px;
7170
- }
7171
-
7172
- .sub-title {
7173
- padding: 1px 12px;
7174
- color: $blue-80;
7175
-
7176
- > .slash-arrow {
7177
- opacity: 1;
7178
- }
7179
- }
7180
-
7181
- &:hover,
7182
- &:active {
7183
- .sub-title {
7184
- background: rgba($blue-60, 0.16);
7185
- }
7186
- .sub-title > .slash-arrow {
7187
- opacity: 0;
7188
- }
7189
- }
7063
+ .ant-tooltip-inner {
7064
+ background: $gray-a80-9;
7065
+ border-radius: 4px;
7066
+ &:has(.eagle-ellipsis-content) {
7067
+ visibility: hidden;
7190
7068
  }
7191
7069
  }
7070
+ }
7192
7071
 
7193
- .tab-menu-item-medium {
7194
- &.tab-menu-item {
7195
- padding: 4px 16px;
7196
- height: 32px;
7197
- border-radius: 6px 6px 0 0;
7198
-
7199
- &:first-child {
7200
- padding-left: 0;
7201
- }
7202
- &:first-child:hover,
7203
- &.tab-menu-item-selected:first-child {
7204
- padding-left: 16px;
7205
- }
7206
-
7207
- .expand-arrow {
7208
- margin-left: 11px;
7209
- height: 24px;
7210
- }
7211
- }
7212
-
7213
- &.tab-menu-item-group {
7214
- padding: 0;
7215
-
7216
- .sub-title {
7217
- padding: 4px 16px;
7218
- }
7219
7072
 
7220
- &.tab-menu-item-selected .sub-title,
7221
- &.tab-menu-item-selected .main-title {
7222
- padding: 4px 16px;
7223
- }
7224
- }
7073
+ .E_s1at6qmn {
7074
+ &.ant-layout-sider {
7075
+ background: $backgrounds-light-grouped;
7076
+ padding: 32px 8px;
7077
+ overflow: auto;
7225
7078
  }
7226
7079
 
7227
- .tab-menu-item-light {
7228
- &:hover,
7229
- &:active {
7230
- background: $white;
7231
- }
7232
-
7233
- &:active {
7234
- color: $blue-80;
7235
- }
7236
-
7237
- &.tab-menu-item.tab-menu-item-selected {
7238
- background: $white;
7239
- color: $blue-100;
7240
- }
7241
-
7242
- &.tab-menu-item-group.tab-menu-item-selected {
7243
- .main-title {
7244
- color: rgba($gray-80, 0.6);
7245
- }
7246
-
7247
- .sub-title {
7248
- color: $blue-100;
7249
- }
7250
-
7251
- .sub-title > .slash-arrow {
7252
- fill: $fills-opaque-quaternary-light;
7253
- }
7254
-
7255
- .sub-title > .expand-arrow path {
7256
- fill: $blue-100;
7257
- }
7258
- }
7080
+ .ant-layout-sider-children {
7081
+ display: flex;
7082
+ flex-direction: column;
7083
+ justify-content: space-between;
7259
7084
  }
7260
-
7261
- .tab-content {
7262
- flex: 1;
7085
+
7086
+ footer {
7263
7087
  display: flex;
7264
- flex-direction: column;
7265
7088
  }
7266
7089
 
7267
- /* FIXME:(yanzhen) do this better */
7268
- &.is-overview .tab-content {
7269
- overflow: visible;
7090
+ .ant-menu {
7091
+ background: $backgrounds-light-grouped;
7092
+ a {
7093
+ color: $text-light-primary;
7094
+ width: 180px;
7095
+ overflow: hidden;
7096
+ text-overflow: ellipsis;
7097
+ }
7270
7098
  }
7271
- }
7272
7099
 
7273
- .E_t14npdqr {
7274
- max-width: 240px;
7275
- animation: none;
7100
+ .ant-menu-vertical {
7101
+ margin-bottom: 24px;
7276
7102
 
7277
- &.ant-dropdown .ant-dropdown-menu {
7278
- border: 1px solid $blue-60;
7279
- padding: 0;
7103
+ .ant-menu-item-group {
7104
+ .ant-menu-item {
7105
+ margin: 0;
7106
+ }
7107
+ .ant-menu-item-group-title {
7108
+ font-size: 12px;
7109
+ padding: 0 8px 4px;
7110
+ line-height: 18px;
7280
7111
 
7281
- .ant-dropdown-menu-item {
7282
- margin: 0;
7112
+ &:empty {
7113
+ padding: 0;
7114
+ }
7115
+ }
7116
+ &:not(:last-child) {
7117
+ padding-bottom: 24px;
7118
+ &.split {
7119
+ margin-bottom: 24px;
7120
+ border-bottom: 1px solid rgba(211, 218, 235, 0.6);
7121
+ }
7122
+ }
7123
+ }
7124
+
7125
+ .ant-menu-item {
7126
+ transition: none;
7127
+ display: flex;
7128
+ align-items: center;
7283
7129
  height: 32px;
7284
- line-height: 32px;
7285
- font-size: 13px;
7286
- padding: 0 10px;
7287
- display: block;
7288
- overflow: hidden;
7289
- text-overflow: ellipsis;
7290
- white-space: nowrap;
7130
+ line-height: 22px;
7131
+ padding: 0 8px;
7291
7132
 
7292
- &:not(:first-child) {
7293
- &::before {
7294
- content: " ";
7295
- height: 1px;
7296
- width: calc(100% + 10px);
7297
- background: $strokes-translucent-1-light;
7298
- display: block;
7299
- }
7133
+ > .icon-wrapper {
7134
+ margin-right: 12px;
7300
7135
  }
7301
7136
 
7302
- &.ant-dropdown-menu-item-selected {
7303
- color: $blue-60;
7304
- background: transparent;
7137
+ &:not(:last-child) {
7138
+ margin: 0;
7139
+ margin-bottom: 2px;
7140
+ }
7141
+ &.ant-menu-item-selected {
7142
+ background: $background-selected;
7143
+ box-shadow: $box-shadow-light-selected;
7144
+ border-radius: 6px;
7145
+ color: $text-light-on-tint;
7146
+ a {
7147
+ color: $text-light-on-tint;
7148
+ }
7149
+ }
7150
+ &:not(.ant-menu-item-selected) {
7151
+ &.ant-menu-item:hover,
7152
+ &.ant-menu-item-active {
7153
+ background: $background-onhover;
7154
+ box-shadow: $box-shadow-light-onhover;
7155
+ border-radius: 6px;
7156
+ }
7305
7157
  }
7306
7158
  }
7307
7159
  }
7308
7160
  }
7309
7161
 
7162
+ .E_s1wu0lms {
7163
+ .ant-menu-item-group-title {
7164
+ white-space: nowrap;
7165
+ transition: all 0s;
7166
+ }
7310
7167
 
7311
- .E_wg1tsps {
7312
- display: flex;
7313
- align-items: center;
7314
- justify-content: flex-end;
7315
- }
7168
+ &.shrink {
7169
+ transition: all 0s;
7170
+ overflow: hidden;
7316
7171
 
7317
- .E_b1ctd5xy {
7318
- display: flex;
7319
- align-items: center;
7320
- width: calc(100% - 40px);
7172
+ .ant-menu-item-group-title {
7173
+ visibility: hidden;
7174
+ }
7321
7175
 
7322
- .chart {
7323
- display: inline-block;
7324
- width: 100%;
7176
+ .ant-menu-item {
7177
+ width: 36px;
7178
+ padding: 0 6px;
7179
+ }
7325
7180
  }
7326
7181
  }
7327
7182
 
7328
- .E_u1p8acpn {
7329
- min-width: 40px;
7183
+ .E_n1ugzfva {
7184
+ display: flex;
7185
+ place-items: center;
7186
+ width: 100% !important;
7330
7187
 
7331
- .unit {
7332
- color: $text-light-primary !important;
7188
+ &[disabled] {
7189
+ color: rgba(0, 0, 0, 0.25) !important;
7190
+ opacity: 1 !important;
7333
7191
  }
7334
- }
7335
7192
 
7193
+ &.ant-btn {
7194
+ width: 100%;
7195
+ color: $text-light-primary;
7196
+ }
7336
7197
 
7337
- .E_s1iv0tp1 {
7338
- .enabled-switch {
7339
- display: flex;
7340
- align-items: center;
7198
+ .icon-wrapper {
7199
+ margin-right: 12px;
7341
7200
  }
7342
7201
 
7343
- .enabled-text {
7344
- margin-right: 8px;
7202
+ .link-title {
7203
+ flex: 1;
7204
+ overflow: hidden;
7205
+ white-space: nowrap;
7206
+ text-overflow: ellipsis;
7207
+ text-align: left;
7345
7208
  }
7346
7209
  }
7347
7210
 
@@ -7444,204 +7307,341 @@
7444
7307
  text-align: left;
7445
7308
  }
7446
7309
 
7447
- .unit-chart {
7448
- justify-content: flex-start;
7310
+ .unit-chart {
7311
+ justify-content: flex-start;
7312
+ }
7313
+ }
7314
+ }
7315
+
7316
+ .E_rhz2uv5 {
7317
+ width: var(--rhz2uv5-0);
7318
+ flex-shrink: 0;
7319
+ color: $text-secondary-light;
7320
+ padding-right: 12px;
7321
+ }
7322
+
7323
+
7324
+ .E_u15heuvq {
7325
+ &.content {
7326
+ cursor: default !important;
7327
+ &.link {
7328
+ cursor: pointer !important;
7329
+ &:hover {
7330
+ color: $text-colorful-outstanding;
7331
+ }
7332
+ }
7333
+ &.black {
7334
+ color: $text-neutral-primary;
7335
+ }
7336
+ &.gray {
7337
+ color: $text-neutral-secondary;
7338
+ }
7339
+ }
7340
+ }
7341
+
7342
+
7343
+ .E_s1iv0tp1 {
7344
+ .enabled-switch {
7345
+ display: flex;
7346
+ align-items: center;
7347
+ }
7348
+
7349
+ .enabled-text {
7350
+ margin-right: 8px;
7351
+ }
7352
+ }
7353
+
7354
+
7355
+ .E_wg1tsps {
7356
+ display: flex;
7357
+ align-items: center;
7358
+ justify-content: flex-end;
7359
+ }
7360
+
7361
+ .E_b1ctd5xy {
7362
+ display: flex;
7363
+ align-items: center;
7364
+ width: calc(100% - 40px);
7365
+
7366
+ .chart {
7367
+ display: inline-block;
7368
+ width: 100%;
7369
+ }
7370
+ }
7371
+
7372
+ .E_u1p8acpn {
7373
+ min-width: 40px;
7374
+
7375
+ .unit {
7376
+ color: $text-light-primary !important;
7377
+ }
7378
+ }
7379
+
7380
+
7381
+ .E_t160l1cm {
7382
+ display: flex;
7383
+ flex-direction: column;
7384
+ flex: 1;
7385
+
7386
+ .tab-bar {
7387
+ flex-shrink: 0;
7388
+ display: flex;
7389
+ border-bottom: 1px solid $strokes-translucent-1-light;
7390
+ }
7391
+
7392
+ .tab-content {
7393
+ height: 100%;
7394
+ }
7395
+
7396
+ .tab-menu-item {
7397
+ margin-right: 2px;
7398
+ padding: 1px 12px;
7399
+ line-height: 24px;
7400
+ height: 24px;
7401
+ color: $text-secondary-light;
7402
+ border-radius: 4px 4px 0 0;
7403
+ cursor: pointer;
7404
+ transition:
7405
+ color 100ms ease-out,
7406
+ background-color 100ms ease-out,
7407
+ padding-left 320ms ease 80ms;
7408
+
7409
+ &:first-child {
7410
+ padding-left: 0;
7411
+
7412
+ &:hover,
7413
+ &.tab-menu-item-selected {
7414
+ padding-left: 12px;
7415
+ }
7416
+ }
7417
+
7418
+ &:hover {
7419
+ color: $blue-60;
7420
+ background: $fills-trans-terdiary-light;
7421
+
7422
+ .expand-arrow path {
7423
+ fill: $blue-60;
7424
+ }
7449
7425
  }
7450
- }
7451
- }
7452
7426
 
7453
- .E_rhz2uv5 {
7454
- width: var(--rhz2uv5-0);
7455
- flex-shrink: 0;
7456
- color: $text-secondary-light;
7457
- padding-right: 12px;
7458
- }
7427
+ &:active {
7428
+ background: $fills-trans-quaternary-light;
7429
+ }
7459
7430
 
7431
+ &.ant-dropdown-open {
7432
+ color: $blue-60;
7433
+ background: $fills-trans-terdiary-light;
7460
7434
 
7461
- .E_u15heuvq {
7462
- &.content {
7463
- cursor: default !important;
7464
- &.link {
7465
- cursor: pointer !important;
7466
- &:hover {
7467
- color: $text-colorful-outstanding;
7435
+ &:active {
7436
+ background: $fills-trans-quaternary-light;
7468
7437
  }
7469
- }
7470
- &.black {
7471
- color: $text-neutral-primary;
7472
- }
7473
- &.gray {
7474
- color: $text-neutral-secondary;
7475
- }
7476
- }
7477
- }
7478
7438
 
7439
+ &.tab-menu-item-selected {
7440
+ background: rgba($blue-60, 0.16);
7441
+ }
7479
7442
 
7480
- .E_ou7iq30 {
7481
- overflow: hidden;
7482
- text-overflow: ellipsis;
7483
- }
7443
+ .expand-arrow path {
7444
+ fill: $blue-60;
7445
+ }
7446
+ }
7484
7447
 
7485
- .E_s1tui002 {
7486
- white-space: nowrap;
7487
- }
7448
+ &.tab-menu-item-selected {
7449
+ color: $blue-60;
7450
+ background: rgba($blue-60, 0.1);
7488
7451
 
7489
- .E_mxrc2zg {
7490
- display: -webkit-box;
7491
- -webkit-line-clamp: var(--mxrc2zg-0);
7492
- -webkit-box-orient: vertical;
7493
- word-break: break-all;
7494
- }
7452
+ &:hover {
7453
+ background: rgba($blue-60, 0.16);
7454
+ }
7495
7455
 
7496
- .E_t1vv6d68 {
7497
- .ant-tooltip-arrow {
7498
- display: none;
7499
- }
7500
- .ant-tooltip-inner {
7501
- background: $gray-a80-9;
7502
- border-radius: 4px;
7503
- &:has(.eagle-ellipsis-content) {
7504
- visibility: hidden;
7456
+ .expand-arrow path {
7457
+ fill: $blue-100;
7458
+ }
7505
7459
  }
7506
- }
7507
- }
7508
7460
 
7509
-
7510
- .E_s1at6qmn {
7511
- &.ant-layout-sider {
7512
- background: $backgrounds-light-grouped;
7513
- padding: 32px 8px;
7514
- overflow: auto;
7461
+ .expand-arrow {
7462
+ margin-left: 8px;
7463
+ height: 22px;
7464
+ }
7465
+ .expand-arrow path {
7466
+ fill: $text-secondary-light;
7467
+ }
7515
7468
  }
7516
7469
 
7517
- .ant-layout-sider-children {
7470
+ .tab-menu-item-group {
7471
+ padding: 0;
7518
7472
  display: flex;
7519
- flex-direction: column;
7520
- justify-content: space-between;
7521
- }
7473
+ align-items: center;
7474
+ overflow: hidden;
7522
7475
 
7523
- footer {
7524
- display: flex;
7525
- }
7476
+ .main-title {
7477
+ opacity: 0;
7478
+ max-width: 0;
7479
+ transition:
7480
+ max-width 320ms ease,
7481
+ opacity 240ms ease;
7482
+ }
7526
7483
 
7527
- .ant-menu {
7528
- background: $backgrounds-light-grouped;
7529
- a {
7530
- color: $text-light-primary;
7531
- width: 180px;
7532
- overflow: hidden;
7533
- text-overflow: ellipsis;
7484
+ .sub-title {
7485
+ padding: 1px 12px;
7486
+ position: relative;
7487
+ display: flex;
7488
+
7489
+ > .slash-arrow {
7490
+ opacity: 0;
7491
+ position: absolute;
7492
+ top: 50%;
7493
+ left: 0;
7494
+ transform: translate(-50%, -50%);
7495
+ transition: opacity 100ms linear;
7496
+ fill: rgba($blue-60, 0.2);
7497
+ }
7534
7498
  }
7535
- }
7536
7499
 
7537
- .ant-menu-vertical {
7538
- margin-bottom: 24px;
7500
+ &.tab-menu-item-selected {
7501
+ color: $blue-60;
7539
7502
 
7540
- .ant-menu-item-group {
7541
- .ant-menu-item {
7542
- margin: 0;
7503
+ .main-title {
7504
+ padding: 1px 12px;
7505
+ display: inline-block;
7506
+ opacity: 1;
7507
+ max-width: 160px;
7543
7508
  }
7544
- .ant-menu-item-group-title {
7545
- font-size: 12px;
7546
- padding: 0 8px 4px;
7547
- line-height: 18px;
7548
7509
 
7549
- &:empty {
7550
- padding: 0;
7510
+ .sub-title {
7511
+ padding: 1px 12px;
7512
+ color: $blue-80;
7513
+
7514
+ > .slash-arrow {
7515
+ opacity: 1;
7551
7516
  }
7552
7517
  }
7553
- &:not(:last-child) {
7554
- padding-bottom: 24px;
7555
- &.split {
7556
- margin-bottom: 24px;
7557
- border-bottom: 1px solid rgba(211, 218, 235, 0.6);
7518
+
7519
+ &:hover,
7520
+ &:active {
7521
+ .sub-title {
7522
+ background: rgba($blue-60, 0.16);
7523
+ }
7524
+ .sub-title > .slash-arrow {
7525
+ opacity: 0;
7558
7526
  }
7559
7527
  }
7560
7528
  }
7529
+ }
7561
7530
 
7562
- .ant-menu-item {
7563
- transition: none;
7564
- display: flex;
7565
- align-items: center;
7531
+ .tab-menu-item-medium {
7532
+ &.tab-menu-item {
7533
+ padding: 4px 16px;
7566
7534
  height: 32px;
7567
- line-height: 22px;
7568
- padding: 0 8px;
7535
+ border-radius: 6px 6px 0 0;
7569
7536
 
7570
- > .icon-wrapper {
7571
- margin-right: 12px;
7537
+ &:first-child {
7538
+ padding-left: 0;
7539
+ }
7540
+ &:first-child:hover,
7541
+ &.tab-menu-item-selected:first-child {
7542
+ padding-left: 16px;
7572
7543
  }
7573
7544
 
7574
- &:not(:last-child) {
7575
- margin: 0;
7576
- margin-bottom: 2px;
7545
+ .expand-arrow {
7546
+ margin-left: 11px;
7547
+ height: 24px;
7577
7548
  }
7578
- &.ant-menu-item-selected {
7579
- background: $background-selected;
7580
- box-shadow: $box-shadow-light-selected;
7581
- border-radius: 6px;
7582
- color: $text-light-on-tint;
7583
- a {
7584
- color: $text-light-on-tint;
7585
- }
7549
+ }
7550
+
7551
+ &.tab-menu-item-group {
7552
+ padding: 0;
7553
+
7554
+ .sub-title {
7555
+ padding: 4px 16px;
7586
7556
  }
7587
- &:not(.ant-menu-item-selected) {
7588
- &.ant-menu-item:hover,
7589
- &.ant-menu-item-active {
7590
- background: $background-onhover;
7591
- box-shadow: $box-shadow-light-onhover;
7592
- border-radius: 6px;
7593
- }
7557
+
7558
+ &.tab-menu-item-selected .sub-title,
7559
+ &.tab-menu-item-selected .main-title {
7560
+ padding: 4px 16px;
7594
7561
  }
7595
7562
  }
7596
7563
  }
7597
- }
7598
7564
 
7599
- .E_s1wu0lms {
7600
- .ant-menu-item-group-title {
7601
- white-space: nowrap;
7602
- transition: all 0s;
7603
- }
7565
+ .tab-menu-item-light {
7566
+ &:hover,
7567
+ &:active {
7568
+ background: $white;
7569
+ }
7604
7570
 
7605
- &.shrink {
7606
- transition: all 0s;
7607
- overflow: hidden;
7571
+ &:active {
7572
+ color: $blue-80;
7573
+ }
7574
+
7575
+ &.tab-menu-item.tab-menu-item-selected {
7576
+ background: $white;
7577
+ color: $blue-100;
7578
+ }
7579
+
7580
+ &.tab-menu-item-group.tab-menu-item-selected {
7581
+ .main-title {
7582
+ color: rgba($gray-80, 0.6);
7583
+ }
7584
+
7585
+ .sub-title {
7586
+ color: $blue-100;
7587
+ }
7588
+
7589
+ .sub-title > .slash-arrow {
7590
+ fill: $fills-opaque-quaternary-light;
7591
+ }
7608
7592
 
7609
- .ant-menu-item-group-title {
7610
- visibility: hidden;
7593
+ .sub-title > .expand-arrow path {
7594
+ fill: $blue-100;
7595
+ }
7611
7596
  }
7597
+ }
7612
7598
 
7613
- .ant-menu-item {
7614
- width: 36px;
7615
- padding: 0 6px;
7616
- }
7599
+ .tab-content {
7600
+ flex: 1;
7601
+ display: flex;
7602
+ flex-direction: column;
7603
+ }
7604
+
7605
+ /* FIXME:(yanzhen) do this better */
7606
+ &.is-overview .tab-content {
7607
+ overflow: visible;
7617
7608
  }
7618
7609
  }
7619
7610
 
7620
- .E_n1ugzfva {
7621
- display: flex;
7622
- place-items: center;
7623
- width: 100% !important;
7611
+ .E_t14npdqr {
7612
+ max-width: 240px;
7613
+ animation: none;
7624
7614
 
7625
- &[disabled] {
7626
- color: rgba(0, 0, 0, 0.25) !important;
7627
- opacity: 1 !important;
7628
- }
7615
+ &.ant-dropdown .ant-dropdown-menu {
7616
+ border: 1px solid $blue-60;
7617
+ padding: 0;
7629
7618
 
7630
- &.ant-btn {
7631
- width: 100%;
7632
- color: $text-light-primary;
7633
- }
7619
+ .ant-dropdown-menu-item {
7620
+ margin: 0;
7621
+ height: 32px;
7622
+ line-height: 32px;
7623
+ font-size: 13px;
7624
+ padding: 0 10px;
7625
+ display: block;
7626
+ overflow: hidden;
7627
+ text-overflow: ellipsis;
7628
+ white-space: nowrap;
7634
7629
 
7635
- .icon-wrapper {
7636
- margin-right: 12px;
7637
- }
7630
+ &:not(:first-child) {
7631
+ &::before {
7632
+ content: " ";
7633
+ height: 1px;
7634
+ width: calc(100% + 10px);
7635
+ background: $strokes-translucent-1-light;
7636
+ display: block;
7637
+ }
7638
+ }
7638
7639
 
7639
- .link-title {
7640
- flex: 1;
7641
- overflow: hidden;
7642
- white-space: nowrap;
7643
- text-overflow: ellipsis;
7644
- text-align: left;
7640
+ &.ant-dropdown-menu-item-selected {
7641
+ color: $blue-60;
7642
+ background: transparent;
7643
+ }
7644
+ }
7645
7645
  }
7646
7646
  }
7647
7647
 
@@ -7724,13 +7724,6 @@
7724
7724
  }
7725
7725
 
7726
7726
 
7727
- .E_h1ol2wl7 {
7728
- font-weight: bold;
7729
- background-color: unset;
7730
- padding: unset;
7731
- }
7732
-
7733
-
7734
7727
  .E_i5w779o {
7735
7728
  padding: 8px 0;
7736
7729
 
@@ -7849,6 +7842,98 @@
7849
7842
  }
7850
7843
 
7851
7844
 
7845
+ .E_h1ol2wl7 {
7846
+ font-weight: bold;
7847
+ background-color: unset;
7848
+ padding: unset;
7849
+ }
7850
+
7851
+
7852
+ .E_cevhqx7 {
7853
+ color: $text-light-primary;
7854
+ }
7855
+
7856
+ .E_snbqlt4 {
7857
+ margin-top: 8px;
7858
+ color: $text-light-secondary;
7859
+ }
7860
+
7861
+
7862
+ .E_c1ss4prm {
7863
+ color: $text-light-secondary;
7864
+ &:is(ul, ol) {
7865
+ padding-inline-start: 12px;
7866
+ }
7867
+
7868
+ li {
7869
+ margin-bottom: 4px;
7870
+
7871
+ &:last-child {
7872
+ margin-bottom: 0;
7873
+ }
7874
+ }
7875
+ }
7876
+
7877
+ .E_ms3tlei {
7878
+ background: $fill-neutral-trans-2;
7879
+ padding: 8px;
7880
+ border-radius: 6px;
7881
+ color: $gray-a60-8;
7882
+
7883
+ .icon-wrapper {
7884
+ margin-top: 1px; // The text line height is 18px, the icon height is 16px, so a 1px offset is needed
7885
+ margin-right: 4px;
7886
+ }
7887
+
7888
+ li {
7889
+ margin-bottom: 4px;
7890
+ display: flex;
7891
+ align-items: flex-start;
7892
+
7893
+ &:last-child {
7894
+ margin-bottom: 0;
7895
+ }
7896
+ }
7897
+ }
7898
+
7899
+ .E_du44iy7 {
7900
+ margin-bottom: 4px;
7901
+ }
7902
+
7903
+ .E_p1qmhanr {
7904
+ margin-bottom: 8px;
7905
+ }
7906
+
7907
+ .E_srje1h0 {
7908
+ color: $text-light-secondary;
7909
+ margin-bottom: 8px;
7910
+ }
7911
+
7912
+ .E_di3zi7v {
7913
+ height: 1px;
7914
+ background: $strokes-light-opaque-2;
7915
+ margin: 16px 0;
7916
+ }
7917
+
7918
+
7919
+ .E_l12xdkhl {
7920
+ width: 64px;
7921
+ height: 64px;
7922
+ max-width: 64px;
7923
+ max-height: 64px;
7924
+ overflow: hidden;
7925
+ display: flex;
7926
+ align-items: center;
7927
+ justify-content: center;
7928
+ position: relative;
7929
+ opacity: 0.6;
7930
+ .icon-wrapper {
7931
+ @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } };
7932
+ animation: rotate 1200ms cubic-bezier(0.33, 0, 0.67, 1) infinite;
7933
+ }
7934
+ }
7935
+
7936
+
7852
7937
  .E_c1kchka8 {
7853
7938
  height: 100%;
7854
7939
  width: 100%;
@@ -8498,88 +8583,3 @@
8498
8583
  }
8499
8584
  }
8500
8585
 
8501
-
8502
- .E_c1ss4prm {
8503
- color: $text-light-secondary;
8504
- &:is(ul, ol) {
8505
- padding-inline-start: 12px;
8506
- }
8507
-
8508
- li {
8509
- margin-bottom: 4px;
8510
-
8511
- &:last-child {
8512
- margin-bottom: 0;
8513
- }
8514
- }
8515
- }
8516
-
8517
- .E_ms3tlei {
8518
- background: $fill-neutral-trans-2;
8519
- padding: 8px;
8520
- border-radius: 6px;
8521
- color: $gray-a60-8;
8522
-
8523
- .icon-wrapper {
8524
- margin-top: 1px; // The text line height is 18px, the icon height is 16px, so a 1px offset is needed
8525
- margin-right: 4px;
8526
- }
8527
-
8528
- li {
8529
- margin-bottom: 4px;
8530
- display: flex;
8531
- align-items: flex-start;
8532
-
8533
- &:last-child {
8534
- margin-bottom: 0;
8535
- }
8536
- }
8537
- }
8538
-
8539
- .E_du44iy7 {
8540
- margin-bottom: 4px;
8541
- }
8542
-
8543
- .E_p1qmhanr {
8544
- margin-bottom: 8px;
8545
- }
8546
-
8547
- .E_srje1h0 {
8548
- color: $text-light-secondary;
8549
- margin-bottom: 8px;
8550
- }
8551
-
8552
- .E_di3zi7v {
8553
- height: 1px;
8554
- background: $strokes-light-opaque-2;
8555
- margin: 16px 0;
8556
- }
8557
-
8558
-
8559
- .E_cevhqx7 {
8560
- color: $text-light-primary;
8561
- }
8562
-
8563
- .E_snbqlt4 {
8564
- margin-top: 8px;
8565
- color: $text-light-secondary;
8566
- }
8567
-
8568
-
8569
- .E_l12xdkhl {
8570
- width: 64px;
8571
- height: 64px;
8572
- max-width: 64px;
8573
- max-height: 64px;
8574
- overflow: hidden;
8575
- display: flex;
8576
- align-items: center;
8577
- justify-content: center;
8578
- position: relative;
8579
- opacity: 0.6;
8580
- .icon-wrapper {
8581
- @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } };
8582
- animation: rotate 1200ms cubic-bezier(0.33, 0, 0.67, 1) infinite;
8583
- }
8584
- }
8585
-