daisyui 1.25.1 → 2.0.0-next.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/unstyled.css CHANGED
@@ -1,256 +1,134 @@
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
- }
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%;}
39
8
  .avatar img{
40
- height:100%;
41
9
  -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;
10
+ object-fit:cover;}
11
+ .avatar.placeholder>div{display:flex;}
12
+ .avatar.placeholder>div{align-items:center;}
13
+ .avatar.placeholder>div{justify-content:center;}
14
+ .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;
61
15
  width:-webkit-fit-content;
62
16
  width:-moz-fit-content;
63
17
  width:fit-content;
64
18
  padding-left:.563rem;
65
- padding-right:.563rem;
66
- }
67
- .breadcrumbs{
68
- max-width:100%;
69
- overflow-x:auto;
70
- }
19
+ padding-right:.563rem}
20
+ .breadcrumbs{max-width:100%;overflow-x:auto;}
21
+ .breadcrumbs>ul{display:flex;}
22
+ .breadcrumbs>ul{align-items:center;}
23
+ .breadcrumbs>ul{white-space:nowrap;}
71
24
  .breadcrumbs>ul{
72
- display:flex;
73
- align-items:center;
74
- white-space:nowrap;
75
25
  min-height:-webkit-min-content;
76
26
  min-height:-moz-min-content;
77
27
  min-height:min-content;
78
28
  }
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
- }
29
+ .breadcrumbs>ul>li{display:flex;}
30
+ .breadcrumbs>ul>li{align-items:center;}
31
+ .breadcrumbs>ul>li>a{display:flex;}
32
+ .breadcrumbs>ul>li>a{cursor:pointer;}
33
+ .breadcrumbs>ul>li>a{align-items:center;}
88
34
  .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;
35
+ -webkit-text-decoration-line:underline;
36
+ text-decoration-line:underline;}.btn{display:inline-flex;flex-shrink:0;cursor:pointer;
99
37
  -webkit-user-select:none;
100
38
  -moz-user-select:none;
101
39
  -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
- }
40
+ 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;
41
+ line-height:1em;}
42
+ .btn:focus{outline:2px solid transparent;outline-offset:2px;}
43
+ .btn-disabled,.btn[disabled]{pointer-events:none;}
44
+ .btn-square{height:3rem;}
45
+ .btn-square{width:3rem;}
46
+ .btn-square{padding:0;}
47
+ .btn-circle{height:3rem;}
48
+ .btn-circle{width:3rem;}
49
+ .btn-circle{border-radius:9999px;}
50
+ .btn-circle{padding:0;}
51
+ .btn.loading,.btn.loading:hover{pointer-events:none;}
52
+ .btn.loading:before{margin-right:.5rem;}
53
+ .btn.loading:before{height:1rem;}
54
+ .btn.loading:before{width:1rem;}
55
+ .btn.loading:before{border-radius:9999px;}
56
+ .btn.loading:before{border-width:2px;}
137
57
  .btn.loading:before{
138
- border-radius:9999px;
139
- border-width:2px;
140
- height:1rem;
141
- margin-right:.5rem;
142
- width:1rem;
143
58
  -webkit-animation:spin 2s linear infinite;
144
59
  animation:spin 2s linear infinite;
145
60
  content:"";
146
61
  border-color:transparent currentColor currentColor transparent;
147
62
  }
148
-
149
63
  @media (prefers-reduced-motion:reduce){
150
64
  .btn.loading:before{
151
65
  -webkit-animation:spin 10s linear infinite;
152
66
  animation:spin 10s linear infinite;
153
67
  }
154
68
  }
155
-
156
69
  @-webkit-keyframes spin{
157
70
  0%{
158
71
  transform:rotate(0deg);
159
72
  }
160
-
161
73
  to{
162
74
  transform:rotate(1turn);
163
75
  }
164
76
  }
165
-
166
77
  @keyframes spin{
167
78
  0%{
168
79
  transform:rotate(0deg);
169
80
  }
170
-
171
81
  to{
172
82
  transform:rotate(1turn);
173
83
  }
174
84
  }
175
-
176
- .btn-group{
177
- display:flex;
178
- flex-wrap:wrap;
179
- }
180
-
85
+ .btn-group{display:flex;flex-wrap:wrap;}
181
86
  .btn-group>input[type=radio].btn{
182
- -webkit-appearance:none;
183
- -moz-appearance:none;
184
- appearance:none;
185
- }
186
-
87
+ -webkit-appearance:none;
88
+ -moz-appearance:none;
89
+ appearance:none;}
187
90
  .btn-group>input[type=radio].btn:before{
188
91
  content:attr(data-title);
189
92
  }
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
- }
93
+ .card{position:relative;display:flex;flex-direction:column;overflow:hidden;}
94
+ .card:focus{outline:2px solid transparent;outline-offset:2px;}
95
+ .card-body{display:flex;}
96
+ .card-body{flex:1 1 auto;}
97
+ .card-body{flex-direction:column;}
98
+ .card-body :where(p){flex-grow:1;}
99
+ .card-actions{display:flex;}
100
+ .card-actions{flex-wrap:wrap;}
101
+ .card-actions{align-items:flex-start;}
102
+ .card-actions{gap:.5rem;}
103
+ .card figure{display:flex;}
104
+ .card figure{align-items:center;}
105
+ .card figure{justify-content:center;}
106
+ .card.image-full{display:grid;}
107
+ .card.image-full:before{position:relative;}
221
108
  .card.image-full:before{
222
- position:relative;
223
109
  content:"";
224
110
  }
225
- .card.image-full:before,.card.image-full>*{
226
- grid-column-start:1;
227
- grid-row-start:1;
228
- }
111
+ .card.image-full:before,.card.image-full>*{grid-column-start:1;}
112
+ .card.image-full:before,.card.image-full>*{grid-row-start:1;}
113
+ .card.image-full>figure img{height:100%;}
229
114
  .card.image-full>figure img{
230
- height:100%;
231
115
  -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
- }
116
+ object-fit:cover;}
117
+ .card.image-full>.card-body{position:relative;}
118
+ .carousel{display:flex;overflow-x:scroll;
119
+ -ms-scroll-snap-type:x mandatory;
120
+ scroll-snap-type:x mandatory;
121
+ scroll-behavior:smooth;}
122
+ .carousel-vertical{flex-direction:column;}
123
+ .carousel-vertical{overflow-y:scroll;}
244
124
  .carousel-vertical{
245
- flex-direction:column;
246
- overflow-y:scroll;
247
125
  -ms-scroll-snap-type:y mandatory;
248
126
  scroll-snap-type:y mandatory;
249
127
  }
128
+ .carousel-item{box-sizing:content-box;}
129
+ .carousel-item{display:flex;}
130
+ .carousel-item{flex:none;}
250
131
  .carousel-item{
251
- box-sizing:content-box;
252
- display:flex;
253
- flex:none;
254
132
  scroll-snap-align:start;
255
133
  }
256
134
  .carousel-center .carousel-item{
@@ -258,49 +136,27 @@
258
136
  }
259
137
  .carousel-end .carousel-item{
260
138
  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;
273
- }
274
-
139
+ }.checkbox:focus{outline:2px solid transparent;outline-offset:2px}.collapse{position:relative;display:grid;overflow:hidden;}
140
+ .collapse-content,.collapse-title,.collapse>input[type=checkbox]{grid-column-start:1;grid-row-start:1;}
275
141
  .collapse>input[type=checkbox]{
276
142
  -webkit-appearance:none;
277
143
  -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
-
144
+ appearance:none;opacity:0;}
145
+ .collapse-content{grid-row-start:2;overflow:hidden;
146
+ max-height:0;}
288
147
  .collapse-open .collapse-content,.collapse:focus:not(.collapse-close) .collapse-content,.collapse:not(.collapse-close) input[type=checkbox]:checked~.collapse-content{
289
148
  max-height:9000px;
290
149
  }:root .countdown{
291
150
  line-height:1em;
292
151
  }
293
-
294
152
  .countdown{
295
153
  display:inline-flex;
296
154
  }
297
-
298
155
  .countdown>*{
299
- height:1em;
300
- display:inline-block;
301
- overflow-y:hidden;
156
+ height:1em
302
157
  }
303
-
158
+ .countdown>*{display:inline-block;}
159
+ .countdown>*{overflow-y:hidden;}
304
160
  .countdown>:before{
305
161
  position:relative;
306
162
  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 +164,293 @@
308
164
  top:calc(var(--value)*-1em);
309
165
  }
310
166
 
311
- .divider{
312
- display:flex;
313
- align-items:center;
314
- }
167
+ .divider{display:flex;flex-direction:row;align-items:center;align-self:stretch;}
315
168
  .divider:after,.divider:before{
316
169
  content:"";
317
- flex-grow:1;
318
- }.drawer{
319
- display:grid;
320
- overflow:hidden;
321
- }
170
+ }
171
+ .divider:after,.divider:before{flex-grow:1;}
172
+ .divider:after,.divider:before{height:.125rem;}
173
+ .divider:after,.divider:before{width:100%;}
174
+ .drawer{display:grid;overflow:hidden;}
322
175
  .drawer.drawer-end{
323
176
  direction:rtl;
324
177
  }
325
178
  .drawer.drawer-end>*{
326
179
  direction:ltr;
327
180
  }
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
-
181
+ .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));}
182
+ .drawer.drawer-end .drawer-toggle~.drawer-side>.drawer-overlay+*{justify-self:end;}
183
+ .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));}
184
+ .drawer-toggle{position:absolute;height:0;width:0;
185
+ -webkit-appearance:none;
186
+ -moz-appearance:none;
187
+ appearance:none;opacity:0;}
188
+ .drawer-toggle~.drawer-content{z-index:0;}
189
+ .drawer-toggle~.drawer-content{grid-column-start:1;}
190
+ .drawer-toggle~.drawer-content{grid-row-start:1;}
191
+ .drawer-toggle~.drawer-content{max-height:100vh;}
192
+ .drawer-toggle~.drawer-content{overflow-y:auto;}
346
193
  .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
194
  -ms-scroll-chaining:none;
353
195
  overscroll-behavior:contain;
354
196
  }
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
-
197
+ .drawer-toggle~.drawer-side{grid-column-start:1;}
198
+ .drawer-toggle~.drawer-side{grid-row-start:1;}
199
+ .drawer-toggle~.drawer-side{display:grid;}
200
+ .drawer-toggle~.drawer-side{max-height:100vh;}
201
+ .drawer-toggle~.drawer-side>.drawer-overlay{visibility:hidden;}
202
+ .drawer-toggle~.drawer-side>.drawer-overlay{grid-column-start:1;}
203
+ .drawer-toggle~.drawer-side>.drawer-overlay{grid-row-start:1;}
204
+ .drawer-toggle~.drawer-side>.drawer-overlay{opacity:0;}
205
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{z-index:10;}
206
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{grid-column-start:1;}
207
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{grid-row-start:1;}
208
+ .drawer-toggle~.drawer-side>.drawer-overlay+*{--tw-translate-x:-100%;}
209
+ .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));}
210
+ .drawer-toggle:checked~.drawer-side{overflow-y:auto;}
211
+ .drawer-toggle:checked~.drawer-side>.drawer-overlay{visibility:visible;}
212
+ .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));}
213
+ [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));}
214
+ [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
215
  @media (min-width:1024px){
406
216
  .drawer-mobile{
407
217
  grid-auto-columns:-webkit-max-content auto;
408
218
  grid-auto-columns:max-content auto;
409
219
  }
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
-
220
+ .drawer-mobile>.drawer-toggle~.drawer-content{height:auto;}
221
+ @media (min-width:1024px){.drawer-mobile>.drawer-toggle~.drawer-content{grid-column-start:2;}}
222
+ .drawer-mobile>.drawer-toggle~.drawer-side{overflow-y:auto;}
223
+ @media (min-width:1024px){.drawer-mobile>.drawer-toggle~.drawer-side>.drawer-overlay{visibility:visible;}}
224
+ @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
225
  .drawer-mobile.drawer-end{
433
226
  grid-auto-columns:auto -webkit-max-content;
434
227
  grid-auto-columns:auto max-content;
435
228
  direction:ltr;
436
229
  }
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
-
230
+ .drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{height:auto;}
231
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-content{grid-column-start:1;}}
232
+ .drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{overflow-y:auto;}
233
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-side{grid-column-start:2;}}
234
+ @media (min-width:1024px){.drawer-mobile.drawer-end>.drawer-toggle~.drawer-side>.drawer-overlay{visibility:visible;}}
235
+ @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));}}
236
+ }.dropdown{position:relative;display:inline-block}
237
+ .dropdown>:focus{outline:2px solid transparent;outline-offset:2px}
238
+ .dropdown .dropdown-content{visibility:hidden;position:absolute;z-index:50;opacity:0}
239
+ .dropdown-end .dropdown-content{right:0}
240
+ .dropdown-left .dropdown-content{top:0;right:100%;bottom:auto}
241
+ .dropdown-right .dropdown-content{left:100%;top:0;bottom:auto}
242
+ .dropdown-top .dropdown-content{bottom:100%;top:auto}
243
+ .dropdown-end.dropdown-right .dropdown-content{bottom:0;top:auto}
244
+ .dropdown-end.dropdown-left .dropdown-content{bottom:0;top:auto}
245
+ .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;}
246
+ .footer>*{display:grid;}
247
+ .footer>*{place-items:start;}
248
+ .footer-center{place-items:center;}
249
+ .footer-center{text-align:center;}
250
+ .footer-center>*{place-items:center;}
532
251
  @media (min-width:48rem){
533
252
  .footer{
534
253
  grid-auto-flow:column;
535
254
  }
536
-
537
255
  .footer-center{
538
256
  grid-auto-flow:row dense;
539
257
  }
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;
258
+ }.form-control{display:flex;flex-direction:column}
259
+ .label{display:flex;
260
+ -webkit-user-select:none;
261
+ -moz-user-select:none;
262
+ -ms-user-select:none;
263
+ user-select:none;align-items:center;justify-content:space-between}
264
+ .hero{display:grid;width:100%;place-items:center;background-size:cover;background-position:50%;}
265
+ .hero>*{grid-column-start:1;}
266
+ .hero>*{grid-row-start:1;}
267
+ .hero-overlay{grid-column-start:1;}
268
+ .hero-overlay{grid-row-start:1;}
269
+ .hero-overlay{height:100%;}
270
+ .hero-overlay{width:100%;}
271
+ .hero-content{z-index:0;}
272
+ .hero-content{display:flex;}
273
+ .hero-content{align-items:center;}
274
+ .hero-content{justify-content:center;}.indicator{position:relative;display:inline-flex;
579
275
  width:-webkit-fit-content;
580
276
  width:-moz-fit-content;
581
- width:fit-content;
582
- }
277
+ width:fit-content;}
583
278
  .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
- }
595
- .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
-
279
+ z-index:1
280
+ }
281
+ .indicator .indicator-item{position:absolute;}
282
+ .indicator .indicator-item{right:0;}
283
+ .indicator .indicator-item{left:auto;}
284
+ .indicator .indicator-item{top:0;}
285
+ .indicator .indicator-item{bottom:auto;}
286
+ .indicator .indicator-item{--tw-translate-x:50%;}
287
+ .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));}
288
+ .indicator .indicator-item.indicator-start{right:auto;}
289
+ .indicator .indicator-item.indicator-start{left:0;}
290
+ .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));}
291
+ .indicator .indicator-item.indicator-center{right:50%;}
292
+ .indicator .indicator-item.indicator-center{left:50%;}
293
+ .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));}
294
+ .indicator .indicator-item.indicator-end{right:0;}
295
+ .indicator .indicator-item.indicator-end{left:auto;}
296
+ .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));}
297
+ .indicator .indicator-item.indicator-bottom{top:auto;}
298
+ .indicator .indicator-item.indicator-bottom{bottom:0;}
299
+ .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));}
300
+ .indicator .indicator-item.indicator-middle{top:50%;}
301
+ .indicator .indicator-item.indicator-middle{bottom:50%;}
302
+ .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));}
303
+ .indicator .indicator-item.indicator-top{top:0;}
304
+ .indicator .indicator-item.indicator-top{bottom:auto;}
305
+ .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));}
306
+
307
+ .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;}
308
+ .input:focus{outline:2px solid transparent;outline-offset:2px;}
309
+ .input-group{display:flex;width:100%;align-items:stretch;}
310
+ .input-group>*,.input-group>.input{border-radius:0;}
311
+ .input-group-md{font-size:.875rem;line-height:1.25rem;}
312
+ .input-group-md{line-height:2;}
313
+ .input-group-lg{font-size:1.125rem;line-height:1.75rem;}
314
+ .input-group-lg{line-height:2;}
315
+ .input-group-sm{font-size:.875rem;line-height:1.25rem;}
316
+ .input-group-sm{line-height:2rem;}
317
+ .input-group-xs{font-size:.75rem;line-height:1rem;}
318
+ .input-group-xs{line-height:1.625;}
319
+ .input-group :where(span){display:flex;}
320
+ .input-group :where(span){align-items:center;}
321
+ .input-group :where(span){--tw-bg-opacity:1;background-color:hsl(var(--b3, var(--b1)) / var(--tw-bg-opacity));}
322
+ .input-group :where(span){padding-left:1rem;padding-right:1rem;}
694
323
  .input-group :first-child{
695
324
  border-top-left-radius:var(--rounded-btn, .5rem);
696
325
  border-top-right-radius:0;
697
326
  border-bottom-left-radius:var(--rounded-btn, .5rem);
698
327
  border-bottom-right-radius:0;
699
328
  }
700
-
701
329
  .input-group :last-child{
702
330
  border-top-left-radius:0;
703
331
  border-top-right-radius:var(--rounded-btn, .5rem);
704
332
  border-bottom-left-radius:0;
705
333
  border-bottom-right-radius:var(--rounded-btn, .5rem);
706
334
  }
707
-
708
- .input-group-vertical{
709
- flex-direction:column;
710
- }
711
-
335
+ .input-group-vertical{flex-direction:column;}
712
336
  .input-group-vertical :first-child{
713
337
  border-top-left-radius:var(--rounded-btn, .5rem);
714
338
  border-top-right-radius:var(--rounded-btn, .5rem);
715
339
  border-bottom-left-radius:0;
716
340
  border-bottom-right-radius:0;
717
341
  }
718
-
719
342
  .input-group-vertical :last-child{
720
343
  border-top-left-radius:0;
721
344
  border-top-right-radius:0;
722
345
  border-bottom-left-radius:var(--rounded-btn, .5rem);
723
346
  border-bottom-right-radius:var(--rounded-btn, .5rem);
724
347
  }
725
- .kbd{
726
- display:inline-flex;
727
- align-items:center;
728
- justify-content:center;
729
- }.link{
730
- cursor:pointer;
731
- text-decoration:underline;
732
- }
348
+ .kbd{display:inline-flex;align-items:center;justify-content:center}.link{cursor:pointer;
349
+ -webkit-text-decoration-line:underline;
350
+ text-decoration-line:underline;}
733
351
  .link-hover{
734
- text-decoration:none;
735
- }
352
+ -webkit-text-decoration-line:none;
353
+ text-decoration-line:none;}
736
354
  .link-hover:hover{
737
- text-decoration:underline;
738
- }.mask{
355
+ -webkit-text-decoration-line:underline;
356
+ text-decoration-line:underline;}.mask{
739
357
  -webkit-mask-size:contain;
740
358
  mask-size:contain;
741
359
  -webkit-mask-repeat:no-repeat;
742
360
  mask-repeat:no-repeat;
743
361
  -webkit-mask-position:center;
744
362
  mask-position:center;
745
- }.menu{
746
- display:flex;
747
- flex-direction:column;
748
- overflow:hidden;
749
363
  }
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{
364
+ .mask-half-1{
365
+ -webkit-mask-size:200%;
366
+ mask-size:200%;
367
+ -webkit-mask-position:left;
368
+ mask-position:left;
369
+ }
370
+ .mask-half-2{
371
+ -webkit-mask-size:200%;
372
+ mask-size:200%;
373
+ -webkit-mask-position:right;
374
+ mask-position:right;
375
+ }
376
+ .menu{display:flex;flex-direction:column;}
377
+ .menu.horizontal{display:inline-flex;}
378
+ .menu.horizontal{flex-direction:row;}
379
+ .menu.horizontal :where(li){flex-direction:row;}
380
+ .menu :where(li){position:relative;display:flex;flex-direction:column;flex-wrap:wrap;align-items:stretch;}
381
+ .menu :where(li:not(.disabled):not(.menu-title))>:where(:not(ul)){display:flex;cursor:pointer;
382
+ -webkit-user-select:none;
383
+ -moz-user-select:none;
384
+ -ms-user-select:none;
385
+ user-select:none;align-items:center;outline:2px solid transparent;outline-offset:2px;}
386
+ .menu>:where(li>:not(ul):focus){outline:2px solid transparent;outline-offset:2px;}
387
+ .menu>:where(li.disabled>:not(ul):focus){cursor:auto;}
388
+ .menu>:where(li) :where(ul){display:flex;flex-direction:column;align-items:stretch;}
389
+ .menu>:where(li)>:where(ul){position:absolute;display:none;
390
+ top:auto;
391
+ left:100%;}
392
+ .menu>:where(li:hover)>:where(ul){display:flex;}
393
+ .menu>:where(li:focus)>:where(ul){display:flex;}
394
+ .mockup-code{position:relative;}
395
+ .mockup-code{overflow:hidden;}
396
+ .mockup-code{overflow-x:auto;}
397
+ .mockup-code pre[data-prefix]:before{
792
398
  content:attr(data-prefix);
793
- display:inline-block;
794
- text-align:right;
795
399
  }
796
- .mockup-window{
797
- overflow:hidden;
798
- overflow-x:auto;
799
- position:relative;
800
- }
400
+ .mockup-code pre[data-prefix]:before{display:inline-block;}
401
+ .mockup-code pre[data-prefix]:before{text-align:right;}
402
+ .mockup-window{position:relative;}
403
+ .mockup-window{overflow:hidden;}
404
+ .mockup-window{overflow-x:auto;}
801
405
  .mockup-window pre[data-prefix]:before{
802
406
  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{
407
+ }
408
+ .mockup-window pre[data-prefix]:before{display:inline-block;}
409
+ .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
410
  z-index:999;
827
411
  }
828
-
829
412
  .modal-box{
830
413
  max-height:calc(100vh - 5em);
831
414
  }
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{
415
+ .modal-open,.modal-toggle:checked+.modal,.modal:target{pointer-events:auto;visibility:visible;opacity:1;}
416
+ .modal-action{display:flex;}
417
+ .modal-toggle{position:fixed;height:0;width:0;
844
418
  -webkit-appearance:none;
845
419
  -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
-
420
+ appearance:none;opacity:0;}
421
+ .navbar{display:flex;align-items:center;}
422
+ .navbar>*{display:flex;}
423
+ .navbar>*{align-items:center;}
860
424
  .navbar-start{
861
425
  width:50%;
862
426
  justify-content:flex-start;
863
427
  }
864
-
865
428
  .navbar-center{
866
429
  flex-shrink:0;
867
430
  }
868
-
869
431
  .navbar-end{
870
432
  width:50%;
871
433
  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
- }
434
+ }.progress{position:relative;width:100%;
435
+ -webkit-appearance:none;
436
+ -moz-appearance:none;
437
+ appearance:none;overflow:hidden}.radio:focus{outline:2px solid transparent;outline-offset:2px}.range{height:1.25rem;width:100%;cursor:pointer;}
887
438
  .range:focus{
888
439
  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
- }
440
+ }.rating{position:relative;display:inline-flex;}
441
+ .rating :where(input){cursor:pointer;}.select{display:inline-flex;flex-shrink:0;cursor:pointer;
442
+ -webkit-user-select:none;
443
+ -moz-user-select:none;
444
+ -ms-user-select:none;
445
+ user-select:none;
446
+ -webkit-appearance:none;
447
+ -moz-appearance:none;
448
+ appearance:none;height:3rem;padding-left:1rem;padding-right:2.5rem;font-size:.875rem;line-height:1.25rem;line-height:2;min-height:3rem;}
449
+ .select:focus{outline:2px solid transparent;outline-offset:2px;}
450
+ .select-disabled,.select[disabled]{pointer-events:none;}
451
+ .stack{display:inline-grid;}
452
+ .stack>*{grid-column-start:1;}
453
+ .stack>*{grid-row-start:1;}
927
454
  .stack>*{
928
455
  transform:translateY(1rem)scale(.9);
929
456
  z-index:1;
@@ -935,134 +462,64 @@
935
462
  .stack>:first-child{
936
463
  transform:translateY(0)scale(1);
937
464
  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{
465
+ }.stats{display:inline-grid;}
466
+ :where(.stats){grid-auto-flow:column;}
467
+ .stat{display:inline-grid;width:100%;
468
+ grid-template-columns:repeat(1, 1fr);}
469
+ .stat-figure{grid-column-start:2;}
470
+ .stat-figure{grid-row:span 3 / span 3;}
471
+ .stat-figure{grid-row-start:1;}
472
+ .stat-figure{place-self:center;}
473
+ .stat-figure{justify-self:end;}
474
+ .stat-title{grid-column-start:1;}
475
+ .stat-title{white-space:nowrap;}
476
+ .stat-value{grid-column-start:1;}
477
+ .stat-value{white-space:nowrap;}
478
+ .stat-desc{grid-column-start:1;}
479
+ .stat-desc{white-space:nowrap;}
480
+ .stat-actions{grid-column-start:1;}
481
+ .stat-actions{white-space:nowrap;}
482
+ .steps{
982
483
  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;
484
+ grid-auto-columns:1fr;
485
+ display:inline-grid;
486
+ grid-auto-flow:column;
487
+ overflow:hidden;
488
+ overflow-x:auto;
999
489
  }
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;
490
+ .steps [class~=step]{display:grid;}
491
+ .steps [class~=step]{grid-template-columns:repeat(1, minmax(0, 1fr));}
492
+ .steps [class~=step]{grid-template-rows:repeat(2, minmax(0, 1fr));}
493
+ .steps [class~=step]{place-items:center;}
494
+ .steps [class~=step]{text-align:center;}.tabs{display:flex;flex-wrap:wrap;align-items:flex-end}
495
+ .tab{position:relative;display:inline-flex;cursor:pointer;
1009
496
  -webkit-user-select:none;
1010
497
  -moz-user-select:none;
1011
498
  -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
- }
499
+ 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;
500
+ --tab-padding:1rem}.table{position:relative;}
501
+ .table th:first-child{position:-webkit-sticky;position:sticky;}
502
+ .table th:first-child{left:0;}
503
+ .table th:first-child{z-index:10;}
1021
504
  .table th:first-child{
1022
- position:sticky;
1023
- left:0;
1024
- z-index:10;
1025
505
  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
506
  }
507
+ .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);}
508
+ .textarea{padding-left:1rem;padding-right:1rem;}
509
+ .textarea{padding-top:.5rem;padding-bottom:.5rem;}
510
+ .textarea{font-size:.875rem;line-height:1.25rem;}
511
+ .textarea{line-height:2;}
512
+ .textarea{min-height:3rem;}
513
+ .textarea:focus{outline:2px solid transparent;outline-offset:2px;}
1044
514
  .toggle{
1045
515
  flex-shrink:0;
1046
516
  }
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;
517
+ .toggle:focus{outline:2px solid transparent;outline-offset:2px;}
518
+ .tooltip{position:relative;display:inline-block;
519
+ --tooltip-offset:calc(100% + 1px + var(--tooltip-tail, 0px));}
520
+ .tooltip:before{position:absolute;
1059
521
  pointer-events:none;
1060
- }
1061
-
1062
- .tooltip:before{
1063
- content:attr(data-tip);
1064
- }
1065
-
522
+ content:attr(data-tip);}
1066
523
  .tooltip:before{
1067
524
  transform:translateX(-50%);
1068
525
  top:auto;
@@ -1070,7 +527,6 @@
1070
527
  right:auto;
1071
528
  bottom:var(--tooltip-offset);
1072
529
  }
1073
-
1074
530
  .tooltip-bottom:before{
1075
531
  transform:translateX(-50%);
1076
532
  top:var(--tooltip-offset);
@@ -1078,7 +534,6 @@
1078
534
  right:auto;
1079
535
  bottom:auto;
1080
536
  }
1081
-
1082
537
  .tooltip-left:before{
1083
538
  transform:translateY(-50%);
1084
539
  top:50%;
@@ -1086,7 +541,6 @@
1086
541
  right:var(--tooltip-offset);
1087
542
  bottom:auto;
1088
543
  }
1089
-
1090
544
  .tooltip-right:before{
1091
545
  transform:translateY(-50%);
1092
546
  top:50%;