@abhir9/pd-design-system 0.1.17 → 0.1.18

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 (3) hide show
  1. package/dist/index.css +30 -1245
  2. package/dist/styles.css +16 -1037
  3. package/package.json +1 -1
package/dist/styles.css CHANGED
@@ -1,337 +1,4 @@
1
1
  /* src/styles.css */
2
- *,
3
- ::before,
4
- ::after {
5
- --tw-border-spacing-x: 0;
6
- --tw-border-spacing-y: 0;
7
- --tw-translate-x: 0;
8
- --tw-translate-y: 0;
9
- --tw-rotate: 0;
10
- --tw-skew-x: 0;
11
- --tw-skew-y: 0;
12
- --tw-scale-x: 1;
13
- --tw-scale-y: 1;
14
- --tw-pan-x: ;
15
- --tw-pan-y: ;
16
- --tw-pinch-zoom: ;
17
- --tw-scroll-snap-strictness: proximity;
18
- --tw-gradient-from-position: ;
19
- --tw-gradient-via-position: ;
20
- --tw-gradient-to-position: ;
21
- --tw-ordinal: ;
22
- --tw-slashed-zero: ;
23
- --tw-numeric-figure: ;
24
- --tw-numeric-spacing: ;
25
- --tw-numeric-fraction: ;
26
- --tw-ring-inset: ;
27
- --tw-ring-offset-width: 0px;
28
- --tw-ring-offset-color: #fff;
29
- --tw-ring-color: rgb(59 130 246 / 0.5);
30
- --tw-ring-offset-shadow: 0 0 #0000;
31
- --tw-ring-shadow: 0 0 #0000;
32
- --tw-shadow: 0 0 #0000;
33
- --tw-shadow-colored: 0 0 #0000;
34
- --tw-blur: ;
35
- --tw-brightness: ;
36
- --tw-contrast: ;
37
- --tw-grayscale: ;
38
- --tw-hue-rotate: ;
39
- --tw-invert: ;
40
- --tw-saturate: ;
41
- --tw-sepia: ;
42
- --tw-drop-shadow: ;
43
- --tw-backdrop-blur: ;
44
- --tw-backdrop-brightness: ;
45
- --tw-backdrop-contrast: ;
46
- --tw-backdrop-grayscale: ;
47
- --tw-backdrop-hue-rotate: ;
48
- --tw-backdrop-invert: ;
49
- --tw-backdrop-opacity: ;
50
- --tw-backdrop-saturate: ;
51
- --tw-backdrop-sepia: ;
52
- --tw-contain-size: ;
53
- --tw-contain-layout: ;
54
- --tw-contain-paint: ;
55
- --tw-contain-style: ;
56
- }
57
- ::backdrop {
58
- --tw-border-spacing-x: 0;
59
- --tw-border-spacing-y: 0;
60
- --tw-translate-x: 0;
61
- --tw-translate-y: 0;
62
- --tw-rotate: 0;
63
- --tw-skew-x: 0;
64
- --tw-skew-y: 0;
65
- --tw-scale-x: 1;
66
- --tw-scale-y: 1;
67
- --tw-pan-x: ;
68
- --tw-pan-y: ;
69
- --tw-pinch-zoom: ;
70
- --tw-scroll-snap-strictness: proximity;
71
- --tw-gradient-from-position: ;
72
- --tw-gradient-via-position: ;
73
- --tw-gradient-to-position: ;
74
- --tw-ordinal: ;
75
- --tw-slashed-zero: ;
76
- --tw-numeric-figure: ;
77
- --tw-numeric-spacing: ;
78
- --tw-numeric-fraction: ;
79
- --tw-ring-inset: ;
80
- --tw-ring-offset-width: 0px;
81
- --tw-ring-offset-color: #fff;
82
- --tw-ring-color: rgb(59 130 246 / 0.5);
83
- --tw-ring-offset-shadow: 0 0 #0000;
84
- --tw-ring-shadow: 0 0 #0000;
85
- --tw-shadow: 0 0 #0000;
86
- --tw-shadow-colored: 0 0 #0000;
87
- --tw-blur: ;
88
- --tw-brightness: ;
89
- --tw-contrast: ;
90
- --tw-grayscale: ;
91
- --tw-hue-rotate: ;
92
- --tw-invert: ;
93
- --tw-saturate: ;
94
- --tw-sepia: ;
95
- --tw-drop-shadow: ;
96
- --tw-backdrop-blur: ;
97
- --tw-backdrop-brightness: ;
98
- --tw-backdrop-contrast: ;
99
- --tw-backdrop-grayscale: ;
100
- --tw-backdrop-hue-rotate: ;
101
- --tw-backdrop-invert: ;
102
- --tw-backdrop-opacity: ;
103
- --tw-backdrop-saturate: ;
104
- --tw-backdrop-sepia: ;
105
- --tw-contain-size: ;
106
- --tw-contain-layout: ;
107
- --tw-contain-paint: ;
108
- --tw-contain-style: ;
109
- }
110
- *,
111
- ::before,
112
- ::after {
113
- box-sizing: border-box;
114
- border-width: 0;
115
- border-style: solid;
116
- border-color: #e5e7eb;
117
- }
118
- ::before,
119
- ::after {
120
- --tw-content: "";
121
- }
122
- html,
123
- :host {
124
- line-height: 1.5;
125
- -webkit-text-size-adjust: 100%;
126
- -moz-tab-size: 4;
127
- -o-tab-size: 4;
128
- tab-size: 4;
129
- font-family:
130
- ui-sans-serif,
131
- system-ui,
132
- sans-serif,
133
- "Apple Color Emoji",
134
- "Segoe UI Emoji",
135
- "Segoe UI Symbol",
136
- "Noto Color Emoji";
137
- font-feature-settings: normal;
138
- font-variation-settings: normal;
139
- -webkit-tap-highlight-color: transparent;
140
- }
141
- body {
142
- margin: 0;
143
- line-height: inherit;
144
- }
145
- hr {
146
- height: 0;
147
- color: inherit;
148
- border-top-width: 1px;
149
- }
150
- abbr:where([title]) {
151
- -webkit-text-decoration: underline dotted;
152
- text-decoration: underline dotted;
153
- }
154
- h1,
155
- h2,
156
- h3,
157
- h4,
158
- h5,
159
- h6 {
160
- font-size: inherit;
161
- font-weight: inherit;
162
- }
163
- a {
164
- color: inherit;
165
- text-decoration: inherit;
166
- }
167
- b,
168
- strong {
169
- font-weight: bolder;
170
- }
171
- code,
172
- kbd,
173
- samp,
174
- pre {
175
- font-family:
176
- ui-monospace,
177
- SFMono-Regular,
178
- Menlo,
179
- Monaco,
180
- Consolas,
181
- "Liberation Mono",
182
- "Courier New",
183
- monospace;
184
- font-feature-settings: normal;
185
- font-variation-settings: normal;
186
- font-size: 1em;
187
- }
188
- small {
189
- font-size: 80%;
190
- }
191
- sub,
192
- sup {
193
- font-size: 75%;
194
- line-height: 0;
195
- position: relative;
196
- vertical-align: baseline;
197
- }
198
- sub {
199
- bottom: -0.25em;
200
- }
201
- sup {
202
- top: -0.5em;
203
- }
204
- table {
205
- text-indent: 0;
206
- border-color: inherit;
207
- border-collapse: collapse;
208
- }
209
- button,
210
- input,
211
- optgroup,
212
- select,
213
- textarea {
214
- font-family: inherit;
215
- font-feature-settings: inherit;
216
- font-variation-settings: inherit;
217
- font-size: 100%;
218
- font-weight: inherit;
219
- line-height: inherit;
220
- letter-spacing: inherit;
221
- color: inherit;
222
- margin: 0;
223
- padding: 0;
224
- }
225
- button,
226
- select {
227
- text-transform: none;
228
- }
229
- button,
230
- input:where([type=button]),
231
- input:where([type=reset]),
232
- input:where([type=submit]) {
233
- -webkit-appearance: button;
234
- background-color: transparent;
235
- background-image: none;
236
- }
237
- :-moz-focusring {
238
- outline: auto;
239
- }
240
- :-moz-ui-invalid {
241
- box-shadow: none;
242
- }
243
- progress {
244
- vertical-align: baseline;
245
- }
246
- ::-webkit-inner-spin-button,
247
- ::-webkit-outer-spin-button {
248
- height: auto;
249
- }
250
- [type=search] {
251
- -webkit-appearance: textfield;
252
- outline-offset: -2px;
253
- }
254
- ::-webkit-search-decoration {
255
- -webkit-appearance: none;
256
- }
257
- ::-webkit-file-upload-button {
258
- -webkit-appearance: button;
259
- font: inherit;
260
- }
261
- summary {
262
- display: list-item;
263
- }
264
- blockquote,
265
- dl,
266
- dd,
267
- h1,
268
- h2,
269
- h3,
270
- h4,
271
- h5,
272
- h6,
273
- hr,
274
- figure,
275
- p,
276
- pre {
277
- margin: 0;
278
- }
279
- fieldset {
280
- margin: 0;
281
- padding: 0;
282
- }
283
- legend {
284
- padding: 0;
285
- }
286
- ol,
287
- ul,
288
- menu {
289
- list-style: none;
290
- margin: 0;
291
- padding: 0;
292
- }
293
- dialog {
294
- padding: 0;
295
- }
296
- textarea {
297
- resize: vertical;
298
- }
299
- input::-moz-placeholder,
300
- textarea::-moz-placeholder {
301
- opacity: 1;
302
- color: #9ca3af;
303
- }
304
- input::placeholder,
305
- textarea::placeholder {
306
- opacity: 1;
307
- color: #9ca3af;
308
- }
309
- button,
310
- [role=button] {
311
- cursor: pointer;
312
- }
313
- :disabled {
314
- cursor: default;
315
- }
316
- img,
317
- svg,
318
- video,
319
- canvas,
320
- audio,
321
- iframe,
322
- embed,
323
- object {
324
- display: block;
325
- vertical-align: middle;
326
- }
327
- img,
328
- video {
329
- max-width: 100%;
330
- height: auto;
331
- }
332
- [hidden]:where(:not([hidden=until-found])) {
333
- display: none;
334
- }
335
2
  :root {
336
3
  --accent: #EDEDED;
337
4
  --accent-foreground: #17171C;
@@ -762,38 +429,6 @@ textarea:focus-visible {
762
429
  outline: 2px solid var(--intent-primary);
763
430
  outline-offset: 2px;
764
431
  }
765
- .container {
766
- width: 100%;
767
- }
768
- @media (min-width: 640px) {
769
- .container {
770
- max-width: 640px;
771
- }
772
- }
773
- @media (min-width: 768px) {
774
- .container {
775
- max-width: 768px;
776
- }
777
- }
778
- @media (min-width: 1024px) {
779
- .container {
780
- max-width: 1024px;
781
- }
782
- }
783
- @media (min-width: 1280px) {
784
- .container {
785
- max-width: 1280px;
786
- }
787
- }
788
- @media (min-width: 1536px) {
789
- .container {
790
- max-width: 1536px;
791
- }
792
- }
793
- button {
794
- font-family: inherit;
795
- font-size: inherit;
796
- }
797
432
  .sr-only {
798
433
  position: absolute;
799
434
  width: 1px;
@@ -805,542 +440,18 @@ button {
805
440
  white-space: nowrap;
806
441
  border-width: 0;
807
442
  }
808
- .fixed {
809
- position: fixed;
810
- }
811
- .absolute {
812
- position: absolute;
813
- }
814
- .relative {
815
- position: relative;
816
- }
817
- .sticky {
818
- position: sticky;
819
- }
820
- .bottom-1 {
821
- bottom: 0.25rem;
822
- }
823
- .left-1\/2 {
824
- left: 50%;
825
- }
826
- .mx-auto {
827
- margin-left: auto;
828
- margin-right: auto;
829
- }
830
- .mb-1 {
831
- margin-bottom: 0.25rem;
832
- }
833
- .mb-2 {
834
- margin-bottom: 0.5rem;
835
- }
836
- .mb-6 {
837
- margin-bottom: 1.5rem;
838
- }
839
- .ml-1\.5 {
840
- margin-left: 0.375rem;
841
- }
842
- .ml-2 {
843
- margin-left: 0.5rem;
844
- }
845
- .ml-2\.5 {
846
- margin-left: 0.625rem;
847
- }
848
- .mr-1\.5 {
849
- margin-right: 0.375rem;
850
- }
851
- .mr-2 {
852
- margin-right: 0.5rem;
853
- }
854
- .mr-2\.5 {
855
- margin-right: 0.625rem;
856
- }
857
- .inline {
858
- display: inline;
859
- }
860
- .flex {
861
- display: flex;
862
- }
863
- .inline-flex {
864
- display: inline-flex;
865
- }
866
- .table {
867
- display: table;
868
- }
869
- .grid {
870
- display: grid;
871
- }
872
- .hidden {
443
+ .no-scrollbar::-webkit-scrollbar {
873
444
  display: none;
874
445
  }
875
- .h-10 {
876
- height: 2.5rem;
877
- }
878
- .h-12 {
879
- height: 3rem;
880
- }
881
- .h-16 {
882
- height: 4rem;
883
- }
884
- .h-2 {
885
- height: 0.5rem;
886
- }
887
- .h-28 {
888
- height: 7rem;
889
- }
890
- .h-3 {
891
- height: 0.75rem;
892
- }
893
- .h-4 {
894
- height: 1rem;
895
- }
896
- .h-5 {
897
- height: 1.25rem;
898
- }
899
- .h-8 {
900
- height: 2rem;
901
- }
902
- .min-h-\[100px\] {
903
- min-height: 100px;
904
- }
905
- .min-h-screen {
906
- min-height: 100vh;
907
- }
908
- .w-2 {
909
- width: 0.5rem;
910
- }
911
- .w-20 {
912
- width: 5rem;
913
- }
914
- .w-24 {
915
- width: 6rem;
916
- }
917
- .w-3 {
918
- width: 0.75rem;
919
- }
920
- .w-4 {
921
- width: 1rem;
922
- }
923
- .w-5 {
924
- width: 1.25rem;
925
- }
926
- .w-full {
927
- width: 100%;
446
+ .no-scrollbar {
447
+ -ms-overflow-style: none;
448
+ scrollbar-width: none;
928
449
  }
929
- .min-w-0 {
930
- min-width: 0px;
931
- }
932
- .max-w-3xl {
933
- max-width: 48rem;
934
- }
935
- .max-w-4xl {
936
- max-width: 56rem;
937
- }
938
- .max-w-7xl {
939
- max-width: 80rem;
940
- }
941
- .max-w-\[1400px\] {
942
- max-width: 1400px;
943
- }
944
- .max-w-md {
945
- max-width: 28rem;
946
- }
947
- .flex-1 {
948
- flex: 1 1 0%;
949
- }
950
- .flex-shrink-0 {
951
- flex-shrink: 0;
952
- }
953
- .-translate-x-1\/2 {
954
- --tw-translate-x: -50%;
955
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
956
- }
957
- @keyframes spin {
958
- to {
959
- transform: rotate(360deg);
960
- }
961
- }
962
- .animate-spin {
963
- animation: spin 1s linear infinite;
964
- }
965
- .cursor-pointer {
966
- cursor: pointer;
967
- }
968
- .grid-cols-1 {
969
- grid-template-columns: repeat(1, minmax(0, 1fr));
970
- }
971
- .grid-cols-3 {
972
- grid-template-columns: repeat(3, minmax(0, 1fr));
973
- }
974
- .grid-cols-\[150px_repeat\(5\,1fr\)\] {
975
- grid-template-columns: 150px repeat(5, 1fr);
976
- }
977
- .flex-row {
978
- flex-direction: row;
979
- }
980
- .flex-col {
981
- flex-direction: column;
982
- }
983
- .flex-wrap {
984
- flex-wrap: wrap;
985
- }
986
- .items-start {
987
- align-items: flex-start;
988
- }
989
- .items-center {
990
- align-items: center;
991
- }
992
- .justify-center {
993
- justify-content: center;
994
- }
995
- .gap-1 {
996
- gap: 0.25rem;
997
- }
998
- .gap-2 {
999
- gap: 0.5rem;
1000
- }
1001
- .gap-3 {
1002
- gap: 0.75rem;
1003
- }
1004
- .gap-4 {
1005
- gap: 1rem;
1006
- }
1007
- .gap-6 {
1008
- gap: 1.5rem;
1009
- }
1010
- .gap-8 {
1011
- gap: 2rem;
1012
- }
1013
- .gap-x-6 {
1014
- -moz-column-gap: 1.5rem;
1015
- column-gap: 1.5rem;
1016
- }
1017
- .space-y-10 > :not([hidden]) ~ :not([hidden]) {
1018
- --tw-space-y-reverse: 0;
1019
- margin-top: calc(2.5rem * calc(1 - var(--tw-space-y-reverse)));
1020
- margin-bottom: calc(2.5rem * var(--tw-space-y-reverse));
1021
- }
1022
- .space-y-3 > :not([hidden]) ~ :not([hidden]) {
1023
- --tw-space-y-reverse: 0;
1024
- margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
1025
- margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
1026
- }
1027
- .space-y-4 > :not([hidden]) ~ :not([hidden]) {
1028
- --tw-space-y-reverse: 0;
1029
- margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
1030
- margin-bottom: calc(1rem * var(--tw-space-y-reverse));
1031
- }
1032
- .space-y-6 > :not([hidden]) ~ :not([hidden]) {
1033
- --tw-space-y-reverse: 0;
1034
- margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
1035
- margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
1036
- }
1037
- .space-y-8 > :not([hidden]) ~ :not([hidden]) {
1038
- --tw-space-y-reverse: 0;
1039
- margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
1040
- margin-bottom: calc(2rem * var(--tw-space-y-reverse));
1041
- }
1042
- .overflow-hidden {
1043
- overflow: hidden;
450
+ .backdrop-blur-sm {
451
+ backdrop-filter: blur(4px);
1044
452
  }
1045
- .overflow-x-auto {
1046
- overflow-x: auto;
1047
- }
1048
- .truncate {
1049
- overflow: hidden;
1050
- text-overflow: ellipsis;
1051
- white-space: nowrap;
1052
- }
1053
- .whitespace-nowrap {
1054
- white-space: nowrap;
1055
- }
1056
- .rounded-full {
1057
- border-radius: 9999px;
1058
- }
1059
- .rounded-lg {
1060
- border-radius: 0.5rem;
1061
- }
1062
- .rounded-md {
1063
- border-radius: 0.375rem;
1064
- }
1065
- .rounded-xl {
1066
- border-radius: 0.75rem;
1067
- }
1068
- .border {
1069
- border-width: 1px;
1070
- }
1071
- .border-2 {
1072
- border-width: 2px;
1073
- }
1074
- .border-\[var\(--border-blue\)\] {
1075
- border-color: var(--border-blue);
1076
- }
1077
- .border-\[var\(--border-green\)\] {
1078
- border-color: var(--border-green);
1079
- }
1080
- .border-\[var\(--border-green-subtle\)\] {
1081
- border-color: var(--border-green-subtle);
1082
- }
1083
- .border-\[var\(--border-primary\)\] {
1084
- border-color: var(--border-primary);
1085
- }
1086
- .border-\[var\(--border-red\)\] {
1087
- border-color: var(--border-red);
1088
- }
1089
- .border-\[var\(--border-secondary\)\] {
1090
- border-color: var(--border-secondary);
1091
- }
1092
- .border-\[var\(--border-subtle\)\] {
1093
- border-color: var(--border-subtle);
1094
- }
1095
- .border-\[var\(--border-yellow\)\] {
1096
- border-color: var(--border-yellow);
1097
- }
1098
- .border-\[var\(--border-yellow-subtle\)\] {
1099
- border-color: var(--border-yellow-subtle);
1100
- }
1101
- .bg-\[var\(--background-base\)\] {
1102
- background-color: var(--background-base);
1103
- }
1104
- .bg-\[var\(--background-green\)\] {
1105
- background-color: var(--background-green);
1106
- }
1107
- .bg-\[var\(--background-info\)\] {
1108
- background-color: var(--background-info);
1109
- }
1110
- .bg-\[var\(--background-invert\)\] {
1111
- background-color: var(--background-invert);
1112
- }
1113
- .bg-\[var\(--background-low\)\] {
1114
- background-color: var(--background-low);
1115
- }
1116
- .bg-\[var\(--background-primary\)\] {
1117
- background-color: var(--background-primary);
1118
- }
1119
- .bg-\[var\(--background-red\)\] {
1120
- background-color: var(--background-red);
1121
- }
1122
- .bg-\[var\(--background-secondary\)\] {
1123
- background-color: var(--background-secondary);
1124
- }
1125
- .bg-\[var\(--background-yellow\)\] {
1126
- background-color: var(--background-yellow);
1127
- }
1128
- .bg-\[var\(--content-primary\)\] {
1129
- background-color: var(--content-primary);
1130
- }
1131
- .bg-blue-400 {
1132
- --tw-bg-opacity: 1;
1133
- background-color: rgb(96 165 250 / var(--tw-bg-opacity, 1));
1134
- }
1135
- .bg-yellow-400 {
1136
- --tw-bg-opacity: 1;
1137
- background-color: rgb(250 204 21 / var(--tw-bg-opacity, 1));
1138
- }
1139
- .p-12 {
1140
- padding: 3rem;
1141
- }
1142
- .p-2 {
1143
- padding: 0.5rem;
1144
- }
1145
- .p-4 {
1146
- padding: 1rem;
1147
- }
1148
- .p-5 {
1149
- padding: 1.25rem;
1150
- }
1151
- .p-6 {
1152
- padding: 1.5rem;
1153
- }
1154
- .p-8 {
1155
- padding: 2rem;
1156
- }
1157
- .px-1 {
1158
- padding-left: 0.25rem;
1159
- padding-right: 0.25rem;
1160
- }
1161
- .px-3 {
1162
- padding-left: 0.75rem;
1163
- padding-right: 0.75rem;
1164
- }
1165
- .px-4 {
1166
- padding-left: 1rem;
1167
- padding-right: 1rem;
1168
- }
1169
- .px-6 {
1170
- padding-left: 1.5rem;
1171
- padding-right: 1.5rem;
1172
- }
1173
- .pt-2 {
1174
- padding-top: 0.5rem;
1175
- }
1176
- .text-center {
1177
- text-align: center;
1178
- }
1179
- .font-mono {
1180
- font-family:
1181
- ui-monospace,
1182
- SFMono-Regular,
1183
- Menlo,
1184
- Monaco,
1185
- Consolas,
1186
- "Liberation Mono",
1187
- "Courier New",
1188
- monospace;
1189
- }
1190
- .text-2xl {
1191
- font-size: 1.5rem;
1192
- line-height: 2rem;
1193
- }
1194
- .text-3xl {
1195
- font-size: 1.875rem;
1196
- line-height: 2.25rem;
1197
- }
1198
- .text-4xl {
1199
- font-size: 2.25rem;
1200
- line-height: 2.5rem;
1201
- }
1202
- .text-\[10px\] {
1203
- font-size: 10px;
1204
- }
1205
- .text-\[8px\] {
1206
- font-size: 8px;
1207
- }
1208
- .text-base {
1209
- font-size: 1rem;
1210
- line-height: 1.5rem;
1211
- }
1212
- .text-lg {
1213
- font-size: 1.125rem;
1214
- line-height: 1.75rem;
1215
- }
1216
- .text-sm {
1217
- font-size: 0.875rem;
1218
- line-height: 1.25rem;
1219
- }
1220
- .text-xl {
1221
- font-size: 1.25rem;
1222
- line-height: 1.75rem;
1223
- }
1224
- .text-xs {
1225
- font-size: 0.75rem;
1226
- line-height: 1rem;
1227
- }
1228
- .font-bold {
1229
- font-weight: 700;
1230
- }
1231
- .font-medium {
1232
- font-weight: 500;
1233
- }
1234
- .font-semibold {
1235
- font-weight: 600;
1236
- }
1237
- .capitalize {
1238
- text-transform: capitalize;
1239
- }
1240
- .leading-relaxed {
1241
- line-height: 1.625;
1242
- }
1243
- .leading-tight {
1244
- line-height: 1.25;
1245
- }
1246
- .text-\[var\(--content-blue\)\] {
1247
- color: var(--content-blue);
1248
- }
1249
- .text-\[var\(--content-green\)\] {
1250
- color: var(--content-green);
1251
- }
1252
- .text-\[var\(--content-on-color\)\] {
1253
- color: var(--content-on-color);
1254
- }
1255
- .text-\[var\(--content-primary\)\] {
1256
- color: var(--content-primary);
1257
- }
1258
- .text-\[var\(--content-red\)\] {
1259
- color: var(--content-red);
1260
- }
1261
- .text-\[var\(--content-secondary\)\] {
1262
- color: var(--content-secondary);
1263
- }
1264
- .text-\[var\(--content-subtle\)\] {
1265
- color: var(--content-subtle);
1266
- }
1267
- .text-\[var\(--content-yellow\)\] {
1268
- color: var(--content-yellow);
1269
- }
1270
- .text-gray-500 {
1271
- --tw-text-opacity: 1;
1272
- color: rgb(107 114 128 / var(--tw-text-opacity, 1));
1273
- }
1274
- .shadow-sm {
1275
- --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
1276
- --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
1277
- box-shadow:
1278
- var(--tw-ring-offset-shadow, 0 0 #0000),
1279
- var(--tw-ring-shadow, 0 0 #0000),
1280
- var(--tw-shadow);
1281
- }
1282
- .outline {
1283
- outline-style: solid;
1284
- }
1285
- .invert {
1286
- --tw-invert: invert(100%);
1287
- 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);
1288
- }
1289
- .filter {
1290
- 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);
1291
- }
1292
- .transition {
1293
- transition-property:
1294
- color,
1295
- background-color,
1296
- border-color,
1297
- text-decoration-color,
1298
- fill,
1299
- stroke,
1300
- opacity,
1301
- box-shadow,
1302
- transform,
1303
- filter,
1304
- backdrop-filter;
1305
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1306
- transition-duration: 150ms;
1307
- }
1308
- .transition-all {
1309
- transition-property: all;
1310
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1311
- transition-duration: 150ms;
1312
- }
1313
- .transition-colors {
1314
- transition-property:
1315
- color,
1316
- background-color,
1317
- border-color,
1318
- text-decoration-color,
1319
- fill,
1320
- stroke;
1321
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1322
- transition-duration: 150ms;
1323
- }
1324
- .transition-shadow {
1325
- transition-property: box-shadow;
1326
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1327
- transition-duration: 150ms;
1328
- }
1329
- .transition-transform {
1330
- transition-property: transform;
1331
- transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
1332
- transition-duration: 150ms;
1333
- }
1334
- .sr-only {
1335
- position: absolute;
1336
- width: 1px;
1337
- height: 1px;
1338
- padding: 0;
1339
- margin: -1px;
1340
- overflow: hidden;
1341
- clip: rect(0, 0, 0, 0);
1342
- white-space: nowrap;
1343
- border-width: 0;
453
+ .backdrop-blur {
454
+ backdrop-filter: blur(8px);
1344
455
  }
1345
456
  .transition-all {
1346
457
  transition: all 0.15s ease-in-out;
@@ -1351,149 +462,17 @@ button {
1351
462
  background-color 0.15s ease-in-out,
1352
463
  border-color 0.15s ease-in-out;
1353
464
  }
1354
- .hover\:border-\[var\(--border-green-on-hover\)\]:hover {
1355
- border-color: var(--border-green-on-hover);
1356
- }
1357
- .hover\:border-\[var\(--border-primary\)\]:hover {
1358
- border-color: var(--border-primary);
1359
- }
1360
- .hover\:border-\[var\(--border-red-on-hover\)\]:hover {
1361
- border-color: var(--border-red-on-hover);
1362
- }
1363
- .hover\:border-\[var\(--border-secondary\)\]:hover {
1364
- border-color: var(--border-secondary);
1365
- }
1366
- .hover\:border-\[var\(--border-yellow-on-hover\)\]:hover {
1367
- border-color: var(--border-yellow-on-hover);
1368
- }
1369
- .hover\:bg-\[var\(--background-green\)\]:hover {
1370
- background-color: var(--background-green);
1371
- }
1372
- .hover\:bg-\[var\(--background-green-on-hover\)\]:hover {
1373
- background-color: var(--background-green-on-hover);
1374
- }
1375
- .hover\:bg-\[var\(--background-invert-light\)\]:hover {
1376
- background-color: var(--background-invert-light);
1377
- }
1378
- .hover\:bg-\[var\(--background-low\)\]:hover {
1379
- background-color: var(--background-low);
1380
- }
1381
- .hover\:bg-\[var\(--background-low-on-hover\)\]:hover {
1382
- background-color: var(--background-low-on-hover);
1383
- }
1384
- .hover\:bg-\[var\(--background-red\)\]:hover {
1385
- background-color: var(--background-red);
1386
- }
1387
- .hover\:bg-\[var\(--background-red-on-hover\)\]:hover {
1388
- background-color: var(--background-red-on-hover);
1389
- }
1390
- .hover\:bg-\[var\(--background-yellow\)\]:hover {
1391
- background-color: var(--background-yellow);
1392
- }
1393
- .hover\:bg-\[var\(--background-yellow-on-hover\)\]:hover {
1394
- background-color: var(--background-yellow-on-hover);
1395
- }
1396
- .hover\:text-\[var\(--content-green-on-hover\)\]:hover {
1397
- color: var(--content-green-on-hover);
1398
- }
1399
- .hover\:text-\[var\(--content-primary\)\]:hover {
1400
- color: var(--content-primary);
1401
- }
1402
- .hover\:text-\[var\(--content-red-on-hover\)\]:hover {
1403
- color: var(--content-red-on-hover);
1404
- }
1405
- .hover\:text-\[var\(--content-yellow-on-hover\)\]:hover {
1406
- color: var(--content-yellow-on-hover);
1407
- }
1408
- .hover\:shadow-lg:hover {
1409
- --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
1410
- --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
1411
- box-shadow:
1412
- var(--tw-ring-offset-shadow, 0 0 #0000),
1413
- var(--tw-ring-shadow, 0 0 #0000),
1414
- var(--tw-shadow);
1415
- }
1416
- .hover\:shadow-md:hover {
1417
- --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1418
- --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1419
- box-shadow:
1420
- var(--tw-ring-offset-shadow, 0 0 #0000),
1421
- var(--tw-ring-shadow, 0 0 #0000),
1422
- var(--tw-shadow);
1423
- }
1424
- .focus-visible\:outline-none:focus-visible {
1425
- outline: 2px solid transparent;
1426
- outline-offset: 2px;
1427
- }
1428
- .focus-visible\:ring-2:focus-visible {
1429
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
1430
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
1431
- box-shadow:
1432
- var(--tw-ring-offset-shadow),
1433
- var(--tw-ring-shadow),
1434
- var(--tw-shadow, 0 0 #0000);
1435
- }
1436
- .focus-visible\:ring-\[var\(--border-blue\)\]:focus-visible {
1437
- --tw-ring-color: var(--border-blue);
1438
- }
1439
- .focus-visible\:ring-offset-2:focus-visible {
1440
- --tw-ring-offset-width: 2px;
1441
- }
1442
- .active\:bg-\[var\(--background-green\)\]:active {
1443
- background-color: var(--background-green);
1444
- }
1445
- .active\:bg-\[var\(--background-invert\)\]:active {
1446
- background-color: var(--background-invert);
1447
- }
1448
- .active\:bg-\[var\(--background-red\)\]:active {
1449
- background-color: var(--background-red);
1450
- }
1451
- .active\:bg-\[var\(--background-secondary\)\]:active {
1452
- background-color: var(--background-secondary);
1453
- }
1454
- .active\:bg-\[var\(--background-tertiary\)\]:active {
1455
- background-color: var(--background-tertiary);
1456
- }
1457
- .active\:bg-\[var\(--background-yellow\)\]:active {
1458
- background-color: var(--background-yellow);
1459
- }
1460
- .disabled\:pointer-events-none:disabled {
1461
- pointer-events: none;
1462
- }
1463
- .disabled\:border-\[var\(--border-subtle\)\]:disabled {
1464
- border-color: var(--border-subtle);
1465
- }
1466
- .disabled\:bg-\[var\(--background-red\)\]:disabled {
1467
- background-color: var(--background-red);
1468
- }
1469
- .disabled\:bg-\[var\(--background-secondary\)\]:disabled {
1470
- background-color: var(--background-secondary);
1471
- }
1472
- .disabled\:bg-\[var\(--background-tertiary\)\]:disabled {
1473
- background-color: var(--background-tertiary);
1474
- }
1475
- .disabled\:text-\[var\(--content-subtle\)\]:disabled {
1476
- color: var(--content-subtle);
1477
- }
1478
- .disabled\:opacity-50:disabled {
465
+ .opacity-50 {
1479
466
  opacity: 0.5;
1480
467
  }
1481
- .group:hover .group-hover\:scale-105 {
1482
- --tw-scale-x: 1.05;
1483
- --tw-scale-y: 1.05;
1484
- transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
468
+ .opacity-60 {
469
+ opacity: 0.6;
1485
470
  }
1486
- @media (min-width: 768px) {
1487
- .md\:grid-cols-2 {
1488
- grid-template-columns: repeat(2, minmax(0, 1fr));
1489
- }
471
+ .opacity-80 {
472
+ opacity: 0.8;
1490
473
  }
1491
- @media (min-width: 1024px) {
1492
- .lg\:grid-cols-2 {
1493
- grid-template-columns: repeat(2, minmax(0, 1fr));
1494
- }
1495
- .lg\:grid-cols-3 {
1496
- grid-template-columns: repeat(3, minmax(0, 1fr));
1497
- }
474
+ button {
475
+ font-family: inherit;
476
+ font-size: inherit;
1498
477
  }
1499
478
  /*# sourceMappingURL=index.css.map */