daisyui 1.25.3 → 2.0.0-next.2

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/unstyled.css CHANGED
@@ -1,256 +1,114 @@
1
- .alert>:not([hidden])~:not([hidden]){
2
- --tw-space-y-reverse:0;
3
- margin-top:calc(0.5rem*(1 - var(--tw-space-y-reverse)));
4
- margin-bottom:calc(0.5rem*var(--tw-space-y-reverse));
5
- }
6
-
7
- .alert{
8
- display:flex;
9
- flex-direction:column;
10
- align-items:center;
11
- justify-content:space-between;
12
- }
13
-
14
- @media (min-width:768px){
15
- .alert>:not([hidden])~:not([hidden]){
16
- --tw-space-y-reverse:0;
17
- margin-top:calc(0px*(1 - var(--tw-space-y-reverse)));
18
- margin-bottom:calc(0px*var(--tw-space-y-reverse));
19
- }
20
-
21
- .alert{
22
- flex-direction:row;
23
- }
24
- }
25
-
26
- .alert>*{
27
- display:flex;
28
- }
29
- .artboard{
30
- width:100%;
31
- }.avatar{
32
- display:inline-flex;
33
- position:relative;
34
- }
35
- .avatar>div{
36
- display:block;
37
- overflow:hidden;
38
- }
39
- .avatar img{
40
- height:100%;
41
- -o-object-fit:cover;
42
- object-fit:cover;
43
- width:100%;
44
- }
45
- .avatar.placeholder>div{
46
- display:flex;
47
- align-items:center;
48
- justify-content:center
49
- }
50
- .badge{
51
- display:inline-flex;
52
- align-items:center;
53
- justify-content:center;
54
- transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
55
- transition-duration:.15s;
56
- transition-timing-function:cubic-bezier(.4, 0, .2, 1);
57
- transition-duration:.2s;
58
- height:1.25rem;
59
- font-size:.875rem;
60
- line-height:1.25rem;
61
- width:-webkit-fit-content;
62
- width:-moz-fit-content;
1
+ .alert{display:flex;width:100%;flex-direction:column;align-items:center;justify-content:space-between;gap:1rem}.alert>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem*var(--tw-space-y-reverse))}@media (min-width:768px){.alert{flex-direction:row}.alert>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px*var(--tw-space-y-reverse))}}.alert>:where(*){display:flex}.alert>:where(*){align-items:center}.alert>:where(*){gap:.5rem}
2
+ .artboard{width:100%}.avatar{position:relative;display:inline-flex;}
3
+ .avatar>div{display:block;}
4
+ .avatar>div{aspect-ratio:1 / 1;}
5
+ .avatar>div{overflow:hidden;}
6
+ .avatar img{height:100%;}
7
+ .avatar img{width:100%;}
8
+ .avatar img{object-fit:cover;}
9
+ .avatar.placeholder>div{display:flex;}
10
+ .avatar.placeholder>div{align-items:center;}
11
+ .avatar.placeholder>div{justify-content:center;}
12
+ .badge{display:inline-flex;align-items:center;justify-content:center;transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-duration:.2s;transition-timing-function:cubic-bezier(.4, 0, .2, 1);height:1.25rem;font-size:.875rem;line-height:1.25rem;
63
13
  width:fit-content;
64
14
  padding-left:.563rem;
65
- padding-right:.563rem;
66
- }
67
- .breadcrumbs{
68
- max-width:100%;
69
- overflow-x:auto;
70
- }
15
+ padding-right:.563rem}
16
+ .breadcrumbs{max-width:100%;overflow-x:auto;}
17
+ .breadcrumbs>ul{display:flex;}
18
+ .breadcrumbs>ul{align-items:center;}
19
+ .breadcrumbs>ul{white-space:nowrap;}
71
20
  .breadcrumbs>ul{
72
- display:flex;
73
- align-items:center;
74
- white-space:nowrap;
75
- min-height:-webkit-min-content;
76
- min-height:-moz-min-content;
77
21
  min-height:min-content;
78
22
  }
79
- .breadcrumbs>ul>li{
80
- display:flex;
81
- align-items:center;
82
- }
83
- .breadcrumbs>ul>li>a{
84
- cursor:pointer;
85
- display:flex;
86
- align-items:center;
87
- }
23
+ .breadcrumbs>ul>li{display:flex;}
24
+ .breadcrumbs>ul>li{align-items:center;}
25
+ .breadcrumbs>ul>li>a{display:flex;}
26
+ .breadcrumbs>ul>li>a{cursor:pointer;}
27
+ .breadcrumbs>ul>li>a{align-items:center;}
88
28
  .breadcrumbs>ul>li>a:hover{
89
- text-decoration:underline;
90
- }.btn{
91
- border-color:transparent;
92
- cursor:pointer;
93
- display:inline-flex;
94
- flex-wrap:wrap;
95
- align-items:center;
96
- justify-content:center;
97
- flex-shrink:0;
98
- text-align:center;
29
+ -webkit-text-decoration-line:underline;
30
+ text-decoration-line:underline;}.btn{display:inline-flex;flex-shrink:0;cursor:pointer;
99
31
  -webkit-user-select:none;
100
- -moz-user-select:none;
101
- -ms-user-select:none;
102
- user-select:none;
103
- transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
104
- transition-duration:.15s;
105
- transition-timing-function:cubic-bezier(.4, 0, .2, 1);
106
- transition-duration:.2s;
107
- border-radius:var(--rounded-btn, .5rem);
108
- height:3rem;
109
- font-size:.875rem;
110
- line-height:1.25rem;
111
- padding-left:1rem;
112
- padding-right:1rem;
113
- min-height:3rem;
114
- line-height:1em;
115
- }
116
- .btn:focus{
117
- outline:2px solid transparent;
118
- outline-offset:2px;
119
- }
120
- .btn-disabled,.btn[disabled]{
121
- pointer-events:none;
122
- }
123
- .btn-square{
124
- height:3rem;
125
- padding:0;
126
- width:3rem;
127
- }
128
- .btn-circle{
129
- border-radius:9999px;
130
- height:3rem;
131
- padding:0;
132
- width:3rem;
133
- }
134
- .btn.loading,.btn.loading:hover{
135
- pointer-events:none;
136
- }
32
+ user-select:none;flex-wrap:wrap;align-items:center;justify-content:center;border-color:transparent;text-align:center;transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-duration:.2s;transition-timing-function:cubic-bezier(.4, 0, .2, 1);border-radius:var(--rounded-btn, .5rem);height:3rem;padding-left:1rem;padding-right:1rem;font-size:.875rem;line-height:1.25rem;min-height:3rem;
33
+ line-height:1em;}
34
+ .btn:focus{outline:2px solid transparent;outline-offset:2px;}
35
+ .btn-disabled,.btn[disabled]{pointer-events:none;}
36
+ .btn-square{height:3rem;}
37
+ .btn-square{width:3rem;}
38
+ .btn-square{padding:0;}
39
+ .btn-circle{height:3rem;}
40
+ .btn-circle{width:3rem;}
41
+ .btn-circle{border-radius:9999px;}
42
+ .btn-circle{padding:0;}
43
+ .btn.loading,.btn.loading:hover{pointer-events:none;}
44
+ .btn.loading:before{margin-right:.5rem;}
45
+ .btn.loading:before{height:1rem;}
46
+ .btn.loading:before{width:1rem;}
47
+ .btn.loading:before{border-radius:9999px;}
48
+ .btn.loading:before{border-width:2px;}
137
49
  .btn.loading:before{
138
- border-radius:9999px;
139
- border-width:2px;
140
- height:1rem;
141
- margin-right:.5rem;
142
- width:1rem;
143
- -webkit-animation:spin 2s linear infinite;
144
- animation:spin 2s linear infinite;
50
+ animation:spin 2s linear infinite;
145
51
  content:"";
146
- border-color:transparent currentColor currentColor transparent;
52
+ border-top-color:transparent;
53
+ border-left-color:transparent;
54
+ border-bottom-color:initial;
55
+ border-right-color:initial;
147
56
  }
148
-
149
57
  @media (prefers-reduced-motion:reduce){
150
58
  .btn.loading:before{
151
- -webkit-animation:spin 10s linear infinite;
152
- animation:spin 10s linear infinite;
59
+ animation:spin 10s linear infinite;
153
60
  }
154
61
  }
155
-
156
- @-webkit-keyframes spin{
157
- 0%{
158
- transform:rotate(0deg);
159
- }
160
-
161
- to{
162
- transform:rotate(1turn);
163
- }
164
- }
165
-
166
62
  @keyframes spin{
167
63
  0%{
168
64
  transform:rotate(0deg);
169
65
  }
170
-
171
66
  to{
172
67
  transform:rotate(1turn);
173
68
  }
174
69
  }
175
-
176
- .btn-group{
177
- display:flex;
178
- flex-wrap:wrap;
179
- }
180
-
70
+ .btn-group{display:flex;flex-wrap:wrap;}
181
71
  .btn-group>input[type=radio].btn{
182
- -webkit-appearance:none;
183
- -moz-appearance:none;
184
- appearance:none;
185
- }
186
-
72
+ -webkit-appearance:none;
73
+ appearance:none;}
187
74
  .btn-group>input[type=radio].btn:before{
188
75
  content:attr(data-title);
189
76
  }
190
- .card{
191
- display:flex;
192
- flex-direction:column;
193
- overflow:hidden;
194
- position:relative;
195
- }
196
- .card:focus{
197
- outline:2px solid transparent;
198
- outline-offset:2px;
199
- }
200
- .card-body{
201
- display:flex;
202
- flex-direction:column;
203
- flex:1 1 auto;
204
- }
205
- .card figure,.card figure>*{
206
- width:100%;
207
- }
208
- .card-actions{
209
- display:flex;
210
- flex-wrap:wrap;
211
- align-items:flex-start;
212
- margin-left:-.25rem;
213
- margin-right:-.25rem;
214
- }
215
- .card-actions>*{
216
- margin:.25rem
217
- }
218
- .card.image-full{
219
- display:grid;
220
- }
77
+ .card{position:relative;display:flex;flex-direction:column;overflow:hidden;}
78
+ .card:focus{outline:2px solid transparent;outline-offset:2px;}
79
+ .card-body{display:flex;}
80
+ .card-body{flex:1 1 auto;}
81
+ .card-body{flex-direction:column;}
82
+ .card-body :where(p){flex-grow:1;}
83
+ .card-actions{display:flex;}
84
+ .card-actions{flex-wrap:wrap;}
85
+ .card-actions{align-items:flex-start;}
86
+ .card-actions{gap:.5rem;}
87
+ .card figure{display:flex;}
88
+ .card figure{align-items:center;}
89
+ .card figure{justify-content:center;}
90
+ .card.image-full{display:grid;}
91
+ .card.image-full:before{position:relative;}
221
92
  .card.image-full:before{
222
- position:relative;
223
93
  content:"";
224
94
  }
225
- .card.image-full:before,.card.image-full>*{
226
- grid-column-start:1;
227
- grid-row-start:1;
228
- }
229
- .card.image-full>figure img{
230
- height:100%;
231
- -o-object-fit:cover;
232
- object-fit:cover;
233
- }
234
- .card.image-full>.card-body{
235
- position:relative;
236
- }
237
- .carousel{
238
- display:flex;
239
- overflow-x:scroll;
240
- -ms-scroll-snap-type:x mandatory;
241
- scroll-snap-type:x mandatory;
242
- scroll-behavior:smooth;
243
- }
95
+ .card.image-full:before,.card.image-full>*{grid-column-start:1;}
96
+ .card.image-full:before,.card.image-full>*{grid-row-start:1;}
97
+ .card.image-full>figure img{height:100%;}
98
+ .card.image-full>figure img{object-fit:cover;}
99
+ .card.image-full>.card-body{position:relative;}
100
+ .carousel{display:flex;overflow-x:scroll;
101
+ scroll-snap-type:x mandatory;
102
+ scroll-behavior:smooth;}
103
+ .carousel-vertical{flex-direction:column;}
104
+ .carousel-vertical{overflow-y:scroll;}
244
105
  .carousel-vertical{
245
- flex-direction:column;
246
- overflow-y:scroll;
247
- -ms-scroll-snap-type:y mandatory;
248
- scroll-snap-type:y mandatory;
106
+ scroll-snap-type:y mandatory;
249
107
  }
108
+ .carousel-item{box-sizing:initial;}
109
+ .carousel-item{display:flex;}
110
+ .carousel-item{flex:none;}
250
111
  .carousel-item{
251
- box-sizing:content-box;
252
- display:flex;
253
- flex:none;
254
112
  scroll-snap-align:start;
255
113
  }
256
114
  .carousel-center .carousel-item{
@@ -258,49 +116,30 @@
258
116
  }
259
117
  .carousel-end .carousel-item{
260
118
  scroll-snap-align:end;
261
- }.checkbox:focus{
262
- outline:2px solid transparent;
263
- outline-offset:2px;
264
- }.collapse{
265
- display:grid;
266
- overflow:hidden;
267
- position:relative;
268
- }
269
-
270
- .collapse-content,.collapse-title,.collapse>input[type=checkbox]{
271
- grid-column-start:1;
272
- grid-row-start:1;
119
+ }.checkbox{
120
+ flex-shrink:0;
273
121
  }
274
-
122
+ .checkbox:focus{outline:2px solid transparent;outline-offset:2px;}
123
+ .collapse{position:relative;display:grid;overflow:hidden;}
124
+ .collapse-content,.collapse-title,.collapse>input[type=checkbox]{grid-column-start:1;grid-row-start:1;}
275
125
  .collapse>input[type=checkbox]{
276
126
  -webkit-appearance:none;
277
- -moz-appearance:none;
278
- appearance:none;
279
- opacity:0;
280
- }
281
-
282
- .collapse-content{
283
- overflow:hidden;
284
- grid-row-start:2;
285
- max-height:0;
286
- }
287
-
127
+ appearance:none;opacity:0;}
128
+ .collapse-content{grid-row-start:2;overflow:hidden;
129
+ max-height:0;}
288
130
  .collapse-open .collapse-content,.collapse:focus:not(.collapse-close) .collapse-content,.collapse:not(.collapse-close) input[type=checkbox]:checked~.collapse-content{
289
131
  max-height:9000px;
290
132
  }:root .countdown{
291
133
  line-height:1em;
292
134
  }
293
-
294
135
  .countdown{
295
136
  display:inline-flex;
296
137
  }
297
-
298
138
  .countdown>*{
299
- height:1em;
300
- display:inline-block;
301
- overflow-y:hidden;
139
+ height:1em
302
140
  }
303
-
141
+ .countdown>*{display:inline-block;}
142
+ .countdown>*{overflow-y:hidden;}
304
143
  .countdown>:before{
305
144
  position:relative;
306
145
  content:"00\A 01\A 02\A 03\A 04\A 05\A 06\A 07\A 08\A 09\A 10\A 11\A 12\A 13\A 14\A 15\A 16\A 17\A 18\A 19\A 20\A 21\A 22\A 23\A 24\A 25\A 26\A 27\A 28\A 29\A 30\A 31\A 32\A 33\A 34\A 35\A 36\A 37\A 38\A 39\A 40\A 41\A 42\A 43\A 44\A 45\A 46\A 47\A 48\A 49\A 50\A 51\A 52\A 53\A 54\A 55\A 56\A 57\A 58\A 59\A 60\A 61\A 62\A 63\A 64\A 65\A 66\A 67\A 68\A 69\A 70\A 71\A 72\A 73\A 74\A 75\A 76\A 77\A 78\A 79\A 80\A 81\A 82\A 83\A 84\A 85\A 86\A 87\A 88\A 89\A 90\A 91\A 92\A 93\A 94\A 95\A 96\A 97\A 98\A 99\A";
@@ -308,622 +147,278 @@
308
147
  top:calc(var(--value)*-1em);
309
148
  }
310
149
 
311
- .divider{
312
- display:flex;
313
- align-items:center;
314
- }
150
+ .divider{display:flex;flex-direction:row;align-items:center;align-self:stretch;}
315
151
  .divider:after,.divider:before{
316
152
  content:"";
317
- flex-grow:1;
318
- }.drawer{
319
- display:grid;
320
- overflow:hidden;
321
- }
153
+ }
154
+ .divider:after,.divider:before{flex-grow:1;}
155
+ .divider:after,.divider:before{height:.125rem;}
156
+ .divider:after,.divider:before{width:100%;}
157
+ .drawer{display:grid;overflow:hidden;}
322
158
  .drawer.drawer-end{
323
159
  direction:rtl;
324
160
  }
325
161
  .drawer.drawer-end>*{
326
162
  direction:ltr;
327
163
  }
328
- .drawer.drawer-end .drawer-toggle~.drawer-side>.drawer-overlay+*{
329
- justify-self:end;
330
- --tw-translate-x:100%;
331
- }
332
- .drawer.drawer-end .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{
333
- --tw-translate-x:0px;
334
- }
335
-
336
- .drawer-toggle{
337
- -webkit-appearance:none;
338
- -moz-appearance:none;
339
- appearance:none;
340
- height:0;
341
- opacity:0;
342
- position:absolute;
343
- width:0;
344
- }
345
-
164
+ .drawer.drawer-end .drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:100%;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));}
165
+ .drawer.drawer-end .drawer-toggle~.drawer-side>.drawer-overlay+*{justify-self:end;}
166
+ .drawer.drawer-end .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{--tw-translate-x:0px;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));}
167
+ .drawer-toggle{position:absolute;height:0;width:0;
168
+ -webkit-appearance:none;
169
+ appearance:none;opacity:0;}
170
+ .drawer-toggle~.drawer-content{z-index:0;}
171
+ .drawer-toggle~.drawer-content{grid-column-start:1;}
172
+ .drawer-toggle~.drawer-content{grid-row-start:1;}
173
+ .drawer-toggle~.drawer-content{max-height:100vh;}
174
+ .drawer-toggle~.drawer-content{overflow-y:auto;}
346
175
  .drawer-toggle~.drawer-content{
347
- max-height:100vh;
348
- overflow-y:auto;
349
- z-index:0;
350
- grid-column-start:1;
351
- grid-row-start:1;
352
- -ms-scroll-chaining:none;
353
- overscroll-behavior:contain;
354
- }
355
-
356
- .drawer-toggle~.drawer-side{
357
- display:grid;
358
- max-height:100vh;
359
- grid-column-start:1;
360
- grid-row-start:1;
361
- }
362
-
363
- .drawer-toggle~.drawer-side>.drawer-overlay{
364
- opacity:0;
365
- visibility:hidden;
366
- grid-column-start:1;
367
- grid-row-start:1;
368
- }
369
-
370
- .drawer-toggle~.drawer-side>.drawer-overlay+*{
371
- z-index:10;
372
- grid-column-start:1;
373
- grid-row-start:1;
374
- --tw-translate-x:0;
375
- --tw-translate-y:0;
376
- --tw-rotate:0;
377
- --tw-skew-x:0;
378
- --tw-skew-y:0;
379
- --tw-scale-x:1;
380
- --tw-scale-y:1;
381
- transform:translateX(var(--tw-translate-x)) translateY(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));
382
- --tw-translate-x:-100%;
383
- }
384
-
385
- .drawer-toggle:checked~.drawer-side{
386
- overflow-y:auto;
387
- }
388
-
389
- .drawer-toggle:checked~.drawer-side>.drawer-overlay{
390
- visibility:visible;
391
- }
392
-
393
- .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{
394
- --tw-translate-x:0px;
395
- }
396
-
397
- [dir=rtl] .drawer-toggle~.drawer-side>.drawer-overlay+*{
398
- --tw-translate-x:100%;
399
- }
400
-
401
- [dir=rtl] .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{
402
- --tw-translate-x:0px;
403
- }
404
-
176
+ overscroll-behavior:contain;
177
+ }
178
+ .drawer-toggle~.drawer-side{grid-column-start:1;}
179
+ .drawer-toggle~.drawer-side{grid-row-start:1;}
180
+ .drawer-toggle~.drawer-side{display:grid;}
181
+ .drawer-toggle~.drawer-side{max-height:100vh;}
182
+ .drawer-toggle~.drawer-side>.drawer-overlay{visibility:hidden;}
183
+ .drawer-toggle~.drawer-side>.drawer-overlay{grid-column-start:1;}
184
+ .drawer-toggle~.drawer-side>.drawer-overlay{grid-row-start:1;}
185
+ .drawer-toggle~.drawer-side>.drawer-overlay{opacity:0;}
186
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{z-index:10;}
187
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{grid-column-start:1;}
188
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{grid-row-start:1;}
189
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:-100%;}
190
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{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));}
191
+ .drawer-toggle:checked~.drawer-side{overflow-y:auto;}
192
+ .drawer-toggle:checked~.drawer-side>.drawer-overlay{visibility:visible;}
193
+ .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{--tw-translate-x:0px;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));}
194
+ [dir=rtl] .drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:100%;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));}
195
+ [dir=rtl] .drawer-toggle:checked~.drawer-side>.drawer-overlay+*{--tw-translate-x:0px;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));}
405
196
  @media (min-width:1024px){
406
197
  .drawer-mobile{
407
- grid-auto-columns:-webkit-max-content auto;
408
198
  grid-auto-columns:max-content auto;
409
199
  }
410
- .drawer-mobile>.drawer-toggle~.drawer-content{
411
- height:auto;
412
- }
413
- @media (min-width:1024px){
414
- .drawer-mobile>.drawer-toggle~.drawer-content{
415
- grid-column-start:2;
416
- }
417
- }
418
- .drawer-mobile>.drawer-toggle~.drawer-side{
419
- overflow-y:auto;
420
- }
421
- @media (min-width:1024px){
422
- .drawer-mobile>.drawer-toggle~.drawer-side>.drawer-overlay{
423
- visibility:visible;
424
- }
425
- }
426
- @media (min-width:1024px){
427
- .drawer-mobile>.drawer-toggle~.drawer-side>.drawer-overlay+*{
428
- --tw-translate-x:0px;
429
- }
430
- }
431
-
200
+ .drawer-mobile>.drawer-toggle~.drawer-content{height:auto;}
201
+ @media (min-width:1024px){.drawer-mobile>.drawer-toggle~.drawer-content{grid-column-start:2;}}
202
+ .drawer-mobile>.drawer-toggle~.drawer-side{overflow-y:auto;}
203
+ @media (min-width:1024px){.drawer-mobile>.drawer-toggle~.drawer-side>.drawer-overlay{visibility:visible;}}
204
+ @media (min-width:1024px){.drawer-mobile>.drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:0px;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));}}
432
205
  .drawer-mobile.drawer-end{
433
- grid-auto-columns:auto -webkit-max-content;
434
206
  grid-auto-columns:auto max-content;
435
207
  direction:ltr;
436
208
  }
437
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{
438
- height:auto;
439
- }
440
- @media (min-width:1024px){
441
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{
442
- grid-column-start:1;
443
- }
444
- }
445
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{
446
- overflow-y:auto
447
- }
448
- @media (min-width:1024px){
449
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{
450
- grid-column-start:2;
451
- }
452
- }
453
- @media (min-width:1024px){
454
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side>.drawer-overlay{
455
- visibility:visible;
456
- }
457
- }
458
- @media (min-width:1024px){
459
- .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side>.drawer-overlay+*{
460
- --tw-translate-x:0px;
461
- }
462
- }
463
- }.dropdown{
464
- display:inline-block;
465
- position:relative;
466
- }
467
-
468
- .dropdown>:focus{
469
- outline:2px solid transparent;
470
- outline-offset:2px;
471
- }
472
-
473
- .dropdown .dropdown-content{
474
- opacity:0;
475
- position:absolute;
476
- visibility:hidden;
477
- z-index:50;
478
- }
479
-
480
- .dropdown-end .dropdown-content{
481
- right:0;
482
- }
483
-
484
- .dropdown-left .dropdown-content{
485
- top:0;
486
- bottom:auto;
487
- right:100%;
488
- }
489
-
490
- .dropdown-right .dropdown-content{
491
- top:0;
492
- bottom:auto;
493
- left:100%;
494
- }
495
-
496
- .dropdown-top .dropdown-content{
497
- top:auto;
498
- bottom:100%;
499
- }
500
-
501
- .dropdown-end.dropdown-right .dropdown-content{
502
- bottom:0;
503
- top:auto;
504
- }
505
-
506
- .dropdown-end.dropdown-left .dropdown-content{
507
- bottom:0;
508
- top:auto;
509
- }
510
-
511
- .dropdown.dropdown-hover:hover .dropdown-content,.dropdown.dropdown-open .dropdown-content,.dropdown:not(.dropdown-hover):focus-within .dropdown-content,.dropdown:not(.dropdown-hover):focus .dropdown-content{
512
- opacity:1;
513
- visibility:visible;
514
- }.footer{
515
- display:grid;
516
- place-items:start;
517
- width:100%;
518
- grid-auto-flow:row;
519
- }
520
- .footer>*{
521
- display:grid;
522
- place-items:start;
523
- }
524
- .footer-center{
525
- place-items:center;
526
- text-align:center;
527
- }
528
- .footer-center>*{
529
- place-items:center;
530
- }
531
-
209
+ .drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{height:auto;}
210
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{grid-column-start:1;}}
211
+ .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{overflow-y:auto;}
212
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{grid-column-start:2;}}
213
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-side>.drawer-overlay{visibility:visible;}}
214
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:0px;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));}}
215
+ }.dropdown{position:relative;display:inline-block}
216
+ .dropdown>:focus{outline:2px solid transparent;outline-offset:2px}
217
+ .dropdown .dropdown-content{visibility:hidden;position:absolute;z-index:50;opacity:0}
218
+ .dropdown-end .dropdown-content{right:0}
219
+ .dropdown-left .dropdown-content{top:0;right:100%;bottom:auto}
220
+ .dropdown-right .dropdown-content{left:100%;top:0;bottom:auto}
221
+ .dropdown-top .dropdown-content{bottom:100%;top:auto}
222
+ .dropdown-end.dropdown-right .dropdown-content{bottom:0;top:auto}
223
+ .dropdown-end.dropdown-left .dropdown-content{bottom:0;top:auto}
224
+ .dropdown.dropdown-hover:hover .dropdown-content,.dropdown.dropdown-open .dropdown-content,.dropdown:not(.dropdown-hover):focus-within .dropdown-content,.dropdown:not(.dropdown-hover):focus .dropdown-content{visibility:visible;opacity:1}.footer{display:grid;width:100%;grid-auto-flow:row;place-items:start;}
225
+ .footer>*{display:grid;}
226
+ .footer>*{place-items:start;}
227
+ .footer-center{place-items:center;}
228
+ .footer-center{text-align:center;}
229
+ .footer-center>*{place-items:center;}
532
230
  @media (min-width:48rem){
533
231
  .footer{
534
232
  grid-auto-flow:column;
535
233
  }
536
-
537
234
  .footer-center{
538
235
  grid-auto-flow:row dense;
539
236
  }
540
- }.form-control{
541
- display:flex;
542
- flex-direction:column;
543
- }
544
-
545
- .label{
546
- display:flex;
547
- align-items:center;
548
- justify-content:space-between;
549
- -webkit-user-select:none;
550
- -moz-user-select:none;
551
- -ms-user-select:none;
552
- user-select:none;
553
- }
554
- .hero{
555
- background-position:50%;
556
- background-size:cover;
557
- display:grid;
558
- place-items:center;
559
- width:100%;
560
- }
561
- .hero>*{
562
- grid-column-start:1;
563
- grid-row-start:1;
564
- }
565
- .hero-overlay{
566
- height:100%;
567
- width:100%;
568
- grid-column-start:1;
569
- grid-row-start:1;
570
- }
571
- .hero-content{
572
- display:flex;
573
- align-items:center;
574
- justify-content:center;
575
- z-index:0;
576
- }.indicator{
577
- display:inline-flex;
578
- position:relative;
579
- width:-webkit-fit-content;
580
- width:-moz-fit-content;
581
- width:fit-content;
582
- }
583
- .indicator .indicator-item{
584
- z-index:1;
585
- position:absolute;
586
- --tw-translate-x:0;
587
- --tw-translate-y:0;
588
- --tw-rotate:0;
589
- --tw-skew-x:0;
590
- --tw-skew-y:0;
591
- --tw-scale-x:1;
592
- --tw-scale-y:1;
593
- transform:translateX(var(--tw-translate-x)) translateY(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));
594
- }
237
+ }.form-control{display:flex;flex-direction:column}
238
+ .label{display:flex;
239
+ -webkit-user-select:none;
240
+ user-select:none;align-items:center;justify-content:space-between}
241
+ .hero{display:grid;width:100%;place-items:center;background-size:cover;background-position:50%;}
242
+ .hero>*{grid-column-start:1;}
243
+ .hero>*{grid-row-start:1;}
244
+ .hero-overlay{grid-column-start:1;}
245
+ .hero-overlay{grid-row-start:1;}
246
+ .hero-overlay{height:100%;}
247
+ .hero-overlay{width:100%;}
248
+ .hero-content{z-index:0;}
249
+ .hero-content{display:flex;}
250
+ .hero-content{align-items:center;}
251
+ .hero-content{justify-content:center;}.indicator{position:relative;display:inline-flex;
252
+ width:fit-content;}
595
253
  .indicator .indicator-item{
596
- top:0;
597
- right:0;
598
- bottom:auto;
599
- left:auto;
600
- --tw-translate-x:50%;
601
- --tw-translate-y:-50%;
602
- }
603
- .indicator .indicator-item.indicator-start{
604
- left:0;
605
- right:auto;
606
- --tw-translate-x:-50%;
607
- }
608
- .indicator .indicator-item.indicator-center{
609
- right:50%;
610
- left:50%;
611
- --tw-translate-x:-50%;
612
- }
613
- .indicator .indicator-item.indicator-end{
614
- right:0;
615
- left:auto;
616
- --tw-translate-x:50%;
617
- }
618
- .indicator .indicator-item.indicator-bottom{
619
- bottom:0;
620
- top:auto;
621
- --tw-translate-y:50%;
622
- }
623
- .indicator .indicator-item.indicator-middle{
624
- top:50%;
625
- bottom:50%;
626
- --tw-translate-y:-50%;
627
- }
628
- .indicator .indicator-item.indicator-top{
629
- top:0;
630
- bottom:auto;
631
- --tw-translate-y:-50%;
632
- }
633
- .input{
634
- flex-shrink:1;
635
- transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
636
- transition-duration:.15s;
637
- transition-timing-function:cubic-bezier(.4, 0, .2, 1);
638
- transition-duration:.2s;
639
- height:3rem;
640
- font-size:.875rem;
641
- line-height:1.25rem;
642
- line-height:2;
643
- padding-left:1rem;
644
- padding-right:1rem;
645
- }
646
- .input:focus{
647
- outline:2px solid transparent;
648
- outline-offset:2px;
649
- }
650
-
651
- .input-group{
652
- display:flex;
653
- align-items:stretch;
654
- width:100%;
655
- }
656
-
657
- .input-group>*,.input-group>.input{
658
- border-radius:0;
659
- }
660
-
661
- .input-group-md{
662
- font-size:.875rem;
663
- line-height:1.25rem;
664
- line-height:2;
665
- }
666
-
667
- .input-group-lg{
668
- font-size:1.125rem;
669
- line-height:1.75rem;
670
- line-height:2;
671
- }
672
-
673
- .input-group-sm{
674
- font-size:.875rem;
675
- line-height:1.25rem;
676
- line-height:2rem;
677
- }
678
-
679
- .input-group-xs{
680
- font-size:.75rem;
681
- line-height:1rem;
682
- line-height:1.625;
683
- }
684
-
685
- .input-group :where(span){
686
- --tw-bg-opacity:1;
687
- background-color:hsla(var(--b3) / var(--tw-bg-opacity, 1));
688
- display:flex;
689
- align-items:center;
690
- padding-left:1rem;
691
- padding-right:1rem;
692
- }
693
-
254
+ z-index:1
255
+ }
256
+ .indicator .indicator-item{position:absolute;}
257
+ .indicator .indicator-item{right:0;}
258
+ .indicator .indicator-item{left:auto;}
259
+ .indicator .indicator-item{top:0;}
260
+ .indicator .indicator-item{bottom:auto;}
261
+ .indicator .indicator-item{--tw-translate-x:50%;}
262
+ .indicator .indicator-item{--tw-translate-y:-50%;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));}
263
+ .indicator .indicator-item.indicator-start{right:auto;}
264
+ .indicator .indicator-item.indicator-start{left:0;}
265
+ .indicator .indicator-item.indicator-start{--tw-translate-x:-50%;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));}
266
+ .indicator .indicator-item.indicator-center{right:50%;}
267
+ .indicator .indicator-item.indicator-center{left:50%;}
268
+ .indicator .indicator-item.indicator-center{--tw-translate-x:-50%;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));}
269
+ .indicator .indicator-item.indicator-end{right:0;}
270
+ .indicator .indicator-item.indicator-end{left:auto;}
271
+ .indicator .indicator-item.indicator-end{--tw-translate-x:50%;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));}
272
+ .indicator .indicator-item.indicator-bottom{top:auto;}
273
+ .indicator .indicator-item.indicator-bottom{bottom:0;}
274
+ .indicator .indicator-item.indicator-bottom{--tw-translate-y:50%;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));}
275
+ .indicator .indicator-item.indicator-middle{top:50%;}
276
+ .indicator .indicator-item.indicator-middle{bottom:50%;}
277
+ .indicator .indicator-item.indicator-middle{--tw-translate-y:-50%;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));}
278
+ .indicator .indicator-item.indicator-top{top:0;}
279
+ .indicator .indicator-item.indicator-top{bottom:auto;}
280
+ .indicator .indicator-item.indicator-top{--tw-translate-y:-50%;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));}
281
+
282
+ .input{flex-shrink:1;transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-duration:.2s;transition-timing-function:cubic-bezier(.4, 0, .2, 1);height:3rem;padding-left:1rem;padding-right:1rem;font-size:.875rem;line-height:1.25rem;line-height:2;}
283
+ .input:focus{outline:2px solid transparent;outline-offset:2px;}
284
+ .input-group{display:flex;width:100%;align-items:stretch;}
285
+ .input-group>*,.input-group>.input{border-radius:0;}
286
+ .input-group-md{font-size:.875rem;line-height:1.25rem;}
287
+ .input-group-md{line-height:2;}
288
+ .input-group-lg{font-size:1.125rem;line-height:1.75rem;}
289
+ .input-group-lg{line-height:2;}
290
+ .input-group-sm{font-size:.875rem;line-height:1.25rem;}
291
+ .input-group-sm{line-height:2rem;}
292
+ .input-group-xs{font-size:.75rem;line-height:1rem;}
293
+ .input-group-xs{line-height:1.625;}
294
+ .input-group :where(span){display:flex;}
295
+ .input-group :where(span){align-items:center;}
296
+ .input-group :where(span){--tw-bg-opacity:1;background-color:hsl(var(--b3, var(--b2)) / var(--tw-bg-opacity));}
297
+ .input-group :where(span){padding-left:1rem;padding-right:1rem;}
694
298
  .input-group :first-child{
695
299
  border-top-left-radius:var(--rounded-btn, .5rem);
696
300
  border-top-right-radius:0;
697
301
  border-bottom-left-radius:var(--rounded-btn, .5rem);
698
302
  border-bottom-right-radius:0;
699
303
  }
700
-
701
304
  .input-group :last-child{
702
305
  border-top-left-radius:0;
703
306
  border-top-right-radius:var(--rounded-btn, .5rem);
704
307
  border-bottom-left-radius:0;
705
308
  border-bottom-right-radius:var(--rounded-btn, .5rem);
706
309
  }
707
-
708
- .input-group-vertical{
709
- flex-direction:column;
710
- }
711
-
310
+ .input-group-vertical{flex-direction:column;}
712
311
  .input-group-vertical :first-child{
713
312
  border-top-left-radius:var(--rounded-btn, .5rem);
714
313
  border-top-right-radius:var(--rounded-btn, .5rem);
715
314
  border-bottom-left-radius:0;
716
315
  border-bottom-right-radius:0;
717
316
  }
718
-
719
317
  .input-group-vertical :last-child{
720
318
  border-top-left-radius:0;
721
319
  border-top-right-radius:0;
722
320
  border-bottom-left-radius:var(--rounded-btn, .5rem);
723
321
  border-bottom-right-radius:var(--rounded-btn, .5rem);
724
322
  }
725
- .kbd{
726
- display:inline-flex;
727
- align-items:center;
728
- justify-content:center;
729
- }.link{
730
- cursor:pointer;
731
- text-decoration:underline;
732
- }
323
+ .kbd{display:inline-flex;align-items:center;justify-content:center}.link{cursor:pointer;
324
+ -webkit-text-decoration-line:underline;
325
+ text-decoration-line:underline;}
733
326
  .link-hover{
734
- text-decoration:none;
735
- }
327
+ -webkit-text-decoration-line:none;
328
+ text-decoration-line:none;}
736
329
  .link-hover:hover{
737
- text-decoration:underline;
738
- }.mask{
330
+ -webkit-text-decoration-line:underline;
331
+ text-decoration-line:underline;}.mask{
739
332
  -webkit-mask-size:contain;
740
333
  mask-size:contain;
741
334
  -webkit-mask-repeat:no-repeat;
742
335
  mask-repeat:no-repeat;
743
336
  -webkit-mask-position:center;
744
337
  mask-position:center;
745
- }.menu{
746
- display:flex;
747
- flex-direction:column;
748
- overflow:hidden;
749
338
  }
750
- .menu.horizontal{
751
- display:inline-flex;
752
- flex-direction:row;
753
- }
754
- .menu.horizontal :where(li){
755
- flex-direction:row;
756
- }
757
- .menu :where(li){
758
- display:flex;
759
- flex-direction:column;
760
- align-items:stretch;
761
- }
762
- .menu :where(li)>a,.menu :where(li)>button,.menu :where(li)>span{
763
- display:flex;
764
- align-items:center;
765
- outline:2px solid transparent;
766
- outline-offset:2px;
767
- transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
768
- transition-duration:.15s;
769
- transition-timing-function:cubic-bezier(.4, 0, .2, 1);
770
- transition-duration:.2s;
771
- }
772
- .menu :where(li)>a{
773
- cursor:pointer;
774
- -webkit-user-select:none;
775
- -moz-user-select:none;
776
- -ms-user-select:none;
777
- user-select:none;
778
- }
779
- .menu :where(li)>a:focus{
780
- outline:2px solid transparent;
781
- outline-offset:2px;
782
- }
783
- .menu :where(li).disabled>a,.menu :where(li).disabled>button,.menu :where(li).disabled>span{
784
- cursor:auto;
785
- }
786
- .mockup-code{
787
- overflow:hidden;
788
- overflow-x:auto;
789
- position:relative;
790
- }
791
- .mockup-code pre[data-prefix]:before{
339
+ .mask-half-1{
340
+ -webkit-mask-size:200%;
341
+ mask-size:200%;
342
+ -webkit-mask-position:left;
343
+ mask-position:left;
344
+ }
345
+ .mask-half-2{
346
+ -webkit-mask-size:200%;
347
+ mask-size:200%;
348
+ -webkit-mask-position:right;
349
+ mask-position:right;
350
+ }
351
+ .menu{display:flex;flex-direction:column;}
352
+ .menu.horizontal{display:inline-flex;}
353
+ .menu.horizontal{flex-direction:row;}
354
+ .menu.horizontal :where(li){flex-direction:row;}
355
+ .menu :where(li){position:relative;display:flex;flex-direction:column;flex-wrap:wrap;align-items:stretch;}
356
+ .menu :where(li:not(.disabled):not(.menu-title))>:where(:not(ul)){display:flex;cursor:pointer;
357
+ -webkit-user-select:none;
358
+ user-select:none;align-items:center;outline:2px solid transparent;outline-offset:2px;}
359
+ .menu>:where(li>:not(ul):focus){outline:2px solid transparent;outline-offset:2px;}
360
+ .menu>:where(li.disabled>:not(ul):focus){cursor:auto;}
361
+ .menu>:where(li) :where(ul){display:flex;flex-direction:column;align-items:stretch;}
362
+ .menu>:where(li)>:where(ul){position:absolute;display:none;
363
+ top:auto;
364
+ left:100%;}
365
+ .menu>:where(li:hover)>:where(ul){display:flex;}
366
+ .menu>:where(li:focus)>:where(ul){display:flex;}
367
+ .mockup-code{position:relative;}
368
+ .mockup-code{overflow:hidden;}
369
+ .mockup-code{overflow-x:auto;}
370
+ .mockup-code pre[data-prefix]:before{
792
371
  content:attr(data-prefix);
793
- display:inline-block;
794
- text-align:right;
795
372
  }
796
- .mockup-window{
797
- overflow:hidden;
798
- overflow-x:auto;
799
- position:relative;
800
- }
373
+ .mockup-code pre[data-prefix]:before{display:inline-block;}
374
+ .mockup-code pre[data-prefix]:before{text-align:right;}
375
+ .mockup-window{position:relative;}
376
+ .mockup-window{overflow:hidden;}
377
+ .mockup-window{overflow-x:auto;}
801
378
  .mockup-window pre[data-prefix]:before{
802
379
  content:attr(data-prefix);
803
- display:inline-block;
804
- text-align:right;
805
- }.modal{
806
- display:flex;
807
- align-items:flex-end;
808
- justify-content:center;
809
- opacity:0;
810
- pointer-events:none;
811
- position:fixed;
812
- top:0;
813
- right:0;
814
- bottom:0;
815
- left:0;
816
- visibility:hidden;
817
- }
818
-
819
- @media (min-width:640px){
820
- .modal{
821
- align-items:center;
822
- }
823
- }
824
-
825
- .modal{
380
+ }
381
+ .mockup-window pre[data-prefix]:before{display:inline-block;}
382
+ .mockup-window pre[data-prefix]:before{text-align:right;}.modal{pointer-events:none;visibility:hidden;position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:flex-end;justify-content:center;opacity:0;}@media (min-width:640px){.modal{align-items:center;}}.modal{
826
383
  z-index:999;
827
384
  }
828
-
829
385
  .modal-box{
830
386
  max-height:calc(100vh - 5em);
831
387
  }
832
-
833
- .modal-open,.modal-toggle:checked+.modal,.modal:target{
834
- opacity:1;
835
- pointer-events:auto;
836
- visibility:visible;
837
- }
838
-
839
- .modal-action{
840
- display:flex;
841
- }
842
-
843
- .modal-toggle{
388
+ .modal-open,.modal-toggle:checked+.modal,.modal:target{pointer-events:auto;visibility:visible;opacity:1;}
389
+ .modal-action{display:flex;}
390
+ .modal-toggle{position:fixed;height:0;width:0;
844
391
  -webkit-appearance:none;
845
- -moz-appearance:none;
846
- appearance:none;
847
- height:0;
848
- opacity:0;
849
- position:fixed;
850
- width:0;
851
- }.navbar{
852
- display:flex;
853
- align-items:center;
854
- }
855
- .navbar>*{
856
- display:flex;
857
- align-items:center;
858
- }
859
-
392
+ appearance:none;opacity:0;}
393
+ .navbar{display:flex;align-items:center;}
394
+ .navbar>*{display:flex;}
395
+ .navbar>*{align-items:center;}
860
396
  .navbar-start{
861
397
  width:50%;
862
398
  justify-content:flex-start;
863
399
  }
864
-
865
400
  .navbar-center{
866
401
  flex-shrink:0;
867
402
  }
868
-
869
403
  .navbar-end{
870
404
  width:50%;
871
405
  justify-content:flex-end;
872
- }.progress{
873
- -webkit-appearance:none;
874
- -moz-appearance:none;
875
- appearance:none;
876
- overflow:hidden;
877
- position:relative;
878
- width:100%;
879
- }.radio:focus{
880
- outline:2px solid transparent;
881
- outline-offset:2px;
882
- }.range{
883
- cursor:pointer;
884
- height:1.25rem;
885
- width:100%;
886
- }
406
+ }.progress{position:relative;width:100%;
407
+ -webkit-appearance:none;
408
+ appearance:none;overflow:hidden}.radio:focus{outline:2px solid transparent;outline-offset:2px}.range{height:1.25rem;width:100%;cursor:pointer;}
887
409
  .range:focus{
888
410
  outline:none;
889
- }.rating{
890
- display:inline-flex;
891
- position:relative;
892
- }
893
- .rating :where(input){
894
- cursor:pointer;
895
- }.select{
896
- -webkit-appearance:none;
897
- -moz-appearance:none;
898
- appearance:none;
899
- cursor:pointer;
900
- display:inline-flex;
901
- flex-shrink:0;
902
- -webkit-user-select:none;
903
- -moz-user-select:none;
904
- -ms-user-select:none;
905
- user-select:none;
906
- height:3rem;
907
- font-size:.875rem;
908
- line-height:1.25rem;
909
- line-height:2;
910
- padding-left:1rem;
911
- padding-right:1rem;
912
- min-height:3rem;
913
- }
914
- .select:focus{
915
- outline:2px solid transparent;
916
- outline-offset:2px;
917
- }
918
- .select-disabled,.select[disabled]{
919
- pointer-events:none;
920
- }.stack{
921
- display:inline-grid;
922
- }
923
- .stack>*{
924
- grid-column-start:1;
925
- grid-row-start:1;
926
- }
411
+ }.rating{position:relative;display:inline-flex;}
412
+ .rating :where(input){cursor:pointer;}.select{display:inline-flex;flex-shrink:0;cursor:pointer;
413
+ -webkit-user-select:none;
414
+ user-select:none;
415
+ -webkit-appearance:none;
416
+ appearance:none;height:3rem;padding-left:1rem;padding-right:2.5rem;font-size:.875rem;line-height:1.25rem;line-height:2;min-height:3rem;}
417
+ .select:focus{outline:2px solid transparent;outline-offset:2px;}
418
+ .select-disabled,.select[disabled]{pointer-events:none;}
419
+ .stack{display:inline-grid;}
420
+ .stack>*{grid-column-start:1;}
421
+ .stack>*{grid-row-start:1;}
927
422
  .stack>*{
928
423
  transform:translateY(1rem)scale(.9);
929
424
  z-index:1;
@@ -935,134 +430,57 @@
935
430
  .stack>:first-child{
936
431
  transform:translateY(0)scale(1);
937
432
  z-index:3;
938
- }.stats{
939
- display:inline-grid;
940
- overflow:hidden;
941
- overflow-x:auto;
942
- grid-auto-flow:column;
943
- }
944
-
945
- .stat{
946
- display:inline-grid;
947
- width:100%;
948
- grid-template-columns:1fr auto;
949
- }
950
-
951
- .stat-figure{
952
- place-self:center;
953
- justify-self:end;
954
- grid-column-start:2;
955
- grid-row:span 3 / span 3;
956
- grid-row-start:1;
957
- }
958
-
959
- .stat-title{
960
- white-space:nowrap;
961
- grid-column-start:1;
962
- }
963
-
964
- .stat-value{
965
- white-space:nowrap;
966
- grid-column-start:1;
967
- }
968
-
969
- .stat-desc{
970
- white-space:nowrap;
971
- grid-column-start:1;
972
- }
973
-
974
- .stat-actions{
975
- white-space:nowrap;
976
- grid-column-start:1;
977
- }
978
-
979
- .stats.grid-flow-row{
980
- grid-auto-rows:minmax(0, 1fr);
981
- }.steps{
433
+ }.stats{display:inline-grid;}
434
+ :where(.stats){grid-auto-flow:column;}
435
+ .stat{display:inline-grid;width:100%;
436
+ grid-template-columns:repeat(1, 1fr);}
437
+ .stat-figure{grid-column-start:2;}
438
+ .stat-figure{grid-row:span 3 / span 3;}
439
+ .stat-figure{grid-row-start:1;}
440
+ .stat-figure{place-self:center;}
441
+ .stat-figure{justify-self:end;}
442
+ .stat-title{grid-column-start:1;}
443
+ .stat-title{white-space:nowrap;}
444
+ .stat-value{grid-column-start:1;}
445
+ .stat-value{white-space:nowrap;}
446
+ .stat-desc{grid-column-start:1;}
447
+ .stat-desc{white-space:nowrap;}
448
+ .stat-actions{grid-column-start:1;}
449
+ .stat-actions{white-space:nowrap;}
450
+ .steps{display:inline-grid;grid-auto-flow:column;overflow:hidden;overflow-x:auto;
982
451
  counter-reset:step;
983
- grid-auto-columns:1fr;
984
- display:inline-grid;
985
- overflow:hidden;
986
- overflow-x:auto;
987
- grid-auto-flow:column;
988
- }
989
- .steps [class~=step]{
990
- display:grid;
991
- place-items:center;
992
- text-align:center;
993
- grid-template-columns:repeat(1, minmax(0, 1fr));
994
- grid-template-rows:repeat(2, minmax(0, 1fr));
995
- }.tabs{
996
- display:flex;
997
- flex-wrap:wrap;
998
- align-items:flex-end;
999
- }
1000
-
1001
- .tab{
1002
- cursor:pointer;
1003
- display:inline-flex;
1004
- flex-wrap:wrap;
1005
- align-items:center;
1006
- justify-content:center;
1007
- position:relative;
1008
- text-align:center;
452
+ grid-auto-columns:1fr;}
453
+ .steps .step{display:grid;}
454
+ .steps .step{grid-template-columns:repeat(1, minmax(0, 1fr));}
455
+ .steps .step{grid-template-rows:repeat(2, minmax(0, 1fr));}
456
+ .steps .step{place-items:center;}
457
+ .steps .step{text-align:center;}.tabs{display:flex;flex-wrap:wrap;align-items:flex-end}
458
+ .tab{position:relative;display:inline-flex;cursor:pointer;
1009
459
  -webkit-user-select:none;
1010
- -moz-user-select:none;
1011
- -ms-user-select:none;
1012
- user-select:none;
1013
- height:2rem;
1014
- font-size:.875rem;
1015
- line-height:1.25rem;
1016
- line-height:2;
1017
- --tab-padding:1rem;
1018
- }.table{
1019
- position:relative;
1020
- }
460
+ user-select:none;flex-wrap:wrap;align-items:center;justify-content:center;text-align:center;height:2rem;font-size:.875rem;line-height:1.25rem;line-height:2;
461
+ --tab-padding:1rem}.table{position:relative;}
462
+ .table th:first-child{position:sticky;}
463
+ .table th:first-child{left:0;}
464
+ .table th:first-child{z-index:10;}
1021
465
  .table th:first-child{
1022
- position:sticky;
1023
- left:0;
1024
- z-index:10;
1025
466
  position:-webkit-sticky;
1026
- }.textarea{
1027
- flex-shrink:1;
1028
- transition-property:background-color, border-color, color, fill, stroke, opacity, box-shadow, transform;
1029
- transition-duration:.15s;
1030
- transition-timing-function:cubic-bezier(.4, 0, .2, 1);
1031
- transition-duration:.2s;
1032
- }
1033
- .textarea{
1034
- font-size:.875rem;
1035
- line-height:1.25rem;
1036
- line-height:2;
1037
- padding:.5rem 1rem;
1038
- min-height:3rem;
1039
- }
1040
- .textarea:focus{
1041
- outline:2px solid transparent;
1042
- outline-offset:2px;
1043
467
  }
468
+ .textarea{flex-shrink:1;transition-property:color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;transition-duration:.2s;transition-timing-function:cubic-bezier(.4, 0, .2, 1);}
469
+ .textarea{padding-left:1rem;padding-right:1rem;}
470
+ .textarea{padding-top:.5rem;padding-bottom:.5rem;}
471
+ .textarea{font-size:.875rem;line-height:1.25rem;}
472
+ .textarea{line-height:2;}
473
+ .textarea{min-height:3rem;}
474
+ .textarea:focus{outline:2px solid transparent;outline-offset:2px;}
1044
475
  .toggle{
1045
476
  flex-shrink:0;
1046
477
  }
1047
- .toggle:focus{
1048
- outline:2px solid transparent;
1049
- outline-offset:2px;
1050
- }
1051
- .tooltip{
1052
- display:inline-block;
1053
- position:relative;
1054
- --tooltip-offset:calc(100% + 1px + var(--tooltip-tail, 0px));
1055
- }
1056
-
1057
- .tooltip:before{
1058
- position:absolute;
478
+ .toggle:focus{outline:2px solid transparent;outline-offset:2px;}
479
+ .tooltip{position:relative;display:inline-block;
480
+ --tooltip-offset:calc(100% + 1px + var(--tooltip-tail, 0px));}
481
+ .tooltip:before{position:absolute;
1059
482
  pointer-events:none;
1060
- }
1061
-
1062
- .tooltip:before{
1063
- content:attr(data-tip);
1064
- }
1065
-
483
+ content:attr(data-tip);}
1066
484
  .tooltip:before{
1067
485
  transform:translateX(-50%);
1068
486
  top:auto;
@@ -1070,7 +488,6 @@
1070
488
  right:auto;
1071
489
  bottom:var(--tooltip-offset);
1072
490
  }
1073
-
1074
491
  .tooltip-bottom:before{
1075
492
  transform:translateX(-50%);
1076
493
  top:var(--tooltip-offset);
@@ -1078,7 +495,6 @@
1078
495
  right:auto;
1079
496
  bottom:auto;
1080
497
  }
1081
-
1082
498
  .tooltip-left:before{
1083
499
  transform:translateY(-50%);
1084
500
  top:50%;
@@ -1086,7 +502,6 @@
1086
502
  right:var(--tooltip-offset);
1087
503
  bottom:auto;
1088
504
  }
1089
-
1090
505
  .tooltip-right:before{
1091
506
  transform:translateY(-50%);
1092
507
  top:50%;