|
62 | 62 | } |
63 | 63 |
|
64 | 64 | $theme: digest-schema($tree-schema); |
65 | | - $meta: map.get($theme, '_meta'); |
66 | 65 |
|
67 | 66 | @if not($foreground) and $background { |
68 | | - $foreground: text-contrast($background); |
| 67 | + $foreground: adaptive-contrast(var(--background)); |
| 68 | + } |
| 69 | + |
| 70 | + @if not($background-selected) and $background { |
| 71 | + $background-selected: hsl(from var(--background) h s calc(l * 0.9)); |
| 72 | + } |
| 73 | + |
| 74 | + @if not($hover-color) and $background { |
| 75 | + $hover-color: hsla(from adaptive-contrast(var(--background)) h s l / 0.1); |
| 76 | + } |
| 77 | + |
| 78 | + @if not($hover-selected-color) and $background-selected { |
| 79 | + $hover-selected-color: hsl(from var(--background-selected) h s calc(l * 0.9)); |
69 | 80 | } |
70 | 81 |
|
71 | 82 | @if not($foreground-selected) and $background-selected { |
72 | | - $foreground-selected: text-contrast($background-selected); |
| 83 | + $foreground-selected: adaptive-contrast(var(--background-selected)); |
| 84 | + } |
| 85 | + |
| 86 | + @if not($background-active) and $background { |
| 87 | + $background-active: hsl(from var(--background) h s calc(l * 0.9)); |
73 | 88 | } |
74 | 89 |
|
75 | 90 | @if not($foreground-active) and $background-active { |
76 | | - $foreground-active: text-contrast($background-active); |
| 91 | + $foreground-active: adaptive-contrast(var(--background-active)); |
| 92 | + } |
| 93 | + |
| 94 | + @if not($background-active-selected) and $background-active { |
| 95 | + $background-active-selected: hsl(from var(--background-active) h s calc(l * 0.9)); |
77 | 96 | } |
78 | 97 |
|
79 | 98 | @if not($foreground-active-selected) and $background-active-selected { |
80 | | - $foreground-active-selected: text-contrast($background-active-selected); |
| 99 | + $foreground-active-selected: adaptive-contrast(var(--background-active-selected)); |
| 100 | + } |
| 101 | + |
| 102 | + @if not($background-disabled) and $background { |
| 103 | + $background-disabled: color-mix(in hsl, var(--background), transparent 50%); |
| 104 | + } |
| 105 | + |
| 106 | + @if not($foreground-disabled) and $background-disabled { |
| 107 | + $foreground-disabled: adaptive-contrast(var(--background-disabled)); |
81 | 108 | } |
82 | 109 |
|
83 | 110 | @return extend($theme, ( |
|
98 | 125 | border-color: $border-color, |
99 | 126 | hover-color: $hover-color, |
100 | 127 | hover-selected-color: $hover-selected-color, |
101 | | - theme: map.get($schema, '_meta', 'theme'), |
102 | | - _meta: map.merge(if($meta, $meta, ()), ( |
103 | | - variant: map.get($schema, '_meta', 'theme') |
104 | | - )), |
105 | 128 | size: $size, |
106 | 129 | )); |
107 | 130 | } |
|
112 | 135 | @mixin tree($theme) { |
113 | 136 | @include css-vars($theme); |
114 | 137 |
|
115 | | - $variant: map.get($theme, '_meta', 'variant'); |
| 138 | + $variant: map.get($theme, '_meta', 'theme'); |
116 | 139 | $indigo-theme: $variant == 'indigo'; |
117 | 140 |
|
118 | 141 | $node-indent-default: ( |
|
0 commit comments