@sigx/zero-daisyui 0.15.0 → 0.17.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.
@@ -16,6 +16,8 @@
16
16
  flex: 1 1 0%;
17
17
  justify-content: flex-start;
18
18
  flex-direction: row;
19
+ flex-basis: auto;
20
+ flex-shrink: 0;
19
21
  }
20
22
 
21
23
  .zx-navbar__center {
@@ -24,6 +26,7 @@
24
26
  gap: var(--space-sm);
25
27
  justify-content: center;
26
28
  flex-direction: row;
29
+ flex-shrink: 0;
27
30
  }
28
31
 
29
32
  .zx-navbar__end {
@@ -33,6 +36,8 @@
33
36
  flex: 1 1 0%;
34
37
  justify-content: flex-end;
35
38
  flex-direction: row;
39
+ flex-basis: auto;
40
+ flex-shrink: 0;
36
41
  }
37
42
 
38
43
  .zx-navbar__root.zx-a-color-primary {
@@ -10,11 +10,13 @@
10
10
  border: var(--border) solid var(--color-base-200);
11
11
  border-radius: var(--radius-box);
12
12
  background: var(--color-base-100);
13
+ overflow: hidden;
13
14
  }
14
15
 
15
16
  .zx-table__root.zx-f-focus-visible {
16
- outline: 2px solid var(--color-base-content);
17
+ outline: none;
17
18
  outline-offset: -2px;
19
+ box-shadow: inset 0 0 0 2px var(--color-base-content);
18
20
  }
19
21
 
20
22
  .zx-table__table {
@@ -122,6 +124,26 @@
122
124
  padding: var(--space-lg) var(--table-pad-inline);
123
125
  }
124
126
 
127
+ .zx-root .zx-table__header-cell {
128
+ color: #18181b99;
129
+ }
130
+
131
+ .zx-root.zx-theme-dark .zx-table__header-cell {
132
+ color: #ecf9ff99;
133
+ }
134
+
135
+ .zx-root.zx-theme-dim .zx-table__header-cell {
136
+ color: #b2ccd699;
137
+ }
138
+
139
+ .zx-root.zx-theme-nord .zx-table__header-cell {
140
+ color: #2e344099;
141
+ }
142
+
143
+ .zx-root.zx-theme-sunset .zx-table__header-cell {
144
+ color: #9fb9d099;
145
+ }
146
+
125
147
  .zx-table__sort-trigger {
126
148
  appearance: none;
127
149
  display: flex;
@@ -139,6 +161,7 @@
139
161
  background: transparent;
140
162
  color: inherit;
141
163
  transition: color var(--duration-fast) var(--ease-standard);
164
+ flex-direction: row;
142
165
  }
143
166
 
144
167
  .zx-table__sort-trigger.zx-s-ascending {
@@ -155,8 +178,13 @@
155
178
  }
156
179
 
157
180
  .zx-table__sort-trigger.zx-f-focus-visible {
158
- outline: 2px solid var(--color-base-content);
181
+ outline: none;
159
182
  outline-offset: 2px;
183
+ box-shadow: 0 0 0 2px var(--color-base-100), 0 0 0 4px var(--color-base-content);
184
+ }
185
+
186
+ .zx-table__sort-trigger.zx-f-pressed {
187
+ color: var(--table-accent);
160
188
  }
161
189
 
162
190
  .zx-table__sort-indicator {
@@ -164,6 +192,7 @@
164
192
  font-size: 0.75em;
165
193
  line-height: 1;
166
194
  transition: transform var(--duration-fast) var(--ease-standard), opacity var(--duration-fast) var(--ease-standard);
195
+ flex-shrink: 0;
167
196
  }
168
197
 
169
198
  .zx-table__sort-indicator.zx-s-descending {
@@ -200,6 +229,26 @@
200
229
  font-size: var(--text-xs);
201
230
  }
202
231
 
232
+ .zx-root .zx-table__cell-label {
233
+ color: #18181b99;
234
+ }
235
+
236
+ .zx-root.zx-theme-dark .zx-table__cell-label {
237
+ color: #ecf9ff99;
238
+ }
239
+
240
+ .zx-root.zx-theme-dim .zx-table__cell-label {
241
+ color: #b2ccd699;
242
+ }
243
+
244
+ .zx-root.zx-theme-nord .zx-table__cell-label {
245
+ color: #2e344099;
246
+ }
247
+
248
+ .zx-root.zx-theme-sunset .zx-table__cell-label {
249
+ color: #9fb9d099;
250
+ }
251
+
203
252
  .zx-root .zx-table__root.zx-a-color-primary {
204
253
  --table-accent: #3f2bcb;
205
254
  }
@@ -220,6 +269,46 @@
220
269
  --table-accent: #fb8a62;
221
270
  }
222
271
 
272
+ .zx-root .zx-table__header-cell.zx-a-color-primary {
273
+ color: #3f2bcb99;
274
+ }
275
+
276
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-primary {
277
+ color: #6567ff99;
278
+ }
279
+
280
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-primary {
281
+ color: #a0e79199;
282
+ }
283
+
284
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-primary {
285
+ color: #5c7da699;
286
+ }
287
+
288
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-primary {
289
+ color: #fb8a6299;
290
+ }
291
+
292
+ .zx-root .zx-table__cell-label.zx-a-color-primary {
293
+ color: #3f2bcb99;
294
+ }
295
+
296
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-primary {
297
+ color: #6567ff99;
298
+ }
299
+
300
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-primary {
301
+ color: #a0e79199;
302
+ }
303
+
304
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-primary {
305
+ color: #5c7da699;
306
+ }
307
+
308
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-primary {
309
+ color: #fb8a6299;
310
+ }
311
+
223
312
  .zx-root .zx-table__root.zx-a-color-secondary {
224
313
  --table-accent: #ad316f;
225
314
  }
@@ -240,6 +329,46 @@
240
329
  --table-accent: #e68aac;
241
330
  }
242
331
 
332
+ .zx-root .zx-table__header-cell.zx-a-color-secondary {
333
+ color: #ad316f99;
334
+ }
335
+
336
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-secondary {
337
+ color: #fa7cb699;
338
+ }
339
+
340
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-secondary {
341
+ color: #ed998499;
342
+ }
343
+
344
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-secondary {
345
+ color: #677e9899;
346
+ }
347
+
348
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-secondary {
349
+ color: #e68aac99;
350
+ }
351
+
352
+ .zx-root .zx-table__cell-label.zx-a-color-secondary {
353
+ color: #ad316f99;
354
+ }
355
+
356
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-secondary {
357
+ color: #fa7cb699;
358
+ }
359
+
360
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-secondary {
361
+ color: #ed998499;
362
+ }
363
+
364
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-secondary {
365
+ color: #677e9899;
366
+ }
367
+
368
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-secondary {
369
+ color: #e68aac99;
370
+ }
371
+
243
372
  .zx-root .zx-table__root.zx-a-color-accent {
244
373
  --table-accent: #2b786d;
245
374
  }
@@ -260,6 +389,46 @@
260
389
  --table-accent: #ab9fe8;
261
390
  }
262
391
 
392
+ .zx-root .zx-table__header-cell.zx-a-color-accent {
393
+ color: #2b786d99;
394
+ }
395
+
396
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-accent {
397
+ color: #93e5d999;
398
+ }
399
+
400
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-accent {
401
+ color: #bfade199;
402
+ }
403
+
404
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-accent {
405
+ color: #5e7d8c99;
406
+ }
407
+
408
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-accent {
409
+ color: #ab9fe899;
410
+ }
411
+
412
+ .zx-root .zx-table__cell-label.zx-a-color-accent {
413
+ color: #2b786d99;
414
+ }
415
+
416
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-accent {
417
+ color: #93e5d999;
418
+ }
419
+
420
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-accent {
421
+ color: #bfade199;
422
+ }
423
+
424
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-accent {
425
+ color: #5e7d8c99;
426
+ }
427
+
428
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-accent {
429
+ color: #ab9fe899;
430
+ }
431
+
263
432
  .zx-root .zx-table__root.zx-a-color-neutral {
264
433
  --table-accent: #121214;
265
434
  }
@@ -280,6 +449,46 @@
280
449
  --table-accent: #667a8a;
281
450
  }
282
451
 
452
+ .zx-root .zx-table__header-cell.zx-a-color-neutral {
453
+ color: #12121499;
454
+ }
455
+
456
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-neutral {
457
+ color: #878e9299;
458
+ }
459
+
460
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-neutral {
461
+ color: #71828c99;
462
+ }
463
+
464
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-neutral {
465
+ color: #3a415099;
466
+ }
467
+
468
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-neutral {
469
+ color: #667a8a99;
470
+ }
471
+
472
+ .zx-root .zx-table__cell-label.zx-a-color-neutral {
473
+ color: #12121499;
474
+ }
475
+
476
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-neutral {
477
+ color: #878e9299;
478
+ }
479
+
480
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-neutral {
481
+ color: #71828c99;
482
+ }
483
+
484
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-neutral {
485
+ color: #3a415099;
486
+ }
487
+
488
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-neutral {
489
+ color: #667a8a99;
490
+ }
491
+
283
492
  .zx-root .zx-table__root.zx-a-color-info {
284
493
  --table-accent: #2685b3;
285
494
  }
@@ -300,6 +509,46 @@
300
509
  --table-accent: #91d4e3;
301
510
  }
302
511
 
512
+ .zx-root .zx-table__header-cell.zx-a-color-info {
513
+ color: #2685b399;
514
+ }
515
+
516
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-info {
517
+ color: #70ceff99;
518
+ }
519
+
520
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-info {
521
+ color: #6ce2f399;
522
+ }
523
+
524
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-info {
525
+ color: #89728a99;
526
+ }
527
+
528
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-info {
529
+ color: #91d4e399;
530
+ }
531
+
532
+ .zx-root .zx-table__cell-label.zx-a-color-info {
533
+ color: #2685b399;
534
+ }
535
+
536
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-info {
537
+ color: #70ceff99;
538
+ }
539
+
540
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-info {
541
+ color: #6ce2f399;
542
+ }
543
+
544
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-info {
545
+ color: #89728a99;
546
+ }
547
+
548
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-info {
549
+ color: #91d4e399;
550
+ }
551
+
303
552
  .zx-root .zx-table__root.zx-a-color-success {
304
553
  --table-accent: #2a7858;
305
554
  }
@@ -320,6 +569,46 @@
320
569
  --table-accent: #a6cebe;
321
570
  }
322
571
 
572
+ .zx-root .zx-table__header-cell.zx-a-color-success {
573
+ color: #2a785899;
574
+ }
575
+
576
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-success {
577
+ color: #92e5c299;
578
+ }
579
+
580
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-success {
581
+ color: #8ee0c999;
582
+ }
583
+
584
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-success {
585
+ color: #6b7d6a99;
586
+ }
587
+
588
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-success {
589
+ color: #a6cebe99;
590
+ }
591
+
592
+ .zx-root .zx-table__cell-label.zx-a-color-success {
593
+ color: #2a785899;
594
+ }
595
+
596
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-success {
597
+ color: #92e5c299;
598
+ }
599
+
600
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-success {
601
+ color: #8ee0c999;
602
+ }
603
+
604
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-success {
605
+ color: #6b7d6a99;
606
+ }
607
+
608
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-success {
609
+ color: #a6cebe99;
610
+ }
611
+
323
612
  .zx-root .zx-table__root.zx-a-color-warning {
324
613
  --table-accent: #755a2b;
325
614
  }
@@ -340,6 +629,46 @@
340
629
  --table-accent: #c5c1b7;
341
630
  }
342
631
 
632
+ .zx-root .zx-table__header-cell.zx-a-color-warning {
633
+ color: #755a2b99;
634
+ }
635
+
636
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-warning {
637
+ color: #f5ddac99;
638
+ }
639
+
640
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-warning {
641
+ color: #cecfa699;
642
+ }
643
+
644
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-warning {
645
+ color: #7d746399;
646
+ }
647
+
648
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-warning {
649
+ color: #c5c1b799;
650
+ }
651
+
652
+ .zx-root .zx-table__cell-label.zx-a-color-warning {
653
+ color: #755a2b99;
654
+ }
655
+
656
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-warning {
657
+ color: #f5ddac99;
658
+ }
659
+
660
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-warning {
661
+ color: #cecfa699;
662
+ }
663
+
664
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-warning {
665
+ color: #7d746399;
666
+ }
667
+
668
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-warning {
669
+ color: #c5c1b799;
670
+ }
671
+
343
672
  .zx-root .zx-table__root.zx-a-color-error {
344
673
  --table-accent: #d9576d;
345
674
  }
@@ -360,6 +689,46 @@
360
689
  --table-accent: #f2bbc0;
361
690
  }
362
691
 
692
+ .zx-root .zx-table__header-cell.zx-a-color-error {
693
+ color: #d9576d99;
694
+ }
695
+
696
+ .zx-root.zx-theme-dark .zx-table__header-cell.zx-a-color-error {
697
+ color: #ff7d9099;
698
+ }
699
+
700
+ .zx-root.zx-theme-dim .zx-table__header-cell.zx-a-color-error {
701
+ color: #f5b3a499;
702
+ }
703
+
704
+ .zx-root.zx-theme-nord .zx-table__header-cell.zx-a-color-error {
705
+ color: #a85b6499;
706
+ }
707
+
708
+ .zx-root.zx-theme-sunset .zx-table__header-cell.zx-a-color-error {
709
+ color: #f2bbc099;
710
+ }
711
+
712
+ .zx-root .zx-table__cell-label.zx-a-color-error {
713
+ color: #d9576d99;
714
+ }
715
+
716
+ .zx-root.zx-theme-dark .zx-table__cell-label.zx-a-color-error {
717
+ color: #ff7d9099;
718
+ }
719
+
720
+ .zx-root.zx-theme-dim .zx-table__cell-label.zx-a-color-error {
721
+ color: #f5b3a499;
722
+ }
723
+
724
+ .zx-root.zx-theme-nord .zx-table__cell-label.zx-a-color-error {
725
+ color: #a85b6499;
726
+ }
727
+
728
+ .zx-root.zx-theme-sunset .zx-table__cell-label.zx-a-color-error {
729
+ color: #f2bbc099;
730
+ }
731
+
363
732
  .zx-table__root.zx-a-size-xs {
364
733
  --table-pad-inline: var(--space-xs);
365
734
  --table-font: var(--text-xs);
@@ -379,3 +748,33 @@
379
748
  --table-pad-inline: var(--space-xl);
380
749
  --table-font: var(--text-md);
381
750
  }
751
+ .zx-table__root.zx-m-stacked {
752
+ border-width: calc(var(--border) * 0);
753
+ border-radius: calc(var(--radius-box) * 0);
754
+ }
755
+ .zx-table__caption.zx-m-stacked {
756
+ padding-left: calc(var(--table-pad-inline) * 0);
757
+ padding-right: calc(var(--table-pad-inline) * 0);
758
+ }
759
+ .zx-table__row.zx-m-stacked {
760
+ border: var(--border) solid var(--color-base-200);
761
+ border-radius: var(--radius-box);
762
+ background: var(--color-base-100);
763
+ padding: var(--space-sm) var(--table-pad-inline);
764
+ margin-bottom: var(--space-md);
765
+ }
766
+ .zx-table__row.zx-m-stacked.zx-f-selected {
767
+ background: var(--color-base-300);
768
+ }
769
+ .zx-table__cell.zx-m-stacked {
770
+ padding-left: calc(var(--table-pad-inline) * 0);
771
+ padding-right: calc(var(--table-pad-inline) * 0);
772
+ padding-top: var(--space-xs);
773
+ padding-bottom: var(--space-xs);
774
+ }
775
+ .zx-table__row.zx-m-stripe {
776
+ background: var(--color-base-200);
777
+ }
778
+ .zx-table__sort-indicator.zx-m-held.zx-s-none {
779
+ opacity: 0.6;
780
+ }
@@ -16,6 +16,9 @@
16
16
  transition: background var(--duration-normal) var(--ease-standard);
17
17
  padding-left: calc(var(--size-field) * 4);
18
18
  padding-right: calc(var(--size-field) * 4);
19
+ width: max-content;
20
+ flex-shrink: 0;
21
+ flex-wrap: nowrap;
19
22
  }
20
23
 
21
24
  .zx-tooltip__trigger.zx-f-disabled {
@@ -51,6 +54,10 @@
51
54
  transform: none;
52
55
  }
53
56
 
57
+ .zx-tooltip__arrow {
58
+ background: var(--color-neutral);
59
+ }
60
+
54
61
  .zx-tooltip__trigger.zx-a-color-primary {
55
62
  background: var(--color-primary);
56
63
  color: var(--color-primary-content);
@@ -37,7 +37,7 @@
37
37
  border-radius: var(--radius-field);
38
38
  cursor: pointer;
39
39
  outline: none;
40
- transition: background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
40
+ transition: background var(--duration-fast) var(--ease-standard);
41
41
  }
42
42
 
43
43
  .zx-tree-view__item.zx-f-selected {
@@ -82,7 +82,7 @@
82
82
  border-radius: var(--radius-field);
83
83
  cursor: pointer;
84
84
  outline: none;
85
- transition: background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard);
85
+ transition: background var(--duration-fast) var(--ease-standard);
86
86
  user-select: none;
87
87
  }
88
88