@rokkit/themes 1.1.17 → 1.1.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (128) hide show
  1. package/dist/base/stepper.css +11 -5
  2. package/dist/base/table.css +4 -1
  3. package/dist/base/toggle.css +5 -0
  4. package/dist/base.css +20 -6
  5. package/dist/frosted/button.css +8 -8
  6. package/dist/frosted/card.css +4 -4
  7. package/dist/frosted/dropdown.css +2 -2
  8. package/dist/frosted/list.css +5 -5
  9. package/dist/frosted/menu.css +5 -5
  10. package/dist/frosted/message.css +4 -4
  11. package/dist/frosted/select.css +8 -8
  12. package/dist/frosted/table.css +5 -5
  13. package/dist/frosted/tabs.css +2 -2
  14. package/dist/frosted/timeline.css +1 -1
  15. package/dist/frosted/toggle.css +4 -4
  16. package/dist/frosted/tree.css +15 -4
  17. package/dist/frosted.css +63 -52
  18. package/dist/index.css +437 -306
  19. package/dist/material/button.css +14 -10
  20. package/dist/material/dropdown.css +2 -2
  21. package/dist/material/list.css +5 -5
  22. package/dist/material/menu.css +5 -5
  23. package/dist/material/select.css +8 -8
  24. package/dist/material/table.css +5 -5
  25. package/dist/material/tabs.css +4 -3
  26. package/dist/material/timeline.css +4 -3
  27. package/dist/material/toggle.css +6 -5
  28. package/dist/material/tree.css +15 -4
  29. package/dist/material.css +68 -50
  30. package/dist/minimal/button.css +14 -10
  31. package/dist/minimal/card.css +4 -4
  32. package/dist/minimal/dropdown.css +2 -2
  33. package/dist/minimal/list.css +8 -8
  34. package/dist/minimal/menu.css +6 -6
  35. package/dist/minimal/select.css +8 -8
  36. package/dist/minimal/table.css +5 -5
  37. package/dist/minimal/tabs.css +2 -2
  38. package/dist/minimal/timeline.css +3 -3
  39. package/dist/minimal/toggle.css +4 -4
  40. package/dist/minimal/tree.css +17 -6
  41. package/dist/minimal.css +73 -58
  42. package/dist/rokkit/avatar.css +1 -1
  43. package/dist/rokkit/badge.css +7 -7
  44. package/dist/rokkit/button.css +9 -9
  45. package/dist/rokkit/card.css +4 -4
  46. package/dist/rokkit/divider.css +1 -1
  47. package/dist/rokkit/dropdown.css +2 -2
  48. package/dist/rokkit/list.css +5 -5
  49. package/dist/rokkit/menu.css +5 -5
  50. package/dist/rokkit/select.css +24 -13
  51. package/dist/rokkit/table.css +5 -5
  52. package/dist/rokkit/tabs.css +1 -1
  53. package/dist/rokkit/timeline.css +4 -3
  54. package/dist/rokkit/toggle.css +4 -4
  55. package/dist/rokkit/tree.css +17 -6
  56. package/dist/rokkit.css +89 -66
  57. package/dist/zen-sumi/button.css +20 -12
  58. package/dist/zen-sumi/card.css +4 -4
  59. package/dist/zen-sumi/divider.css +29 -0
  60. package/dist/zen-sumi/dropdown.css +4 -4
  61. package/dist/zen-sumi/list.css +9 -9
  62. package/dist/zen-sumi/menu.css +9 -9
  63. package/dist/zen-sumi/select.css +11 -11
  64. package/dist/zen-sumi/table.css +6 -6
  65. package/dist/zen-sumi/tabs.css +3 -3
  66. package/dist/zen-sumi/timeline.css +3 -3
  67. package/dist/zen-sumi/toggle.css +6 -5
  68. package/dist/zen-sumi/tree.css +19 -8
  69. package/dist/zen-sumi.css +124 -74
  70. package/package.json +3 -3
  71. package/src/base/stepper.css +11 -5
  72. package/src/base/table.css +4 -1
  73. package/src/base/toggle.css +5 -0
  74. package/src/frosted/dropdown.css +2 -2
  75. package/src/frosted/list.css +5 -5
  76. package/src/frosted/menu.css +5 -5
  77. package/src/frosted/message.css +4 -4
  78. package/src/frosted/select.css +8 -8
  79. package/src/frosted/table.css +5 -5
  80. package/src/frosted/tabs.css +2 -2
  81. package/src/frosted/timeline.css +1 -1
  82. package/src/frosted/toggle.css +4 -4
  83. package/src/frosted/tree.css +15 -4
  84. package/src/material/button.css +8 -4
  85. package/src/material/dropdown.css +2 -2
  86. package/src/material/list.css +5 -5
  87. package/src/material/menu.css +5 -5
  88. package/src/material/select.css +8 -8
  89. package/src/material/table.css +5 -5
  90. package/src/material/tabs.css +4 -3
  91. package/src/material/timeline.css +4 -3
  92. package/src/material/toggle.css +6 -5
  93. package/src/material/tree.css +15 -4
  94. package/src/minimal/button.css +8 -4
  95. package/src/minimal/dropdown.css +2 -2
  96. package/src/minimal/list.css +8 -8
  97. package/src/minimal/menu.css +6 -6
  98. package/src/minimal/select.css +8 -8
  99. package/src/minimal/table.css +5 -5
  100. package/src/minimal/tabs.css +2 -2
  101. package/src/minimal/timeline.css +3 -3
  102. package/src/minimal/toggle.css +4 -4
  103. package/src/minimal/tree.css +17 -6
  104. package/src/rokkit/avatar.css +1 -1
  105. package/src/rokkit/badge.css +1 -1
  106. package/src/rokkit/button.css +1 -1
  107. package/src/rokkit/divider.css +1 -1
  108. package/src/rokkit/dropdown.css +2 -2
  109. package/src/rokkit/list.css +5 -5
  110. package/src/rokkit/menu.css +5 -5
  111. package/src/rokkit/select.css +24 -13
  112. package/src/rokkit/table.css +5 -5
  113. package/src/rokkit/tabs.css +1 -1
  114. package/src/rokkit/timeline.css +4 -3
  115. package/src/rokkit/toggle.css +4 -4
  116. package/src/rokkit/tree.css +17 -6
  117. package/src/zen-sumi/button.css +16 -8
  118. package/src/zen-sumi/divider.css +29 -0
  119. package/src/zen-sumi/dropdown.css +4 -4
  120. package/src/zen-sumi/index.css +1 -0
  121. package/src/zen-sumi/list.css +9 -9
  122. package/src/zen-sumi/menu.css +9 -9
  123. package/src/zen-sumi/select.css +11 -11
  124. package/src/zen-sumi/table.css +6 -6
  125. package/src/zen-sumi/tabs.css +3 -3
  126. package/src/zen-sumi/timeline.css +3 -3
  127. package/src/zen-sumi/toggle.css +6 -5
  128. package/src/zen-sumi/tree.css +19 -8
package/dist/material/button.css CHANGED
@@ -17,23 +17,27 @@
17
17
 
18
18
  [data-style='material'] [data-button][data-style='default'][data-variant='primary'],
19
19
  [data-style='material'] [data-button]:not([data-style])[data-variant='primary'] {
20
- background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--primary);color:var(--on-primary);
20
+ background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);color:var(--on-primary);
21
+ background-color: var(--primary);
21
22
  }
22
23
 
23
24
  [data-style='material'] [data-button][data-style='default'][data-variant='secondary'],
24
25
  [data-style='material'] [data-button]:not([data-style])[data-variant='secondary'] {
25
- background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--accent);color:var(--on-primary);
26
+ background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);color:var(--on-primary);
27
+ background-color: var(--accent);
26
28
  }
27
29
 
28
30
  [data-style='material'] [data-button][data-style='default'][data-variant='accent'],
29
31
  [data-style='material'] [data-button]:not([data-style])[data-variant='accent'] {
30
- background-image:none;--un-text-opacity:1;color:color-mix(in srgb, var(--color-accent-50) calc(var(--un-text-opacity) * 100%), transparent);--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--accent);
31
- }[data-mode="dark"][data-style="material"] [data-button][data-style="default"][data-variant="accent"],[data-mode="dark"] [data-style="material"] [data-button][data-style="default"][data-variant="accent"],[data-mode="dark"][data-style="material"] [data-button]:not([data-style])[data-variant="accent"],[data-mode="dark"] [data-style="material"] [data-button]:not([data-style])[data-variant="accent"]{--un-text-opacity:1;color:color-mix(in srgb, var(--color-accent-50) calc(var(--un-text-opacity) * 100%), transparent);}
32
+ background-image:none;--un-text-opacity:1;color:rgb(22 22 22 / var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
33
+ background-color: var(--accent);
34
+ }
32
35
 
33
36
  [data-style='material'] [data-button][data-style='default'][data-variant='danger'],
34
37
  [data-style='material'] [data-button]:not([data-style])[data-variant='danger'] {
35
- background-image:none;--un-text-opacity:1;color:color-mix(in srgb, var(--color-danger-50) calc(var(--un-text-opacity) * 100%), transparent);--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--danger);
36
- }[data-mode="dark"][data-style="material"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"] [data-style="material"] [data-button][data-style="default"][data-variant="danger"],[data-mode="dark"][data-style="material"] [data-button]:not([data-style])[data-variant="danger"],[data-mode="dark"] [data-style="material"] [data-button]:not([data-style])[data-variant="danger"]{--un-text-opacity:1;color:color-mix(in srgb, var(--color-danger-50) calc(var(--un-text-opacity) * 100%), transparent);}
38
+ background-image:none;--un-text-opacity:1;color:rgb(22 22 22 / var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
39
+ background-color: var(--danger);
40
+ }
37
41
 
38
42
  /* =============================================================================
39
43
  Outline Style
@@ -107,12 +111,12 @@
107
111
  }
108
112
 
109
113
  [data-style='material'] [data-button][data-style='gradient'][data-variant='accent'] {
110
- --un-gradient-from-position:0%;--un-gradient-from:color-mix(in srgb, var(--color-accent) calc(1 * 100%), transparent) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:color-mix(in srgb, var(--color-accent) calc(1 * 100%), transparent) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:color-mix(in srgb, var(--color-accent-50) calc(var(--un-text-opacity) * 100%), transparent);--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
111
- }[data-mode="dark"][data-style="material"] [data-button][data-style="gradient"][data-variant="accent"],[data-mode="dark"] [data-style="material"] [data-button][data-style="gradient"][data-variant="accent"]{--un-text-opacity:1;color:color-mix(in srgb, var(--color-accent-50) calc(var(--un-text-opacity) * 100%), transparent);}
114
+ --un-gradient-from-position:0%;--un-gradient-from:color-mix(in srgb, var(--color-accent) calc(1 * 100%), transparent) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:color-mix(in srgb, var(--color-accent) calc(1 * 100%), transparent) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgb(22 22 22 / var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
115
+ }
112
116
 
113
117
  [data-style='material'] [data-button][data-style='gradient'][data-variant='danger'] {
114
- --un-gradient-from-position:0%;--un-gradient-from:color-mix(in srgb, var(--color-danger) calc(1 * 100%), transparent) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:color-mix(in srgb, var(--color-danger) calc(1 * 100%), transparent) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:color-mix(in srgb, var(--color-danger-50) calc(var(--un-text-opacity) * 100%), transparent);--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
115
- }[data-mode="dark"][data-style="material"] [data-button][data-style="gradient"][data-variant="danger"],[data-mode="dark"] [data-style="material"] [data-button][data-style="gradient"][data-variant="danger"]{--un-text-opacity:1;color:color-mix(in srgb, var(--color-danger-50) calc(var(--un-text-opacity) * 100%), transparent);}
118
+ --un-gradient-from-position:0%;--un-gradient-from:color-mix(in srgb, var(--color-danger) calc(1 * 100%), transparent) var(--un-gradient-from-position);--un-gradient-to-position:100%;--un-gradient-to:rgb(255 255 255 / 0) var(--un-gradient-to-position);--un-gradient-stops:var(--un-gradient-from), var(--un-gradient-to);--un-gradient-to-position:100%;--un-gradient-to:color-mix(in srgb, var(--color-danger) calc(1 * 100%), transparent) var(--un-gradient-to-position);--un-gradient-shape:to bottom right in oklch;--un-gradient:var(--un-gradient-shape), var(--un-gradient-stops);background-image:linear-gradient(var(--un-gradient));--un-text-opacity:1;color:rgb(22 22 22 / var(--un-text-opacity));--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);
119
+ }
116
120
 
117
121
  [data-style='material']
118
122
  [data-button][data-style='gradient']:hover:not(:disabled):not([data-disabled]) {
package/dist/material/dropdown.css CHANGED
@@ -21,11 +21,11 @@
21
21
  }
22
22
 
23
23
  [data-style='material'] [data-dropdown-trigger] [data-dropdown-icon] {
24
- color:var(--ink-soft);
24
+ color:var(--ink-mute);
25
25
  }
26
26
 
27
27
  [data-style='material'] [data-dropdown-trigger] [data-dropdown-arrow] {
28
- color:var(--ink-soft);
28
+ color:var(--ink-mute);
29
29
  }
30
30
 
31
31
  [data-style='material'] [data-dropdown-panel] {
package/dist/material/list.css CHANGED
@@ -56,7 +56,7 @@
56
56
  ============================================================================= */
57
57
 
58
58
  [data-style='material'] [data-list] [data-list-item] [data-item-icon] {
59
- color:var(--ink-soft);
59
+ color:var(--ink-mute);
60
60
  }
61
61
 
62
62
  [data-style='material'] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon],
@@ -70,7 +70,7 @@
70
70
 
71
71
  /* Literal / kanji icons */
72
72
  [data-style='material'] [data-list] [data-list-item] [data-item-icon-literal] {
73
- color:var(--ink-soft);
73
+ color:var(--ink-mute);
74
74
  }
75
75
 
76
76
  [data-style='material'] [data-list] [data-list-item]:hover:not(:disabled) [data-item-icon-literal],
@@ -83,7 +83,7 @@
83
83
  }
84
84
 
85
85
  [data-style='material'] [data-list] [data-list-item] [data-item-description] {
86
- color:var(--ink-soft);
86
+ color:var(--ink-mute);
87
87
  }
88
88
 
89
89
  [data-style='material'] [data-list] [data-list-item][data-active='true'] [data-item-description] {
@@ -91,7 +91,7 @@
91
91
  }
92
92
 
93
93
  [data-style='material'] [data-list] [data-list-item] [data-item-badge] {
94
- border-radius:9999px;background-image:none;background-color:var(--paper-mute);color:var(--ink-soft);
94
+ border-radius:9999px;background-image:none;background-color:var(--paper-mute);color:var(--ink-mute);
95
95
  }
96
96
 
97
97
  [data-style='material'] [data-list] [data-list-item][data-active='true'] [data-item-badge] {
@@ -103,7 +103,7 @@
103
103
  ============================================================================= */
104
104
 
105
105
  [data-style='material'] [data-list] [data-list-group] {
106
- font-weight:500;color:var(--ink-soft);
106
+ font-weight:500;color:var(--ink-mute);
107
107
  }
108
108
 
109
109
  [data-style='material'] [data-list] [data-list-group]:hover:not(:disabled),
package/dist/material/menu.css CHANGED
@@ -26,7 +26,7 @@
26
26
 
27
27
  /* Trigger elements */
28
28
  [data-style='material'] [data-menu-trigger] [data-menu-icon] {
29
- color:var(--ink-soft);
29
+ color:var(--ink-mute);
30
30
  }
31
31
 
32
32
  [data-style='material'] [data-menu-trigger]:hover:not(:disabled) [data-menu-icon] {
@@ -34,7 +34,7 @@
34
34
  }
35
35
 
36
36
  [data-style='material'] [data-menu-trigger] [data-menu-arrow] {
37
- color:var(--ink-soft);
37
+ color:var(--ink-mute);
38
38
  }
39
39
 
40
40
  /* =============================================================================
@@ -64,7 +64,7 @@
64
64
 
65
65
  /* Item elements */
66
66
  [data-style='material'] [data-menu-item] [data-item-icon] {
67
- color:var(--ink-soft);
67
+ color:var(--ink-mute);
68
68
  }
69
69
 
70
70
  [data-style='material'] [data-menu-item]:hover:not(:disabled) [data-item-icon] {
@@ -72,7 +72,7 @@
72
72
  }
73
73
 
74
74
  [data-style='material'] [data-menu-item] [data-item-description] {
75
- color:var(--ink-soft);
75
+ color:var(--ink-mute);
76
76
  }
77
77
 
78
78
  /* =============================================================================
@@ -80,7 +80,7 @@
80
80
  ============================================================================= */
81
81
 
82
82
  [data-style='material'] [data-menu-group] {
83
- font-weight:500;color:var(--ink-soft);
83
+ font-weight:500;color:var(--ink-mute);
84
84
  }
85
85
 
86
86
  /* =============================================================================
package/dist/material/select.css CHANGED
@@ -29,7 +29,7 @@
29
29
  ============================================================================= */
30
30
 
31
31
  [data-style='material'] [data-select-placeholder] {
32
- color:var(--ink-soft);
32
+ color:var(--ink-mute);
33
33
  }
34
34
 
35
35
  /* =============================================================================
@@ -37,7 +37,7 @@
37
37
  ============================================================================= */
38
38
 
39
39
  [data-style='material'] [data-select-arrow] {
40
- color:var(--ink-soft);
40
+ color:var(--ink-mute);
41
41
  }
42
42
 
43
43
  [data-style='material'] [data-select-trigger]:hover:not(:disabled) [data-select-arrow] {
@@ -53,7 +53,7 @@
53
53
  }
54
54
 
55
55
  [data-style='material'] [data-select-tag-remove] {
56
- border-radius:9999px;color:var(--ink-soft);
56
+ border-radius:9999px;color:var(--ink-mute);
57
57
  }
58
58
 
59
59
  [data-style='material'] [data-select-tag-remove]:hover {
@@ -117,7 +117,7 @@
117
117
 
118
118
  /* Item elements */
119
119
  [data-style='material'] [data-select-option] [data-item-icon] {
120
- color:var(--ink-soft);
120
+ color:var(--ink-mute);
121
121
  }
122
122
 
123
123
  [data-style='material'] [data-select-option]:hover:not(:disabled) [data-item-icon] {
@@ -129,7 +129,7 @@
129
129
  }
130
130
 
131
131
  [data-style='material'] [data-select-option] [data-item-description] {
132
- color:var(--ink-soft);
132
+ color:var(--ink-mute);
133
133
  }
134
134
 
135
135
  [data-style='material'] [data-select-option][data-selected='true'] [data-item-description] {
@@ -141,7 +141,7 @@
141
141
  ============================================================================= */
142
142
 
143
143
  [data-style='material'] [data-select-group-label] {
144
- font-weight:500;color:var(--ink-soft);
144
+ font-weight:500;color:var(--ink-mute);
145
145
  }
146
146
 
147
147
  /* =============================================================================
@@ -169,9 +169,9 @@
169
169
  }
170
170
 
171
171
  [data-style='material'] [data-select-filter-input]::placeholder {
172
- color:var(--ink-soft);
172
+ color:var(--ink-mute);
173
173
  }
174
174
 
175
175
  [data-style='material'] [data-select-empty] {
176
- color:var(--ink-soft);
176
+ color:var(--ink-mute);
177
177
  }
package/dist/material/table.css CHANGED
@@ -9,7 +9,7 @@
9
9
  ============================================================================= */
10
10
 
11
11
  [data-style='material'] [data-table-header] th {
12
- border-bottom-width:1px;font-weight:500;color:var(--ink-soft);background-color:var(--paper-mute);border-color:var(--paper-edge);
12
+ border-bottom-width:1px;font-weight:500;color:var(--ink-mute);background-color:var(--paper-mute);border-color:var(--paper-edge);
13
13
  }
14
14
 
15
15
  [data-style='material'] [data-table-header-cell][data-sortable='true']:hover {
@@ -22,7 +22,7 @@
22
22
  }
23
23
 
24
24
  [data-style='material'] [data-table-sort-icon] {
25
- color:var(--ink-soft);
25
+ color:var(--ink-mute);
26
26
  }
27
27
 
28
28
  [data-style='material']
@@ -85,7 +85,7 @@
85
85
  ============================================================================= */
86
86
 
87
87
  [data-style='material'] [data-table-empty] {
88
- color:var(--ink-soft);
88
+ color:var(--ink-mute);
89
89
  }
90
90
 
91
91
  /* =============================================================================
@@ -93,7 +93,7 @@
93
93
  ============================================================================= */
94
94
 
95
95
  [data-style='material'] [data-table-cell] [data-cell-icon] {
96
- color:var(--ink-soft);
96
+ color:var(--ink-mute);
97
97
  }
98
98
 
99
99
  [data-style='material'] [data-table-row][data-selected='true'] [data-cell-icon] {
@@ -110,7 +110,7 @@
110
110
  }
111
111
 
112
112
  [data-style='material'] [data-table-responsive] [data-table-cell]::before {
113
- color:var(--ink-soft);
113
+ color:var(--ink-mute);
114
114
  }
115
115
 
116
116
  /* Disable striped alternating bg in card layout */
package/dist/material/tabs.css CHANGED
@@ -21,7 +21,7 @@
21
21
  ============================================================================= */
22
22
 
23
23
  [data-style='material'] [data-tabs-trigger] {
24
- border-top-left-radius:0.5rem;border-top-right-radius:0.5rem;background-color:transparent;color:var(--ink-soft);
24
+ border-top-left-radius:0.5rem;border-top-right-radius:0.5rem;background-color:transparent;color:var(--ink-mute);
25
25
  }
26
26
 
27
27
  [data-style='material'] [data-tabs][data-position='after'] [data-tabs-trigger] {
@@ -34,7 +34,8 @@
34
34
 
35
35
  /* Selected state */
36
36
  [data-style='material'] [data-tabs-trigger][data-selected] {
37
- --un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--primary);color:var(--on-primary);
37
+ --un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);color:var(--on-primary);
38
+ background-color: var(--primary);
38
39
  }
39
40
 
40
41
  /* Reset rokkit gradients bleeding in from body[data-style='rokkit'] ancestor */
@@ -68,7 +69,7 @@
68
69
  ============================================================================= */
69
70
 
70
71
  [data-style='material'] [data-tabs-trigger] [data-tabs-icon] {
71
- color:var(--ink-soft);
72
+ color:var(--ink-mute);
72
73
  }
73
74
 
74
75
  [data-style='material'] [data-tabs-trigger]:hover:not(:disabled) [data-tabs-icon] {
package/dist/material/timeline.css CHANGED
@@ -13,11 +13,12 @@
13
13
  }
14
14
 
15
15
  [data-style='material'] [data-timeline-item][data-completed] [data-timeline-circle] {
16
- --un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--primary);border-color:var(--primary);color:var(--on-primary);
16
+ --un-shadow:var(--un-shadow-inset) 0 1px 2px 0 var(--un-shadow-color, rgb(0 0 0 / 0.05));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);border-color:var(--primary);color:var(--on-primary);
17
+ background-color: var(--primary);
17
18
  }
18
19
 
19
20
  [data-style='material'] [data-timeline-item][data-active] [data-timeline-circle] {
20
- --un-ring-width:3px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:color-mix(in srgb, var(--color-primary) calc(0.25 * 100%), transparent);border-color:var(--primary);color:var(--primary);
21
+ --un-ring-width:3px;--un-ring-offset-shadow:var(--un-ring-inset) 0 0 0 var(--un-ring-offset-width) var(--un-ring-offset-color);--un-ring-shadow:var(--un-ring-inset) 0 0 0 calc(var(--un-ring-width) + var(--un-ring-offset-width)) var(--un-ring-color);box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);--un-ring-color:color-mix(in srgb, var(--color-primary) calc(0.25 * 100%), transparent);border-color:var(--primary);color:var(--ink);
21
22
  }
22
23
 
23
24
  /* =============================================================================
@@ -29,7 +30,7 @@
29
30
  }
30
31
 
31
32
  [data-style='material'] [data-timeline-item][data-completed] [data-timeline-connector] {
32
- background-color:var(--primary);
33
+ background-color: var(--primary);
33
34
  }
34
35
 
35
36
  /* =============================================================================
package/dist/material/toggle.css CHANGED
@@ -17,7 +17,7 @@
17
17
  ============================================================================= */
18
18
 
19
19
  [data-style='material'] [data-toggle-option] {
20
- border-radius:9999px;color:var(--ink-soft);
20
+ border-radius:9999px;color:var(--ink-mute);
21
21
  }
22
22
 
23
23
  [data-style='material'] [data-toggle-option]:hover:not(:disabled):not([data-disabled='true']),
@@ -27,7 +27,8 @@
27
27
 
28
28
  /* Selected state */
29
29
  [data-style='material'] [data-toggle-option][data-selected='true'] {
30
- background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);background-color:var(--primary);color:var(--on-primary);
30
+ background-image:none;--un-shadow:var(--un-shadow-inset) 0 4px 6px -1px var(--un-shadow-color, rgb(0 0 0 / 0.1)),var(--un-shadow-inset) 0 2px 4px -2px var(--un-shadow-color, rgb(0 0 0 / 0.1));box-shadow:var(--un-ring-offset-shadow), var(--un-ring-shadow), var(--un-shadow);color:var(--on-primary);
31
+ background-color: var(--primary);
31
32
  }
32
33
 
33
34
  /* =============================================================================
@@ -35,7 +36,7 @@
35
36
  ============================================================================= */
36
37
 
37
38
  [data-style='material'] [data-toggle-option] [data-toggle-icon] {
38
- color:var(--ink-soft);
39
+ color:var(--ink-mute);
39
40
  }
40
41
 
41
42
  [data-style='material'] [data-toggle-option]:hover:not(:disabled) [data-toggle-icon],
@@ -55,7 +56,7 @@
55
56
  ============================================================================= */
56
57
 
57
58
  [data-style='material'] [data-toggle][data-toggle-variant='button'] {
58
- border-color:transparent;background-color:transparent;color:var(--ink-soft);
59
+ border-color:transparent;background-color:transparent;color:var(--ink-mute);
59
60
  background-image: none;
60
61
  }
61
62
 
@@ -65,7 +66,7 @@
65
66
  }
66
67
 
67
68
  [data-style='material'] [data-toggle][data-toggle-variant='button'] [data-toggle-icon] {
68
- color:var(--ink-soft);
69
+ color:var(--ink-mute);
69
70
  }
70
71
 
71
72
  [data-style='material'] [data-toggle][data-toggle-variant='button']:hover:not(:disabled) [data-toggle-icon],
package/dist/material/tree.css CHANGED
@@ -4,6 +4,17 @@
4
4
  * Material Design inspired with subtle elevation.
5
5
  */
6
6
 
7
+ /* =============================================================================
8
+ Connector Lines — hairline tone (mode-aware), not currentColor (which
9
+ renders white in dark mode and greyish in light).
10
+ ============================================================================= */
11
+
12
+ [data-style='material'] [data-tree]:not([data-line-style='none']) [data-connector-v],
13
+ [data-style='material'] [data-tree]:not([data-line-style='none']) [data-connector-h],
14
+ [data-style='material'] [data-tree]:not([data-line-style='none']) [data-connector-corner] {
15
+ border-color:var(--paper-edge);
16
+ }
17
+
7
18
  /* =============================================================================
8
19
  Tree Container
9
20
  ============================================================================= */
@@ -17,7 +28,7 @@
17
28
  ============================================================================= */
18
29
 
19
30
  [data-style='material'] [data-tree-toggle-btn] {
20
- border-radius:9999px;color:var(--ink-soft);
31
+ border-radius:9999px;color:var(--ink-mute);
21
32
  }
22
33
 
23
34
  [data-style='material'] [data-tree-toggle-btn]:hover {
@@ -73,7 +84,7 @@
73
84
  ============================================================================= */
74
85
 
75
86
  [data-style='material'] [data-tree-item-content] [data-item-icon] {
76
- color:var(--ink-soft);
87
+ color:var(--ink-mute);
77
88
  }
78
89
 
79
90
  [data-style='material'] [data-tree-item-content]:hover:not(:disabled) [data-item-icon] {
@@ -85,7 +96,7 @@
85
96
  }
86
97
 
87
98
  [data-style='material'] [data-tree-item-content] [data-item-description] {
88
- color:var(--ink-soft);
99
+ color:var(--ink-mute);
89
100
  }
90
101
 
91
102
  [data-style='material'] [data-tree-item-content][data-active='true'] [data-item-description] {
@@ -93,7 +104,7 @@
93
104
  }
94
105
 
95
106
  [data-style='material'] [data-tree-item-content] [data-item-badge] {
96
- border-radius:9999px;background-image:none;color:var(--ink-soft);background-color:var(--paper-mute);
107
+ border-radius:9999px;background-image:none;color:var(--ink-mute);background-color:var(--paper-mute);
97
108
  }
98
109
 
99
110
  [data-style='material'] [data-tree-item-content][data-active='true'] [data-item-badge] {