@helpwave/hightide 0.2.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +142 -196
- package/dist/index.d.ts +142 -196
- package/dist/index.js +862 -986
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +1048 -1166
- package/dist/index.mjs.map +1 -1
- package/dist/style/globals.css +441 -556
- package/dist/style/uncompiled/globals.css +0 -215
- package/dist/style/uncompiled/theme/breakpoints.css +8 -0
- package/dist/style/uncompiled/theme/colors-basic.css +2 -0
- package/dist/style/uncompiled/theme/colors-component.css +1 -77
- package/dist/style/uncompiled/theme/colors-semantic.css +24 -20
- package/dist/style/uncompiled/theme/components.css +211 -0
- package/dist/style/uncompiled/theme/index.css +4 -1
- package/dist/style/uncompiled/utitlity/animation.css +3 -3
- package/dist/style/uncompiled/utitlity/coloring.css +126 -0
- package/dist/style/uncompiled/utitlity/index.css +2 -1
- package/package.json +1 -4
- /package/dist/style/uncompiled/{typography.css → theme/typography.css} +0 -0
package/dist/style/globals.css
CHANGED
|
@@ -7,26 +7,23 @@
|
|
|
7
7
|
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
8
8
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
|
9
9
|
"Courier New", monospace;
|
|
10
|
-
--color-red-50: #FFF9F9;
|
|
11
|
-
--color-red-100: #FBE0E2;
|
|
12
|
-
--color-red-300: #F4A3A7;
|
|
13
10
|
--color-red-400: #E3798A;
|
|
14
11
|
--color-red-500: #DC576D;
|
|
12
|
+
--color-red-600: #D53550;
|
|
15
13
|
--color-orange-100: #FBECD9;
|
|
16
14
|
--color-orange-500: #EA9E40;
|
|
15
|
+
--color-orange-600: #c18133;
|
|
17
16
|
--color-green-500: #69CB81;
|
|
17
|
+
--color-green-600: #61bf78;
|
|
18
18
|
--color-green-700: #53a567;
|
|
19
|
-
--color-blue-50: #F6FAFF;
|
|
20
|
-
--color-blue-100: #D6E3F9;
|
|
21
|
-
--color-blue-200: #99B9EF;
|
|
22
19
|
--color-blue-400: oklch(70.7% 0.165 254.624);
|
|
23
20
|
--color-blue-500: #3272DF;
|
|
24
|
-
--color-blue-
|
|
21
|
+
--color-blue-600: #285BB2;
|
|
25
22
|
--color-blue-900: #11243E;
|
|
26
|
-
--color-purple-50: #EFE6FD;
|
|
27
23
|
--color-purple-100: #CEB0FA;
|
|
28
24
|
--color-purple-400: #8470C5;
|
|
29
25
|
--color-purple-500: #694BB4;
|
|
26
|
+
--color-purple-600: #56389B;
|
|
30
27
|
--color-gray-50: #F2F2F2;
|
|
31
28
|
--color-gray-100: #E6E6E6;
|
|
32
29
|
--color-gray-200: #CCCCCC;
|
|
@@ -37,7 +34,6 @@
|
|
|
37
34
|
--color-gray-700: #4D4D4D;
|
|
38
35
|
--color-gray-800: #333333;
|
|
39
36
|
--color-gray-900: #1A1A1A;
|
|
40
|
-
--color-black: #000000;
|
|
41
37
|
--color-white: #FFFFFF;
|
|
42
38
|
--spacing: 0.25rem;
|
|
43
39
|
--text-xs: calc(12 / 16 * 1rem);
|
|
@@ -72,23 +68,25 @@
|
|
|
72
68
|
--default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
|
|
73
69
|
--default-font-family: var(--font-sans);
|
|
74
70
|
--default-mono-font-family: var(--font-mono);
|
|
75
|
-
--color-gray-25: #F8F8F8;
|
|
76
71
|
--color-gray-75: #EEEEEE;
|
|
77
|
-
--color-gray-150: #D8D8D8;
|
|
78
72
|
--color-gray-750: #3F3F3F;
|
|
79
73
|
--color-gray-850: #222222;
|
|
80
74
|
--color-background: var(--color-gray-75);
|
|
81
75
|
--color-on-background: var(--color-text-primary);
|
|
82
76
|
--color-warning: var(--color-orange-500);
|
|
83
77
|
--color-on-warning: var(--color-white);
|
|
78
|
+
--color-warning-hover: var(--color-orange-600);
|
|
84
79
|
--color-positive: var(--color-green-500);
|
|
85
80
|
--color-on-positive: var(--color-white);
|
|
81
|
+
--color-positive-hover: var(--color-green-600);
|
|
86
82
|
--color-negative: var(--color-red-500);
|
|
87
83
|
--color-on-negative: var(--color-white);
|
|
84
|
+
--color-negative-hover: var(--color-red-600);
|
|
88
85
|
--color-disabled: var(--color-gray-300);
|
|
89
|
-
--color-disabled
|
|
86
|
+
--color-on-disabled: var(--color-gray-500);
|
|
90
87
|
--color-surface: var(--color-gray-50);
|
|
91
88
|
--color-on-surface: var(--color-text-primary);
|
|
89
|
+
--color-surface-hover: var(--color-gray-100);
|
|
92
90
|
--color-surface-variant: var(--color-white);
|
|
93
91
|
--color-surface-warning: var(--color-orange-100);
|
|
94
92
|
--color-text-primary: var(--color-gray-900);
|
|
@@ -98,41 +96,20 @@
|
|
|
98
96
|
--color-label: var(--color-gray-700);
|
|
99
97
|
--color-primary: var(--color-purple-500);
|
|
100
98
|
--color-on-primary: var(--color-white);
|
|
101
|
-
--color-
|
|
99
|
+
--color-primary-hover: var(--color-purple-600);
|
|
100
|
+
--color-secondary: var(--color-blue-500);
|
|
102
101
|
--color-on-secondary: var(--color-white);
|
|
102
|
+
--color-secondary-hover: var(--color-blue-600);
|
|
103
|
+
--color-neutral: var(--color-gray-50);
|
|
104
|
+
--color-on-neutral: var(--color-text-primary);
|
|
105
|
+
--color-neutral-hover: var(--color-gray-100);
|
|
106
|
+
--color-neutral-text: var(--color-text-primary);
|
|
107
|
+
--color-neutral-text-hover: var(--color-text-primary);
|
|
108
|
+
--color-neutral-outline: var(--color-text-primary);
|
|
109
|
+
--color-neutral-outline-hover: var(--color-gray-700);
|
|
103
110
|
--color-highlight: var(--color-blue-500);
|
|
104
|
-
--color-button-outline-primary-icon: var(--color-primary);
|
|
105
|
-
--color-button-outline-primary-text: var(--color-primary);
|
|
106
|
-
--color-button-solid-primary-background: var(--color-primary);
|
|
107
|
-
--color-button-solid-primary-text: var(--color-on-primary);
|
|
108
|
-
--color-button-solid-primary-icon: var(--color-on-primary);
|
|
109
|
-
--color-button-solid-secondary-background: var(--color-purple-50);
|
|
110
|
-
--color-button-solid-secondary-text: var(--color-primary);
|
|
111
|
-
--color-button-solid-secondary-icon: var(--color-primary);
|
|
112
|
-
--color-button-solid-tertiary-background: var(--color-gray-50);
|
|
113
|
-
--color-button-solid-tertiary-icon: var(--color-gray-500);
|
|
114
|
-
--color-button-solid-tertiary-text: var(--color-gray-500);
|
|
115
|
-
--color-button-solid-neutral-background: var(--color-gray-150);
|
|
116
|
-
--color-button-solid-neutral-icon: var(--color-text-primary);
|
|
117
|
-
--color-button-solid-neutral-text: var(--color-text-primary);
|
|
118
|
-
--color-button-solid-positive-background: var(--color-positive);
|
|
119
|
-
--color-button-solid-positive-icon: var(--color-on-positive);
|
|
120
|
-
--color-button-solid-positive-text: var(--color-on-positive);
|
|
121
|
-
--color-button-solid-warning-background: var(--color-warning);
|
|
122
|
-
--color-button-solid-warning-icon: var(--color-on-warning);
|
|
123
|
-
--color-button-solid-warning-text: var(--color-on-warning);
|
|
124
|
-
--color-button-solid-negative-background: var(--color-negative);
|
|
125
|
-
--color-button-solid-negative-icon: var(--color-on-negative);
|
|
126
|
-
--color-button-solid-negative-text: var(--color-on-negative);
|
|
127
|
-
--color-button-text-hover-background: #77777733;
|
|
128
|
-
--color-button-text-neutral-text: var(--color-gray-800);
|
|
129
|
-
--color-button-text-neutral-icon: var(--color-gray-800);
|
|
130
|
-
--color-button-text-negative-text: var(--color-negative);
|
|
131
|
-
--color-button-text-negative-icon: var(--color-negative);
|
|
132
|
-
--color-button-text-primary-text: var(--color-primary);
|
|
133
|
-
--color-button-text-primary-icon: var(--color-primary);
|
|
134
111
|
--color-carousel-dot-active: var(--color-primary);
|
|
135
|
-
--color-carousel-dot-disabled: var(--color-disabled
|
|
112
|
+
--color-carousel-dot-disabled: var(--color-disabled);
|
|
136
113
|
--color-input-background: var(--color-surface-variant);
|
|
137
114
|
--color-input-text: var(--color-on-surface);
|
|
138
115
|
--color-menu-background: var(--color-surface-variant);
|
|
@@ -157,30 +134,6 @@
|
|
|
157
134
|
@supports (color: color-mix(in lab, red, red)) {
|
|
158
135
|
--color-table-row-hover-background: color-mix(in srgb, var(--color-purple-500) 15%, var(--color-surface));
|
|
159
136
|
}
|
|
160
|
-
--color-tag-dark-background: var(--color-gray-800);
|
|
161
|
-
--color-tag-dark-text: var(--color-gray-100);
|
|
162
|
-
--color-tag-dark-icon: var(--color-gray-100);
|
|
163
|
-
--color-tag-default-background: #50687C;
|
|
164
|
-
--color-tag-default-text: var(--color-gray-100);
|
|
165
|
-
--color-tag-default-icon: var(--color-gray-100);
|
|
166
|
-
--color-tag-green-background: #E2E9DB;
|
|
167
|
-
--color-tag-green-text: #7A977E;
|
|
168
|
-
--color-tag-green-icon: #7A977E;
|
|
169
|
-
--color-tag-yellow-background: #FEEACB;
|
|
170
|
-
--color-tag-yellow-text: #C79345;
|
|
171
|
-
--color-tag-yellow-icon: #C79345;
|
|
172
|
-
--color-tag-red-background: #FEE0DD;
|
|
173
|
-
--color-tag-red-text: #D67268;
|
|
174
|
-
--color-tag-red-icon: #D67268;
|
|
175
|
-
--color-tag-blue-background: #DBE2F3;
|
|
176
|
-
--color-tag-blue-text: #758ECE;
|
|
177
|
-
--color-tag-blue-icon: #758ECE;
|
|
178
|
-
--color-tag-pink-background: #F3DBE7;
|
|
179
|
-
--color-tag-pink-text: #CE75A0;
|
|
180
|
-
--color-tag-pink-icon: #CE75A0;
|
|
181
|
-
--color-tag-orange-background: #FEEACB;
|
|
182
|
-
--color-tag-orange-text: #EA8E00;
|
|
183
|
-
--color-tag-orange-icon: #EA8E00;
|
|
184
137
|
--color-text-image-primary-background: var(--color-primary);
|
|
185
138
|
--color-text-image-primary-text: var(--color-white);
|
|
186
139
|
--color-text-image-secondary-background: var(--color-blue-500);
|
|
@@ -422,15 +375,6 @@
|
|
|
422
375
|
.z-10 {
|
|
423
376
|
z-index: 10;
|
|
424
377
|
}
|
|
425
|
-
.z-200 {
|
|
426
|
-
z-index: 200;
|
|
427
|
-
}
|
|
428
|
-
.z-2000 {
|
|
429
|
-
z-index: 2000;
|
|
430
|
-
}
|
|
431
|
-
.z-2001 {
|
|
432
|
-
z-index: 2001;
|
|
433
|
-
}
|
|
434
378
|
.z-\[1\] {
|
|
435
379
|
z-index: 1;
|
|
436
380
|
}
|
|
@@ -500,9 +444,6 @@
|
|
|
500
444
|
.mt-\[6px\] {
|
|
501
445
|
margin-top: 6px;
|
|
502
446
|
}
|
|
503
|
-
.mr-3 {
|
|
504
|
-
margin-right: calc(var(--spacing) * 3);
|
|
505
|
-
}
|
|
506
447
|
.mr-8 {
|
|
507
448
|
margin-right: calc(var(--spacing) * 8);
|
|
508
449
|
}
|
|
@@ -518,9 +459,6 @@
|
|
|
518
459
|
.ml-0\.5 {
|
|
519
460
|
margin-left: calc(var(--spacing) * 0.5);
|
|
520
461
|
}
|
|
521
|
-
.ml-1 {
|
|
522
|
-
margin-left: calc(var(--spacing) * 1);
|
|
523
|
-
}
|
|
524
462
|
.ml-\[6px\] {
|
|
525
463
|
margin-left: 6px;
|
|
526
464
|
}
|
|
@@ -653,9 +591,6 @@
|
|
|
653
591
|
.h-6 {
|
|
654
592
|
height: calc(var(--spacing) * 6);
|
|
655
593
|
}
|
|
656
|
-
.h-7 {
|
|
657
|
-
height: calc(var(--spacing) * 7);
|
|
658
|
-
}
|
|
659
594
|
.h-10 {
|
|
660
595
|
height: calc(var(--spacing) * 10);
|
|
661
596
|
}
|
|
@@ -695,6 +630,9 @@
|
|
|
695
630
|
.max-h-16 {
|
|
696
631
|
max-height: calc(var(--spacing) * 16);
|
|
697
632
|
}
|
|
633
|
+
.max-h-71 {
|
|
634
|
+
max-height: calc(var(--spacing) * 71);
|
|
635
|
+
}
|
|
698
636
|
.max-h-96 {
|
|
699
637
|
max-height: calc(var(--spacing) * 96);
|
|
700
638
|
}
|
|
@@ -722,8 +660,8 @@
|
|
|
722
660
|
.min-h-60 {
|
|
723
661
|
min-height: calc(var(--spacing) * 60);
|
|
724
662
|
}
|
|
725
|
-
.min-h
|
|
726
|
-
min-height:
|
|
663
|
+
.min-h-71 {
|
|
664
|
+
min-height: calc(var(--spacing) * 71);
|
|
727
665
|
}
|
|
728
666
|
.min-h-\[400px\] {
|
|
729
667
|
min-height: 400px;
|
|
@@ -812,6 +750,9 @@
|
|
|
812
750
|
.max-w-48 {
|
|
813
751
|
max-width: calc(var(--spacing) * 48);
|
|
814
752
|
}
|
|
753
|
+
.max-w-56 {
|
|
754
|
+
max-width: calc(var(--spacing) * 56);
|
|
755
|
+
}
|
|
815
756
|
.max-w-64 {
|
|
816
757
|
max-width: calc(var(--spacing) * 64);
|
|
817
758
|
}
|
|
@@ -830,6 +771,9 @@
|
|
|
830
771
|
.min-w-8 {
|
|
831
772
|
min-width: calc(var(--spacing) * 8);
|
|
832
773
|
}
|
|
774
|
+
.min-w-16 {
|
|
775
|
+
min-width: calc(var(--spacing) * 16);
|
|
776
|
+
}
|
|
833
777
|
.min-w-20 {
|
|
834
778
|
min-width: calc(var(--spacing) * 20);
|
|
835
779
|
}
|
|
@@ -842,6 +786,9 @@
|
|
|
842
786
|
.min-w-56 {
|
|
843
787
|
min-width: calc(var(--spacing) * 56);
|
|
844
788
|
}
|
|
789
|
+
.min-w-80 {
|
|
790
|
+
min-width: calc(var(--spacing) * 80);
|
|
791
|
+
}
|
|
845
792
|
.min-w-\[40px\] {
|
|
846
793
|
min-width: 40px;
|
|
847
794
|
}
|
|
@@ -851,9 +798,6 @@
|
|
|
851
798
|
.min-w-\[220px\] {
|
|
852
799
|
min-width: 220px;
|
|
853
800
|
}
|
|
854
|
-
.min-w-\[320px\] {
|
|
855
|
-
min-width: 320px;
|
|
856
|
-
}
|
|
857
801
|
.flex-1 {
|
|
858
802
|
flex: 1;
|
|
859
803
|
}
|
|
@@ -1051,6 +995,22 @@
|
|
|
1051
995
|
border-top-right-radius: var(--radius-xl);
|
|
1052
996
|
border-bottom-right-radius: var(--radius-xl);
|
|
1053
997
|
}
|
|
998
|
+
.coloring-outline-hover {
|
|
999
|
+
border-style: var(--tw-border-style);
|
|
1000
|
+
border-width: 1px;
|
|
1001
|
+
border-color: var(--coloring-border,var(--coloring-outline,var(--coloring-color)));
|
|
1002
|
+
color: var(--coloring-outline,var(--coloring-color));
|
|
1003
|
+
&:hover {
|
|
1004
|
+
@media (hover: hover) {
|
|
1005
|
+
border-color: var(--coloring-border-hover,--coloring-hover);
|
|
1006
|
+
}
|
|
1007
|
+
}
|
|
1008
|
+
&:hover {
|
|
1009
|
+
@media (hover: hover) {
|
|
1010
|
+
color: var(--coloring-outline-hover,var(--coloring-hover));
|
|
1011
|
+
}
|
|
1012
|
+
}
|
|
1013
|
+
}
|
|
1054
1014
|
.\!border-0 {
|
|
1055
1015
|
border-style: var(--tw-border-style) !important;
|
|
1056
1016
|
border-width: 0px !important;
|
|
@@ -1109,12 +1069,12 @@
|
|
|
1109
1069
|
border-color: color-mix(in oklab, var(--color-divider) 50%, transparent);
|
|
1110
1070
|
}
|
|
1111
1071
|
}
|
|
1072
|
+
.border-on-background {
|
|
1073
|
+
border-color: var(--color-on-background);
|
|
1074
|
+
}
|
|
1112
1075
|
.border-primary {
|
|
1113
1076
|
border-color: var(--color-primary);
|
|
1114
1077
|
}
|
|
1115
|
-
.border-secondary {
|
|
1116
|
-
border-color: var(--color-secondary);
|
|
1117
|
-
}
|
|
1118
1078
|
.border-transparent {
|
|
1119
1079
|
border-color: transparent;
|
|
1120
1080
|
}
|
|
@@ -1148,8 +1108,44 @@
|
|
|
1148
1108
|
.border-l-transparent {
|
|
1149
1109
|
border-left-color: transparent;
|
|
1150
1110
|
}
|
|
1151
|
-
|
|
1152
|
-
background-color: var(--color-
|
|
1111
|
+
.coloring-solid-hover {
|
|
1112
|
+
background-color: var(--coloring-solid-color,var(--coloring-color));
|
|
1113
|
+
color: var(--coloring-solid-text,var(--coloring-on-color));
|
|
1114
|
+
&:hover {
|
|
1115
|
+
@media (hover: hover) {
|
|
1116
|
+
background-color: var(--coloring-solid-hover,var(--coloring-hover));
|
|
1117
|
+
}
|
|
1118
|
+
}
|
|
1119
|
+
}
|
|
1120
|
+
.coloring-tonal-hover {
|
|
1121
|
+
background-color: var(--coloring-color);
|
|
1122
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1123
|
+
background-color: color-mix(in oklab, var(--coloring-color) 20%, transparent);
|
|
1124
|
+
}
|
|
1125
|
+
color: var(--coloring-color);
|
|
1126
|
+
&:hover {
|
|
1127
|
+
@media (hover: hover) {
|
|
1128
|
+
background-color: var(--coloring-color);
|
|
1129
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1130
|
+
background-color: color-mix(in oklab, var(--coloring-color) 30%, transparent);
|
|
1131
|
+
}
|
|
1132
|
+
}
|
|
1133
|
+
}
|
|
1134
|
+
}
|
|
1135
|
+
.coloring-solid {
|
|
1136
|
+
background-color: var(--coloring-solid-color,var(--coloring-color));
|
|
1137
|
+
color: var(--coloring-solid-text,var(--coloring-on-color));
|
|
1138
|
+
}
|
|
1139
|
+
.coloring-text-hover {
|
|
1140
|
+
color: var(--coloring-text,var(--coloring-color));
|
|
1141
|
+
&:hover {
|
|
1142
|
+
@media (hover: hover) {
|
|
1143
|
+
background-color: var(--coloring-text-hover,var(--coloring-text,var(--coloring-color)));
|
|
1144
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1145
|
+
background-color: color-mix(in oklab, var(--coloring-text-hover,var(--coloring-text,var(--coloring-color))) 20%, transparent);
|
|
1146
|
+
}
|
|
1147
|
+
}
|
|
1148
|
+
}
|
|
1153
1149
|
}
|
|
1154
1150
|
.\!bg-warning {
|
|
1155
1151
|
background-color: var(--color-warning) !important;
|
|
@@ -1157,20 +1153,17 @@
|
|
|
1157
1153
|
.bg-blue-400 {
|
|
1158
1154
|
background-color: var(--color-blue-400);
|
|
1159
1155
|
}
|
|
1160
|
-
.bg-button-solid-neutral-background {
|
|
1161
|
-
background-color: var(--color-button-solid-neutral-background);
|
|
1162
|
-
}
|
|
1163
|
-
.bg-button-solid-primary-background {
|
|
1164
|
-
background-color: var(--color-button-solid-primary-background);
|
|
1165
|
-
}
|
|
1166
1156
|
.bg-carousel-dot-active {
|
|
1167
1157
|
background-color: var(--color-carousel-dot-active);
|
|
1168
1158
|
}
|
|
1169
1159
|
.bg-carousel-dot-disabled {
|
|
1170
1160
|
background-color: var(--color-carousel-dot-disabled);
|
|
1171
1161
|
}
|
|
1172
|
-
.bg-disabled
|
|
1173
|
-
background-color:
|
|
1162
|
+
.bg-disabled\/30 {
|
|
1163
|
+
background-color: color-mix(in srgb, #B3B3B3 30%, transparent);
|
|
1164
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
1165
|
+
background-color: color-mix(in oklab, var(--color-disabled) 30%, transparent);
|
|
1166
|
+
}
|
|
1174
1167
|
}
|
|
1175
1168
|
.bg-input-background {
|
|
1176
1169
|
background-color: var(--color-input-background);
|
|
@@ -1247,30 +1240,6 @@
|
|
|
1247
1240
|
.bg-surface-warning {
|
|
1248
1241
|
background-color: var(--color-surface-warning);
|
|
1249
1242
|
}
|
|
1250
|
-
.bg-tag-blue-background {
|
|
1251
|
-
background-color: var(--color-tag-blue-background);
|
|
1252
|
-
}
|
|
1253
|
-
.bg-tag-dark-background {
|
|
1254
|
-
background-color: var(--color-tag-dark-background);
|
|
1255
|
-
}
|
|
1256
|
-
.bg-tag-default-background {
|
|
1257
|
-
background-color: var(--color-tag-default-background);
|
|
1258
|
-
}
|
|
1259
|
-
.bg-tag-green-background {
|
|
1260
|
-
background-color: var(--color-tag-green-background);
|
|
1261
|
-
}
|
|
1262
|
-
.bg-tag-orange-background {
|
|
1263
|
-
background-color: var(--color-tag-orange-background);
|
|
1264
|
-
}
|
|
1265
|
-
.bg-tag-pink-background {
|
|
1266
|
-
background-color: var(--color-tag-pink-background);
|
|
1267
|
-
}
|
|
1268
|
-
.bg-tag-red-background {
|
|
1269
|
-
background-color: var(--color-tag-red-background);
|
|
1270
|
-
}
|
|
1271
|
-
.bg-tag-yellow-background {
|
|
1272
|
-
background-color: var(--color-tag-yellow-background);
|
|
1273
|
-
}
|
|
1274
1243
|
.bg-text-image-dark-text {
|
|
1275
1244
|
background-color: var(--color-text-image-dark-text);
|
|
1276
1245
|
}
|
|
@@ -1289,9 +1258,6 @@
|
|
|
1289
1258
|
.bg-warning {
|
|
1290
1259
|
background-color: var(--color-warning);
|
|
1291
1260
|
}
|
|
1292
|
-
.bg-white {
|
|
1293
|
-
background-color: var(--color-white);
|
|
1294
|
-
}
|
|
1295
1261
|
.bg-white\/40 {
|
|
1296
1262
|
background-color: color-mix(in srgb, #FFFFFF 40%, transparent);
|
|
1297
1263
|
@supports (color: color-mix(in lab, red, red)) {
|
|
@@ -1373,9 +1339,6 @@
|
|
|
1373
1339
|
.\!p-0 {
|
|
1374
1340
|
padding: calc(var(--spacing) * 0) !important;
|
|
1375
1341
|
}
|
|
1376
|
-
.p-0\.5 {
|
|
1377
|
-
padding: calc(var(--spacing) * 0.5);
|
|
1378
|
-
}
|
|
1379
1342
|
.p-1 {
|
|
1380
1343
|
padding: calc(var(--spacing) * 1);
|
|
1381
1344
|
}
|
|
@@ -1412,6 +1375,9 @@
|
|
|
1412
1375
|
.px-16 {
|
|
1413
1376
|
padding-inline: calc(var(--spacing) * 16);
|
|
1414
1377
|
}
|
|
1378
|
+
.\!py-0 {
|
|
1379
|
+
padding-block: calc(var(--spacing) * 0) !important;
|
|
1380
|
+
}
|
|
1415
1381
|
.py-0\.5 {
|
|
1416
1382
|
padding-block: calc(var(--spacing) * 0.5);
|
|
1417
1383
|
}
|
|
@@ -1433,12 +1399,18 @@
|
|
|
1433
1399
|
.py-12 {
|
|
1434
1400
|
padding-block: calc(var(--spacing) * 12);
|
|
1435
1401
|
}
|
|
1436
|
-
.
|
|
1437
|
-
padding-
|
|
1402
|
+
.pr-8 {
|
|
1403
|
+
padding-right: calc(var(--spacing) * 8);
|
|
1438
1404
|
}
|
|
1439
1405
|
.pb-2 {
|
|
1440
1406
|
padding-bottom: calc(var(--spacing) * 2);
|
|
1441
1407
|
}
|
|
1408
|
+
.pb-2\.25 {
|
|
1409
|
+
padding-bottom: calc(var(--spacing) * 2.25);
|
|
1410
|
+
}
|
|
1411
|
+
.pl-0 {
|
|
1412
|
+
padding-left: calc(var(--spacing) * 0);
|
|
1413
|
+
}
|
|
1442
1414
|
.pl-2 {
|
|
1443
1415
|
padding-left: calc(var(--spacing) * 2);
|
|
1444
1416
|
}
|
|
@@ -1603,18 +1575,6 @@
|
|
|
1603
1575
|
.\!text-surface-warning {
|
|
1604
1576
|
color: var(--color-surface-warning) !important;
|
|
1605
1577
|
}
|
|
1606
|
-
.text-black {
|
|
1607
|
-
color: var(--color-black);
|
|
1608
|
-
}
|
|
1609
|
-
.text-border {
|
|
1610
|
-
color: var(--color-border);
|
|
1611
|
-
}
|
|
1612
|
-
.text-button-solid-neutral-text {
|
|
1613
|
-
color: var(--color-button-solid-neutral-text);
|
|
1614
|
-
}
|
|
1615
|
-
.text-button-solid-primary-text {
|
|
1616
|
-
color: var(--color-button-solid-primary-text);
|
|
1617
|
-
}
|
|
1618
1578
|
.text-description {
|
|
1619
1579
|
color: var(--color-description);
|
|
1620
1580
|
}
|
|
@@ -1666,54 +1626,6 @@
|
|
|
1666
1626
|
.text-surface-warning {
|
|
1667
1627
|
color: var(--color-surface-warning);
|
|
1668
1628
|
}
|
|
1669
|
-
.text-tag-blue-icon {
|
|
1670
|
-
color: var(--color-tag-blue-icon);
|
|
1671
|
-
}
|
|
1672
|
-
.text-tag-blue-text {
|
|
1673
|
-
color: var(--color-tag-blue-text);
|
|
1674
|
-
}
|
|
1675
|
-
.text-tag-dark-icon {
|
|
1676
|
-
color: var(--color-tag-dark-icon);
|
|
1677
|
-
}
|
|
1678
|
-
.text-tag-dark-text {
|
|
1679
|
-
color: var(--color-tag-dark-text);
|
|
1680
|
-
}
|
|
1681
|
-
.text-tag-default-icon {
|
|
1682
|
-
color: var(--color-tag-default-icon);
|
|
1683
|
-
}
|
|
1684
|
-
.text-tag-default-text {
|
|
1685
|
-
color: var(--color-tag-default-text);
|
|
1686
|
-
}
|
|
1687
|
-
.text-tag-green-icon {
|
|
1688
|
-
color: var(--color-tag-green-icon);
|
|
1689
|
-
}
|
|
1690
|
-
.text-tag-green-text {
|
|
1691
|
-
color: var(--color-tag-green-text);
|
|
1692
|
-
}
|
|
1693
|
-
.text-tag-orange-icon {
|
|
1694
|
-
color: var(--color-tag-orange-icon);
|
|
1695
|
-
}
|
|
1696
|
-
.text-tag-orange-text {
|
|
1697
|
-
color: var(--color-tag-orange-text);
|
|
1698
|
-
}
|
|
1699
|
-
.text-tag-pink-icon {
|
|
1700
|
-
color: var(--color-tag-pink-icon);
|
|
1701
|
-
}
|
|
1702
|
-
.text-tag-pink-text {
|
|
1703
|
-
color: var(--color-tag-pink-text);
|
|
1704
|
-
}
|
|
1705
|
-
.text-tag-red-icon {
|
|
1706
|
-
color: var(--color-tag-red-icon);
|
|
1707
|
-
}
|
|
1708
|
-
.text-tag-red-text {
|
|
1709
|
-
color: var(--color-tag-red-text);
|
|
1710
|
-
}
|
|
1711
|
-
.text-tag-yellow-icon {
|
|
1712
|
-
color: var(--color-tag-yellow-icon);
|
|
1713
|
-
}
|
|
1714
|
-
.text-tag-yellow-text {
|
|
1715
|
-
color: var(--color-tag-yellow-text);
|
|
1716
|
-
}
|
|
1717
1629
|
.text-text-image-dark-background {
|
|
1718
1630
|
color: var(--color-text-image-dark-background);
|
|
1719
1631
|
}
|
|
@@ -1896,6 +1808,130 @@
|
|
|
1896
1808
|
--tw-ease: var(--ease-in-out);
|
|
1897
1809
|
transition-timing-function: var(--ease-in-out);
|
|
1898
1810
|
}
|
|
1811
|
+
.neutral {
|
|
1812
|
+
--coloring-color: initial;
|
|
1813
|
+
--coloring-on-color: initial;
|
|
1814
|
+
--coloring-hover: initial;
|
|
1815
|
+
--coloring-text: initial;
|
|
1816
|
+
--coloring-text-hover: initial;
|
|
1817
|
+
--coloring-outline: initial;
|
|
1818
|
+
--coloring-outline-hover: initial;
|
|
1819
|
+
--coloring-color: var(--color-neutral);
|
|
1820
|
+
--coloring-on-color: var(--color-on-neutral);
|
|
1821
|
+
--coloring-hover: var(--color-neutral-hover);
|
|
1822
|
+
--coloring-text: var(--color-neutral-text);
|
|
1823
|
+
--coloring-text-hover: var(--color-neutral-text-hover);
|
|
1824
|
+
--coloring-outline: var(--color-neutral-outline);
|
|
1825
|
+
--coloring-outline-hover: var(--color-neutral-outline-hover);
|
|
1826
|
+
}
|
|
1827
|
+
.\!disabled {
|
|
1828
|
+
--coloring-color: initial !important;
|
|
1829
|
+
--coloring-on-color: initial !important;
|
|
1830
|
+
--coloring-hover: initial !important;
|
|
1831
|
+
--coloring-text: initial !important;
|
|
1832
|
+
--coloring-text-hover: initial !important;
|
|
1833
|
+
--coloring-outline: initial !important;
|
|
1834
|
+
--coloring-outline-hover: initial !important;
|
|
1835
|
+
--coloring-color: var(--color-disabled) !important;
|
|
1836
|
+
--coloring-on-color: var(--color-on-disabled) !important;
|
|
1837
|
+
--coloring-hover: var(--color-disabled) !important;
|
|
1838
|
+
--coloring-text-hover: transparent !important;
|
|
1839
|
+
}
|
|
1840
|
+
.disabled {
|
|
1841
|
+
--coloring-color: initial;
|
|
1842
|
+
--coloring-on-color: initial;
|
|
1843
|
+
--coloring-hover: initial;
|
|
1844
|
+
--coloring-text: initial;
|
|
1845
|
+
--coloring-text-hover: initial;
|
|
1846
|
+
--coloring-outline: initial;
|
|
1847
|
+
--coloring-outline-hover: initial;
|
|
1848
|
+
--coloring-color: var(--color-disabled);
|
|
1849
|
+
--coloring-on-color: var(--color-on-disabled);
|
|
1850
|
+
--coloring-hover: var(--color-disabled);
|
|
1851
|
+
--coloring-text-hover: transparent;
|
|
1852
|
+
}
|
|
1853
|
+
.negative {
|
|
1854
|
+
--coloring-color: initial;
|
|
1855
|
+
--coloring-on-color: initial;
|
|
1856
|
+
--coloring-hover: initial;
|
|
1857
|
+
--coloring-text: initial;
|
|
1858
|
+
--coloring-text-hover: initial;
|
|
1859
|
+
--coloring-outline: initial;
|
|
1860
|
+
--coloring-outline-hover: initial;
|
|
1861
|
+
--coloring-color: var(--color-negative);
|
|
1862
|
+
--coloring-on-color: var(--color-on-negative);
|
|
1863
|
+
--coloring-hover: var(--color-negative-hover);
|
|
1864
|
+
}
|
|
1865
|
+
.positive {
|
|
1866
|
+
--coloring-color: initial;
|
|
1867
|
+
--coloring-on-color: initial;
|
|
1868
|
+
--coloring-hover: initial;
|
|
1869
|
+
--coloring-text: initial;
|
|
1870
|
+
--coloring-text-hover: initial;
|
|
1871
|
+
--coloring-outline: initial;
|
|
1872
|
+
--coloring-outline-hover: initial;
|
|
1873
|
+
--coloring-color: var(--color-positive);
|
|
1874
|
+
--coloring-on-color: var(--color-on-positive);
|
|
1875
|
+
--coloring-hover: var(--color-positive-hover);
|
|
1876
|
+
}
|
|
1877
|
+
.primary {
|
|
1878
|
+
--coloring-color: initial;
|
|
1879
|
+
--coloring-on-color: initial;
|
|
1880
|
+
--coloring-hover: initial;
|
|
1881
|
+
--coloring-text: initial;
|
|
1882
|
+
--coloring-text-hover: initial;
|
|
1883
|
+
--coloring-outline: initial;
|
|
1884
|
+
--coloring-outline-hover: initial;
|
|
1885
|
+
--coloring-color: var(--color-primary);
|
|
1886
|
+
--coloring-on-color: var(--color-on-primary);
|
|
1887
|
+
--coloring-hover: var(--color-primary-hover);
|
|
1888
|
+
}
|
|
1889
|
+
.secondary {
|
|
1890
|
+
--coloring-color: initial;
|
|
1891
|
+
--coloring-on-color: initial;
|
|
1892
|
+
--coloring-hover: initial;
|
|
1893
|
+
--coloring-text: initial;
|
|
1894
|
+
--coloring-text-hover: initial;
|
|
1895
|
+
--coloring-outline: initial;
|
|
1896
|
+
--coloring-outline-hover: initial;
|
|
1897
|
+
--coloring-color: var(--color-secondary);
|
|
1898
|
+
--coloring-on-color: var(--color-on-secondary);
|
|
1899
|
+
--coloring-hover: var(--color-secondary-hover);
|
|
1900
|
+
}
|
|
1901
|
+
.surface {
|
|
1902
|
+
--coloring-color: initial;
|
|
1903
|
+
--coloring-on-color: initial;
|
|
1904
|
+
--coloring-hover: initial;
|
|
1905
|
+
--coloring-text: initial;
|
|
1906
|
+
--coloring-text-hover: initial;
|
|
1907
|
+
--coloring-outline: initial;
|
|
1908
|
+
--coloring-outline-hover: initial;
|
|
1909
|
+
--coloring-color: var(--color-surface);
|
|
1910
|
+
--coloring-on-color: var(--color-on-surface);
|
|
1911
|
+
--coloring-hover: var(--color-surface-hover);
|
|
1912
|
+
}
|
|
1913
|
+
.warning {
|
|
1914
|
+
--coloring-color: initial;
|
|
1915
|
+
--coloring-on-color: initial;
|
|
1916
|
+
--coloring-hover: initial;
|
|
1917
|
+
--coloring-text: initial;
|
|
1918
|
+
--coloring-text-hover: initial;
|
|
1919
|
+
--coloring-outline: initial;
|
|
1920
|
+
--coloring-outline-hover: initial;
|
|
1921
|
+
--coloring-color: var(--color-warning);
|
|
1922
|
+
--coloring-on-color: var(--color-on-warning);
|
|
1923
|
+
--coloring-hover: var(--color-warning-hover);
|
|
1924
|
+
}
|
|
1925
|
+
.description {
|
|
1926
|
+
--coloring-color: initial;
|
|
1927
|
+
--coloring-on-color: initial;
|
|
1928
|
+
--coloring-hover: initial;
|
|
1929
|
+
--coloring-text: initial;
|
|
1930
|
+
--coloring-text-hover: initial;
|
|
1931
|
+
--coloring-outline: initial;
|
|
1932
|
+
--coloring-outline-hover: initial;
|
|
1933
|
+
--coloring-color: var(--color-description);
|
|
1934
|
+
}
|
|
1899
1935
|
.select-none {
|
|
1900
1936
|
-webkit-user-select: none;
|
|
1901
1937
|
user-select: none;
|
|
@@ -1909,161 +1945,6 @@
|
|
|
1909
1945
|
.shadow-r-4 {
|
|
1910
1946
|
--shadow-right: calc(4 * 1px) 0 calc(4 * 1px) 0 var(--tw-shadow-color, rgb(0 0 0 / 2%));
|
|
1911
1947
|
}
|
|
1912
|
-
.not-group-disabled\:text-button-outline-primary-icon {
|
|
1913
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1914
|
-
color: var(--color-button-outline-primary-icon);
|
|
1915
|
-
}
|
|
1916
|
-
}
|
|
1917
|
-
.not-group-disabled\:text-button-solid-negative-icon {
|
|
1918
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1919
|
-
color: var(--color-button-solid-negative-icon);
|
|
1920
|
-
}
|
|
1921
|
-
}
|
|
1922
|
-
.not-group-disabled\:text-button-solid-neutral-icon {
|
|
1923
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1924
|
-
color: var(--color-button-solid-neutral-icon);
|
|
1925
|
-
}
|
|
1926
|
-
}
|
|
1927
|
-
.not-group-disabled\:text-button-solid-positive-icon {
|
|
1928
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1929
|
-
color: var(--color-button-solid-positive-icon);
|
|
1930
|
-
}
|
|
1931
|
-
}
|
|
1932
|
-
.not-group-disabled\:text-button-solid-primary-icon {
|
|
1933
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1934
|
-
color: var(--color-button-solid-primary-icon);
|
|
1935
|
-
}
|
|
1936
|
-
}
|
|
1937
|
-
.not-group-disabled\:text-button-solid-secondary-icon {
|
|
1938
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1939
|
-
color: var(--color-button-solid-secondary-icon);
|
|
1940
|
-
}
|
|
1941
|
-
}
|
|
1942
|
-
.not-group-disabled\:text-button-solid-tertiary-icon {
|
|
1943
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1944
|
-
color: var(--color-button-solid-tertiary-icon);
|
|
1945
|
-
}
|
|
1946
|
-
}
|
|
1947
|
-
.not-group-disabled\:text-button-solid-warning-icon {
|
|
1948
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1949
|
-
color: var(--color-button-solid-warning-icon);
|
|
1950
|
-
}
|
|
1951
|
-
}
|
|
1952
|
-
.not-group-disabled\:text-button-text-negative-icon {
|
|
1953
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1954
|
-
color: var(--color-button-text-negative-icon);
|
|
1955
|
-
}
|
|
1956
|
-
}
|
|
1957
|
-
.not-group-disabled\:text-button-text-neutral-icon {
|
|
1958
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1959
|
-
color: var(--color-button-text-neutral-icon);
|
|
1960
|
-
}
|
|
1961
|
-
}
|
|
1962
|
-
.not-group-disabled\:text-button-text-primary-icon {
|
|
1963
|
-
&:not(*:is(:where(.group):disabled *)) {
|
|
1964
|
-
color: var(--color-button-text-primary-icon);
|
|
1965
|
-
}
|
|
1966
|
-
}
|
|
1967
|
-
.not-disabled\:border-button-outline-primary-text {
|
|
1968
|
-
&:not(*:disabled) {
|
|
1969
|
-
border-color: var(--color-button-outline-primary-text);
|
|
1970
|
-
}
|
|
1971
|
-
}
|
|
1972
|
-
.not-disabled\:bg-button-solid-negative-background {
|
|
1973
|
-
&:not(*:disabled) {
|
|
1974
|
-
background-color: var(--color-button-solid-negative-background);
|
|
1975
|
-
}
|
|
1976
|
-
}
|
|
1977
|
-
.not-disabled\:bg-button-solid-neutral-background {
|
|
1978
|
-
&:not(*:disabled) {
|
|
1979
|
-
background-color: var(--color-button-solid-neutral-background);
|
|
1980
|
-
}
|
|
1981
|
-
}
|
|
1982
|
-
.not-disabled\:bg-button-solid-positive-background {
|
|
1983
|
-
&:not(*:disabled) {
|
|
1984
|
-
background-color: var(--color-button-solid-positive-background);
|
|
1985
|
-
}
|
|
1986
|
-
}
|
|
1987
|
-
.not-disabled\:bg-button-solid-primary-background {
|
|
1988
|
-
&:not(*:disabled) {
|
|
1989
|
-
background-color: var(--color-button-solid-primary-background);
|
|
1990
|
-
}
|
|
1991
|
-
}
|
|
1992
|
-
.not-disabled\:bg-button-solid-secondary-background {
|
|
1993
|
-
&:not(*:disabled) {
|
|
1994
|
-
background-color: var(--color-button-solid-secondary-background);
|
|
1995
|
-
}
|
|
1996
|
-
}
|
|
1997
|
-
.not-disabled\:bg-button-solid-tertiary-background {
|
|
1998
|
-
&:not(*:disabled) {
|
|
1999
|
-
background-color: var(--color-button-solid-tertiary-background);
|
|
2000
|
-
}
|
|
2001
|
-
}
|
|
2002
|
-
.not-disabled\:bg-button-solid-warning-background {
|
|
2003
|
-
&:not(*:disabled) {
|
|
2004
|
-
background-color: var(--color-button-solid-warning-background);
|
|
2005
|
-
}
|
|
2006
|
-
}
|
|
2007
|
-
.not-disabled\:bg-transparent {
|
|
2008
|
-
&:not(*:disabled) {
|
|
2009
|
-
background-color: transparent;
|
|
2010
|
-
}
|
|
2011
|
-
}
|
|
2012
|
-
.not-disabled\:text-button-outline-primary-text {
|
|
2013
|
-
&:not(*:disabled) {
|
|
2014
|
-
color: var(--color-button-outline-primary-text);
|
|
2015
|
-
}
|
|
2016
|
-
}
|
|
2017
|
-
.not-disabled\:text-button-solid-negative-text {
|
|
2018
|
-
&:not(*:disabled) {
|
|
2019
|
-
color: var(--color-button-solid-negative-text);
|
|
2020
|
-
}
|
|
2021
|
-
}
|
|
2022
|
-
.not-disabled\:text-button-solid-neutral-text {
|
|
2023
|
-
&:not(*:disabled) {
|
|
2024
|
-
color: var(--color-button-solid-neutral-text);
|
|
2025
|
-
}
|
|
2026
|
-
}
|
|
2027
|
-
.not-disabled\:text-button-solid-positive-text {
|
|
2028
|
-
&:not(*:disabled) {
|
|
2029
|
-
color: var(--color-button-solid-positive-text);
|
|
2030
|
-
}
|
|
2031
|
-
}
|
|
2032
|
-
.not-disabled\:text-button-solid-primary-text {
|
|
2033
|
-
&:not(*:disabled) {
|
|
2034
|
-
color: var(--color-button-solid-primary-text);
|
|
2035
|
-
}
|
|
2036
|
-
}
|
|
2037
|
-
.not-disabled\:text-button-solid-secondary-text {
|
|
2038
|
-
&:not(*:disabled) {
|
|
2039
|
-
color: var(--color-button-solid-secondary-text);
|
|
2040
|
-
}
|
|
2041
|
-
}
|
|
2042
|
-
.not-disabled\:text-button-solid-tertiary-text {
|
|
2043
|
-
&:not(*:disabled) {
|
|
2044
|
-
color: var(--color-button-solid-tertiary-text);
|
|
2045
|
-
}
|
|
2046
|
-
}
|
|
2047
|
-
.not-disabled\:text-button-solid-warning-text {
|
|
2048
|
-
&:not(*:disabled) {
|
|
2049
|
-
color: var(--color-button-solid-warning-text);
|
|
2050
|
-
}
|
|
2051
|
-
}
|
|
2052
|
-
.not-disabled\:text-button-text-negative-text {
|
|
2053
|
-
&:not(*:disabled) {
|
|
2054
|
-
color: var(--color-button-text-negative-text);
|
|
2055
|
-
}
|
|
2056
|
-
}
|
|
2057
|
-
.not-disabled\:text-button-text-neutral-text {
|
|
2058
|
-
&:not(*:disabled) {
|
|
2059
|
-
color: var(--color-button-text-neutral-text);
|
|
2060
|
-
}
|
|
2061
|
-
}
|
|
2062
|
-
.not-disabled\:text-button-text-primary-text {
|
|
2063
|
-
&:not(*:disabled) {
|
|
2064
|
-
color: var(--color-button-text-primary-text);
|
|
2065
|
-
}
|
|
2066
|
-
}
|
|
2067
1948
|
.not-data-disabled\:cursor-pointer {
|
|
2068
1949
|
&:not(*[data-disabled]) {
|
|
2069
1950
|
cursor: pointer;
|
|
@@ -2146,13 +2027,6 @@
|
|
|
2146
2027
|
}
|
|
2147
2028
|
}
|
|
2148
2029
|
}
|
|
2149
|
-
.hover\:bg-button-solid-primary-background {
|
|
2150
|
-
&:hover {
|
|
2151
|
-
@media (hover: hover) {
|
|
2152
|
-
background-color: var(--color-button-solid-primary-background);
|
|
2153
|
-
}
|
|
2154
|
-
}
|
|
2155
|
-
}
|
|
2156
2030
|
.hover\:bg-carousel-dot-active {
|
|
2157
2031
|
&:hover {
|
|
2158
2032
|
@media (hover: hover) {
|
|
@@ -2160,23 +2034,6 @@
|
|
|
2160
2034
|
}
|
|
2161
2035
|
}
|
|
2162
2036
|
}
|
|
2163
|
-
.hover\:bg-description\/20 {
|
|
2164
|
-
&:hover {
|
|
2165
|
-
@media (hover: hover) {
|
|
2166
|
-
background-color: color-mix(in srgb, #666666 20%, transparent);
|
|
2167
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2168
|
-
background-color: color-mix(in oklab, var(--color-description) 20%, transparent);
|
|
2169
|
-
}
|
|
2170
|
-
}
|
|
2171
|
-
}
|
|
2172
|
-
}
|
|
2173
|
-
.hover\:bg-primary {
|
|
2174
|
-
&:hover {
|
|
2175
|
-
@media (hover: hover) {
|
|
2176
|
-
background-color: var(--color-primary);
|
|
2177
|
-
}
|
|
2178
|
-
}
|
|
2179
|
-
}
|
|
2180
2037
|
.hover\:bg-primary\/20 {
|
|
2181
2038
|
&:hover {
|
|
2182
2039
|
@media (hover: hover) {
|
|
@@ -2194,13 +2051,6 @@
|
|
|
2194
2051
|
}
|
|
2195
2052
|
}
|
|
2196
2053
|
}
|
|
2197
|
-
.hover\:text-button-solid-primary-text {
|
|
2198
|
-
&:hover {
|
|
2199
|
-
@media (hover: hover) {
|
|
2200
|
-
color: var(--color-button-solid-primary-text);
|
|
2201
|
-
}
|
|
2202
|
-
}
|
|
2203
|
-
}
|
|
2204
2054
|
.hover\:text-on-background {
|
|
2205
2055
|
&:hover {
|
|
2206
2056
|
@media (hover: hover) {
|
|
@@ -2208,13 +2058,6 @@
|
|
|
2208
2058
|
}
|
|
2209
2059
|
}
|
|
2210
2060
|
}
|
|
2211
|
-
.hover\:text-on-primary {
|
|
2212
|
-
&:hover {
|
|
2213
|
-
@media (hover: hover) {
|
|
2214
|
-
color: var(--color-on-primary);
|
|
2215
|
-
}
|
|
2216
|
-
}
|
|
2217
|
-
}
|
|
2218
2061
|
.hover\:brightness-75 {
|
|
2219
2062
|
&:hover {
|
|
2220
2063
|
@media (hover: hover) {
|
|
@@ -2239,71 +2082,6 @@
|
|
|
2239
2082
|
}
|
|
2240
2083
|
}
|
|
2241
2084
|
}
|
|
2242
|
-
.not-disabled\:hover\:bg-button-text-hover-background {
|
|
2243
|
-
&:not(*:disabled) {
|
|
2244
|
-
&:hover {
|
|
2245
|
-
@media (hover: hover) {
|
|
2246
|
-
background-color: var(--color-button-text-hover-background);
|
|
2247
|
-
}
|
|
2248
|
-
}
|
|
2249
|
-
}
|
|
2250
|
-
}
|
|
2251
|
-
.not-disabled\:hover\:bg-button-text-negative-text\/20 {
|
|
2252
|
-
&:not(*:disabled) {
|
|
2253
|
-
&:hover {
|
|
2254
|
-
@media (hover: hover) {
|
|
2255
|
-
background-color: color-mix(in srgb, #DC576D 20%, transparent);
|
|
2256
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2257
|
-
background-color: color-mix(in oklab, var(--color-button-text-negative-text) 20%, transparent);
|
|
2258
|
-
}
|
|
2259
|
-
}
|
|
2260
|
-
}
|
|
2261
|
-
}
|
|
2262
|
-
}
|
|
2263
|
-
.not-disabled\:hover\:bg-button-text-neutral-text\/20 {
|
|
2264
|
-
&:not(*:disabled) {
|
|
2265
|
-
&:hover {
|
|
2266
|
-
@media (hover: hover) {
|
|
2267
|
-
background-color: color-mix(in srgb, #333333 20%, transparent);
|
|
2268
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2269
|
-
background-color: color-mix(in oklab, var(--color-button-text-neutral-text) 20%, transparent);
|
|
2270
|
-
}
|
|
2271
|
-
}
|
|
2272
|
-
}
|
|
2273
|
-
}
|
|
2274
|
-
}
|
|
2275
|
-
.not-disabled\:hover\:bg-button-text-primary-text\/20 {
|
|
2276
|
-
&:not(*:disabled) {
|
|
2277
|
-
&:hover {
|
|
2278
|
-
@media (hover: hover) {
|
|
2279
|
-
background-color: color-mix(in srgb, #694BB4 20%, transparent);
|
|
2280
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2281
|
-
background-color: color-mix(in oklab, var(--color-button-text-primary-text) 20%, transparent);
|
|
2282
|
-
}
|
|
2283
|
-
}
|
|
2284
|
-
}
|
|
2285
|
-
}
|
|
2286
|
-
}
|
|
2287
|
-
.not-disabled\:hover\:brightness-80 {
|
|
2288
|
-
&:not(*:disabled) {
|
|
2289
|
-
&:hover {
|
|
2290
|
-
@media (hover: hover) {
|
|
2291
|
-
--tw-brightness: brightness(80%);
|
|
2292
|
-
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
|
2293
|
-
}
|
|
2294
|
-
}
|
|
2295
|
-
}
|
|
2296
|
-
}
|
|
2297
|
-
.not-disabled\:hover\:brightness-90 {
|
|
2298
|
-
&:not(*:disabled) {
|
|
2299
|
-
&:hover {
|
|
2300
|
-
@media (hover: hover) {
|
|
2301
|
-
--tw-brightness: brightness(90%);
|
|
2302
|
-
filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
|
|
2303
|
-
}
|
|
2304
|
-
}
|
|
2305
|
-
}
|
|
2306
|
-
}
|
|
2307
2085
|
.focus\:border-primary {
|
|
2308
2086
|
&:focus {
|
|
2309
2087
|
border-color: var(--color-primary);
|
|
@@ -2326,72 +2104,6 @@
|
|
|
2326
2104
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2327
2105
|
}
|
|
2328
2106
|
}
|
|
2329
|
-
.not-disabled\:focus-visible\:bg-button-text-negative-text\/20 {
|
|
2330
|
-
&:not(*:disabled) {
|
|
2331
|
-
&:focus-visible {
|
|
2332
|
-
background-color: color-mix(in srgb, #DC576D 20%, transparent);
|
|
2333
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2334
|
-
background-color: color-mix(in oklab, var(--color-button-text-negative-text) 20%, transparent);
|
|
2335
|
-
}
|
|
2336
|
-
}
|
|
2337
|
-
}
|
|
2338
|
-
}
|
|
2339
|
-
.not-disabled\:focus-visible\:bg-button-text-neutral-text\/20 {
|
|
2340
|
-
&:not(*:disabled) {
|
|
2341
|
-
&:focus-visible {
|
|
2342
|
-
background-color: color-mix(in srgb, #333333 20%, transparent);
|
|
2343
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2344
|
-
background-color: color-mix(in oklab, var(--color-button-text-neutral-text) 20%, transparent);
|
|
2345
|
-
}
|
|
2346
|
-
}
|
|
2347
|
-
}
|
|
2348
|
-
}
|
|
2349
|
-
.not-disabled\:focus-visible\:bg-button-text-primary-text\/20 {
|
|
2350
|
-
&:not(*:disabled) {
|
|
2351
|
-
&:focus-visible {
|
|
2352
|
-
background-color: color-mix(in srgb, #694BB4 20%, transparent);
|
|
2353
|
-
@supports (color: color-mix(in lab, red, red)) {
|
|
2354
|
-
background-color: color-mix(in oklab, var(--color-button-text-primary-text) 20%, transparent);
|
|
2355
|
-
}
|
|
2356
|
-
}
|
|
2357
|
-
}
|
|
2358
|
-
}
|
|
2359
|
-
.not-disabled\:focus-visible\:outline-button-text-negative-text {
|
|
2360
|
-
&:not(*:disabled) {
|
|
2361
|
-
&:focus-visible {
|
|
2362
|
-
outline-color: var(--color-button-text-negative-text);
|
|
2363
|
-
}
|
|
2364
|
-
}
|
|
2365
|
-
}
|
|
2366
|
-
.not-disabled\:focus-visible\:outline-button-text-neutral-text {
|
|
2367
|
-
&:not(*:disabled) {
|
|
2368
|
-
&:focus-visible {
|
|
2369
|
-
outline-color: var(--color-button-text-neutral-text);
|
|
2370
|
-
}
|
|
2371
|
-
}
|
|
2372
|
-
}
|
|
2373
|
-
.not-disabled\:focus-visible\:outline-button-text-primary-text {
|
|
2374
|
-
&:not(*:disabled) {
|
|
2375
|
-
&:focus-visible {
|
|
2376
|
-
outline-color: var(--color-button-text-primary-text);
|
|
2377
|
-
}
|
|
2378
|
-
}
|
|
2379
|
-
}
|
|
2380
|
-
.disabled\:bg-disabled-background {
|
|
2381
|
-
&:disabled {
|
|
2382
|
-
background-color: var(--color-disabled-background);
|
|
2383
|
-
}
|
|
2384
|
-
}
|
|
2385
|
-
.disabled\:text-disabled {
|
|
2386
|
-
&:disabled {
|
|
2387
|
-
color: var(--color-disabled);
|
|
2388
|
-
}
|
|
2389
|
-
}
|
|
2390
|
-
.disabled\:opacity-70 {
|
|
2391
|
-
&:disabled {
|
|
2392
|
-
opacity: 70%;
|
|
2393
|
-
}
|
|
2394
|
-
}
|
|
2395
2107
|
.data-disabled\:cursor-not-allowed {
|
|
2396
2108
|
&[data-disabled] {
|
|
2397
2109
|
cursor: not-allowed;
|
|
@@ -2633,7 +2345,7 @@
|
|
|
2633
2345
|
left: -100%;
|
|
2634
2346
|
height: 100%;
|
|
2635
2347
|
width: 200%;
|
|
2636
|
-
background: linear-gradient( 120deg, transparent 0%, transparent
|
|
2348
|
+
background: linear-gradient( 120deg, transparent 0%, transparent 25%, rgba(255, 255, 255, 0.15) 50%, transparent 75%, transparent 100% );
|
|
2637
2349
|
animation: shimmer 2s infinite;
|
|
2638
2350
|
}
|
|
2639
2351
|
}
|
|
@@ -2815,6 +2527,154 @@
|
|
|
2815
2527
|
box-shadow: var(--shadow-right, 0 0 0 transparent), var(--shadow-left, 0 0 0 transparent), var(--shadow-top, 0 0 0 transparent), var(--shadow-bottom, 0 0 0 transparent);
|
|
2816
2528
|
}
|
|
2817
2529
|
}
|
|
2530
|
+
@layer theme, base, components, utilities;
|
|
2531
|
+
@layer theme;
|
|
2532
|
+
@layer base {
|
|
2533
|
+
*, ::after, ::before, ::backdrop, ::file-selector-button {
|
|
2534
|
+
box-sizing: border-box;
|
|
2535
|
+
margin: 0;
|
|
2536
|
+
padding: 0;
|
|
2537
|
+
border: 0 solid;
|
|
2538
|
+
}
|
|
2539
|
+
html, :host {
|
|
2540
|
+
line-height: 1.5;
|
|
2541
|
+
-webkit-text-size-adjust: 100%;
|
|
2542
|
+
tab-size: 4;
|
|
2543
|
+
font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
|
|
2544
|
+
font-feature-settings: var(--default-font-feature-settings, normal);
|
|
2545
|
+
font-variation-settings: var(--default-font-variation-settings, normal);
|
|
2546
|
+
-webkit-tap-highlight-color: transparent;
|
|
2547
|
+
}
|
|
2548
|
+
hr {
|
|
2549
|
+
height: 0;
|
|
2550
|
+
color: inherit;
|
|
2551
|
+
border-top-width: 1px;
|
|
2552
|
+
}
|
|
2553
|
+
abbr:where([title]) {
|
|
2554
|
+
-webkit-text-decoration: underline dotted;
|
|
2555
|
+
text-decoration: underline dotted;
|
|
2556
|
+
}
|
|
2557
|
+
h1, h2, h3, h4, h5, h6 {
|
|
2558
|
+
font-size: inherit;
|
|
2559
|
+
font-weight: inherit;
|
|
2560
|
+
}
|
|
2561
|
+
a {
|
|
2562
|
+
color: inherit;
|
|
2563
|
+
-webkit-text-decoration: inherit;
|
|
2564
|
+
text-decoration: inherit;
|
|
2565
|
+
}
|
|
2566
|
+
b, strong {
|
|
2567
|
+
font-weight: bolder;
|
|
2568
|
+
}
|
|
2569
|
+
code, kbd, samp, pre {
|
|
2570
|
+
font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
|
|
2571
|
+
font-feature-settings: var(--default-mono-font-feature-settings, normal);
|
|
2572
|
+
font-variation-settings: var(--default-mono-font-variation-settings, normal);
|
|
2573
|
+
font-size: 1em;
|
|
2574
|
+
}
|
|
2575
|
+
small {
|
|
2576
|
+
font-size: 80%;
|
|
2577
|
+
}
|
|
2578
|
+
sub, sup {
|
|
2579
|
+
font-size: 75%;
|
|
2580
|
+
line-height: 0;
|
|
2581
|
+
position: relative;
|
|
2582
|
+
vertical-align: baseline;
|
|
2583
|
+
}
|
|
2584
|
+
sub {
|
|
2585
|
+
bottom: -0.25em;
|
|
2586
|
+
}
|
|
2587
|
+
sup {
|
|
2588
|
+
top: -0.5em;
|
|
2589
|
+
}
|
|
2590
|
+
table {
|
|
2591
|
+
text-indent: 0;
|
|
2592
|
+
border-color: inherit;
|
|
2593
|
+
border-collapse: collapse;
|
|
2594
|
+
}
|
|
2595
|
+
:-moz-focusring {
|
|
2596
|
+
outline: auto;
|
|
2597
|
+
}
|
|
2598
|
+
progress {
|
|
2599
|
+
vertical-align: baseline;
|
|
2600
|
+
}
|
|
2601
|
+
summary {
|
|
2602
|
+
display: list-item;
|
|
2603
|
+
}
|
|
2604
|
+
ol, ul, menu {
|
|
2605
|
+
list-style: none;
|
|
2606
|
+
}
|
|
2607
|
+
img, svg, video, canvas, audio, iframe, embed, object {
|
|
2608
|
+
display: block;
|
|
2609
|
+
vertical-align: middle;
|
|
2610
|
+
}
|
|
2611
|
+
img, video {
|
|
2612
|
+
max-width: 100%;
|
|
2613
|
+
height: auto;
|
|
2614
|
+
}
|
|
2615
|
+
button, input, select, optgroup, textarea, ::file-selector-button {
|
|
2616
|
+
font: inherit;
|
|
2617
|
+
font-feature-settings: inherit;
|
|
2618
|
+
font-variation-settings: inherit;
|
|
2619
|
+
letter-spacing: inherit;
|
|
2620
|
+
color: inherit;
|
|
2621
|
+
border-radius: 0;
|
|
2622
|
+
background-color: transparent;
|
|
2623
|
+
opacity: 1;
|
|
2624
|
+
}
|
|
2625
|
+
:where(select:is([multiple], [size])) optgroup {
|
|
2626
|
+
font-weight: bolder;
|
|
2627
|
+
}
|
|
2628
|
+
:where(select:is([multiple], [size])) optgroup option {
|
|
2629
|
+
padding-inline-start: 20px;
|
|
2630
|
+
}
|
|
2631
|
+
::file-selector-button {
|
|
2632
|
+
margin-inline-end: 4px;
|
|
2633
|
+
}
|
|
2634
|
+
::placeholder {
|
|
2635
|
+
opacity: 1;
|
|
2636
|
+
}
|
|
2637
|
+
@supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
|
|
2638
|
+
::placeholder {
|
|
2639
|
+
color: currentcolor;
|
|
2640
|
+
@supports (color: color-mix(in lab, red, red)) {
|
|
2641
|
+
color: color-mix(in oklab, currentcolor 50%, transparent);
|
|
2642
|
+
}
|
|
2643
|
+
}
|
|
2644
|
+
}
|
|
2645
|
+
textarea {
|
|
2646
|
+
resize: vertical;
|
|
2647
|
+
}
|
|
2648
|
+
::-webkit-search-decoration {
|
|
2649
|
+
-webkit-appearance: none;
|
|
2650
|
+
}
|
|
2651
|
+
::-webkit-date-and-time-value {
|
|
2652
|
+
min-height: 1lh;
|
|
2653
|
+
text-align: inherit;
|
|
2654
|
+
}
|
|
2655
|
+
::-webkit-datetime-edit {
|
|
2656
|
+
display: inline-flex;
|
|
2657
|
+
}
|
|
2658
|
+
::-webkit-datetime-edit-fields-wrapper {
|
|
2659
|
+
padding: 0;
|
|
2660
|
+
}
|
|
2661
|
+
::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {
|
|
2662
|
+
padding-block: 0;
|
|
2663
|
+
}
|
|
2664
|
+
:-moz-ui-invalid {
|
|
2665
|
+
box-shadow: none;
|
|
2666
|
+
}
|
|
2667
|
+
button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button {
|
|
2668
|
+
appearance: button;
|
|
2669
|
+
}
|
|
2670
|
+
::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
|
|
2671
|
+
height: auto;
|
|
2672
|
+
}
|
|
2673
|
+
[hidden]:where(:not([hidden="until-found"])) {
|
|
2674
|
+
display: none !important;
|
|
2675
|
+
}
|
|
2676
|
+
}
|
|
2677
|
+
@layer utilities;
|
|
2818
2678
|
@layer base;
|
|
2819
2679
|
@layer base;
|
|
2820
2680
|
@layer base {
|
|
@@ -2824,8 +2684,9 @@
|
|
|
2824
2684
|
--color-positive: var(--color-green-700);
|
|
2825
2685
|
--color-negative: var(--color-red-500);
|
|
2826
2686
|
--color-disabled: var(--color-gray-500);
|
|
2827
|
-
--color-disabled
|
|
2687
|
+
--color-on-disabled: var(--color-gray-300);
|
|
2828
2688
|
--color-surface: var(--color-gray-800);
|
|
2689
|
+
--color-surface-hover: var(--color-gray-700);
|
|
2829
2690
|
--color-surface-variant: var(--color-gray-900);
|
|
2830
2691
|
--color-text-primary: var(--color-gray-100);
|
|
2831
2692
|
--color-text-secondary: var(--color-gray-400);
|
|
@@ -2834,6 +2695,9 @@
|
|
|
2834
2695
|
--color-description: var(--color-gray-400);
|
|
2835
2696
|
--color-label: var(--color-gray-300);
|
|
2836
2697
|
--color-primary: var(--color-purple-400);
|
|
2698
|
+
--color-neutral: var(--color-gray-700);
|
|
2699
|
+
--color-neutral-hover: var(--color-gray-800);
|
|
2700
|
+
--color-neutral-outline-hover: var(--color-gray-200);
|
|
2837
2701
|
}
|
|
2838
2702
|
}
|
|
2839
2703
|
@layer base;
|
|
@@ -2844,8 +2708,9 @@
|
|
|
2844
2708
|
--color-positive: var(--color-green-700);
|
|
2845
2709
|
--color-negative: var(--color-red-500);
|
|
2846
2710
|
--color-disabled: var(--color-gray-500);
|
|
2847
|
-
--color-disabled
|
|
2711
|
+
--color-on-disabled: var(--color-gray-300);
|
|
2848
2712
|
--color-surface: var(--color-gray-800);
|
|
2713
|
+
--color-surface-hover: var(--color-gray-700);
|
|
2849
2714
|
--color-surface-variant: var(--color-gray-900);
|
|
2850
2715
|
--color-text-primary: var(--color-gray-100);
|
|
2851
2716
|
--color-text-secondary: var(--color-gray-400);
|
|
@@ -2854,22 +2719,18 @@
|
|
|
2854
2719
|
--color-description: var(--color-gray-400);
|
|
2855
2720
|
--color-label: var(--color-gray-300);
|
|
2856
2721
|
--color-primary: var(--color-purple-400);
|
|
2722
|
+
--color-neutral: var(--color-gray-700);
|
|
2723
|
+
--color-neutral-hover: var(--color-gray-800);
|
|
2724
|
+
--color-neutral-outline-hover: var(--color-gray-200);
|
|
2857
2725
|
}
|
|
2858
2726
|
}
|
|
2859
2727
|
@layer base {
|
|
2860
2728
|
&:where([data-theme=dark], [data-theme=dark] *) {
|
|
2861
|
-
--color-button-solid-neutral-background: var(--color-gray-750);
|
|
2862
|
-
--color-button-solid-neutral-icon: var(--color-gray-100);
|
|
2863
|
-
--color-button-solid-neutral-text: var(--color-gray-100);
|
|
2864
|
-
--color-button-text-hover-background: #3F3F3F33;
|
|
2865
|
-
--color-button-text-neutral-text: var(--color-gray-100);
|
|
2866
|
-
--color-button-text-neutral-icon: var(--color-gray-100);
|
|
2867
2729
|
--color-property-title-background: var(--color-gray-750);
|
|
2868
2730
|
--color-progress-indicator-background: var(--color-gray-700);
|
|
2869
2731
|
--color-overlay-shadow: #00000060;
|
|
2870
2732
|
--color-scrollbar-track: #FFFFFF33;
|
|
2871
2733
|
--color-scrollbar-thumb: var(--color-gray-300);
|
|
2872
|
-
--color-tag-dark-background: var(--color-gray-900);
|
|
2873
2734
|
--color-border: var(--color-gray-600);
|
|
2874
2735
|
--color-divider: var(--color-gray-700);
|
|
2875
2736
|
--color-focus: var(--color-primary);
|
|
@@ -2878,6 +2739,19 @@
|
|
|
2878
2739
|
}
|
|
2879
2740
|
}
|
|
2880
2741
|
@layer components {
|
|
2742
|
+
.btn-xs {
|
|
2743
|
+
display: flex;
|
|
2744
|
+
flex-direction: row;
|
|
2745
|
+
column-gap: calc(var(--spacing) * 1);
|
|
2746
|
+
height: calc(var(--spacing) * 7);
|
|
2747
|
+
align-items: center;
|
|
2748
|
+
justify-content: center;
|
|
2749
|
+
border-radius: calc(var(--spacing) * 1);
|
|
2750
|
+
padding-inline: calc(var(--spacing) * 1);
|
|
2751
|
+
padding-block: calc(var(--spacing) * 0.75);
|
|
2752
|
+
font-size: var(--text-sm);
|
|
2753
|
+
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
2754
|
+
}
|
|
2881
2755
|
.btn-sm {
|
|
2882
2756
|
display: flex;
|
|
2883
2757
|
flex-direction: row;
|
|
@@ -2955,6 +2829,8 @@
|
|
|
2955
2829
|
border-radius: calc(var(--spacing) * 1.5);
|
|
2956
2830
|
padding: calc(var(--spacing) * 3);
|
|
2957
2831
|
}
|
|
2832
|
+
}
|
|
2833
|
+
@layer components {
|
|
2958
2834
|
.card-sm {
|
|
2959
2835
|
display: flex;
|
|
2960
2836
|
flex-direction: column;
|
|
@@ -2985,48 +2861,40 @@
|
|
|
2985
2861
|
padding-block: calc(var(--spacing) * 4);
|
|
2986
2862
|
color: var(--color-on-surface);
|
|
2987
2863
|
}
|
|
2988
|
-
|
|
2864
|
+
}
|
|
2865
|
+
@layer components {
|
|
2866
|
+
.chip-sm {
|
|
2989
2867
|
display: flex;
|
|
2990
2868
|
flex-direction: row;
|
|
2991
2869
|
column-gap: calc(var(--spacing) * 1);
|
|
2992
2870
|
align-items: center;
|
|
2993
2871
|
justify-content: center;
|
|
2994
2872
|
border-radius: var(--radius-md);
|
|
2995
|
-
padding-inline: calc(var(--spacing) *
|
|
2996
|
-
padding-block: calc(var(--spacing) *
|
|
2873
|
+
padding-inline: calc(var(--spacing) * 1);
|
|
2874
|
+
padding-block: calc(var(--spacing) * 0.5);
|
|
2997
2875
|
}
|
|
2998
|
-
.chip-
|
|
2876
|
+
.chip-md {
|
|
2999
2877
|
display: flex;
|
|
3000
2878
|
flex-direction: row;
|
|
3001
2879
|
column-gap: calc(var(--spacing) * 1);
|
|
3002
2880
|
align-items: center;
|
|
3003
2881
|
justify-content: center;
|
|
3004
|
-
border-radius:
|
|
2882
|
+
border-radius: var(--radius-md);
|
|
3005
2883
|
padding-inline: calc(var(--spacing) * 2);
|
|
3006
2884
|
padding-block: calc(var(--spacing) * 1);
|
|
3007
2885
|
}
|
|
3008
|
-
.
|
|
3009
|
-
|
|
3010
|
-
|
|
3011
|
-
|
|
3012
|
-
|
|
3013
|
-
|
|
3014
|
-
|
|
3015
|
-
|
|
3016
|
-
|
|
3017
|
-
.section-padding-y {
|
|
3018
|
-
padding-block: calc(var(--spacing) * 16);
|
|
3019
|
-
}
|
|
3020
|
-
.section-padding {
|
|
3021
|
-
padding-inline: calc(var(--spacing) * 6);
|
|
3022
|
-
padding-block: calc(var(--spacing) * 16);
|
|
3023
|
-
@media (width >= 48rem) {
|
|
3024
|
-
padding-inline: calc(var(--spacing) * 12);
|
|
3025
|
-
}
|
|
3026
|
-
@media (width >= 64rem) {
|
|
3027
|
-
padding-inline: calc(var(--spacing) * 24);
|
|
3028
|
-
}
|
|
2886
|
+
.chip-lg {
|
|
2887
|
+
display: flex;
|
|
2888
|
+
flex-direction: row;
|
|
2889
|
+
column-gap: calc(var(--spacing) * 2);
|
|
2890
|
+
align-items: center;
|
|
2891
|
+
justify-content: center;
|
|
2892
|
+
border-radius: var(--radius-md);
|
|
2893
|
+
padding-inline: calc(var(--spacing) * 4);
|
|
2894
|
+
padding-block: calc(var(--spacing) * 2);
|
|
3029
2895
|
}
|
|
2896
|
+
}
|
|
2897
|
+
@layer components {
|
|
3030
2898
|
.link {
|
|
3031
2899
|
border-radius: 0.25rem;
|
|
3032
2900
|
padding: calc(var(--spacing) * 2);
|
|
@@ -3044,6 +2912,8 @@
|
|
|
3044
2912
|
text-decoration-line: underline;
|
|
3045
2913
|
}
|
|
3046
2914
|
}
|
|
2915
|
+
}
|
|
2916
|
+
@layer components {
|
|
3047
2917
|
* {
|
|
3048
2918
|
list-style-type: none;
|
|
3049
2919
|
border-color: var(--color-border);
|
|
@@ -3495,6 +3365,21 @@
|
|
|
3495
3365
|
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
3496
3366
|
}
|
|
3497
3367
|
}
|
|
3368
|
+
@keyframes pulse {
|
|
3369
|
+
50% {
|
|
3370
|
+
opacity: 0.5;
|
|
3371
|
+
}
|
|
3372
|
+
}
|
|
3373
|
+
@keyframes bounce {
|
|
3374
|
+
0%, 100% {
|
|
3375
|
+
transform: translateY(-25%);
|
|
3376
|
+
animation-timing-function: cubic-bezier(0.8, 0, 1, 1);
|
|
3377
|
+
}
|
|
3378
|
+
50% {
|
|
3379
|
+
transform: none;
|
|
3380
|
+
animation-timing-function: cubic-bezier(0, 0, 0.2, 1);
|
|
3381
|
+
}
|
|
3382
|
+
}
|
|
3498
3383
|
@layer properties {
|
|
3499
3384
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
3500
3385
|
*, ::before, ::after, ::backdrop {
|