|
1 | | -@import "colors"; |
| 1 | +@use "colors"; |
2 | 2 |
|
3 | 3 | @mixin menubar { |
4 | 4 | [role="menubar"] { |
|
22 | 22 | } |
23 | 23 |
|
24 | 24 | &:not(.search-field):hover { |
25 | | - background-color: $selected-bg-color; |
| 25 | + background-color: colors.$selected-bg-color; |
26 | 26 | } |
27 | 27 |
|
28 | 28 | &[aria-selected="true"] { |
29 | | - background-color: $selected-row-color; |
| 29 | + background-color: colors.$selected-row-color; |
30 | 30 | } |
31 | 31 |
|
32 | 32 | &[aria-disabled="true"] { |
|
50 | 50 | display: block; |
51 | 51 | margin: 0; |
52 | 52 | padding: 2px 8px; |
53 | | - border: 1px solid $border-color; |
| 53 | + border: 1px solid colors.$border-color; |
54 | 54 | border-right: none; |
55 | 55 | border-top-left-radius: 5px; |
56 | 56 | border-bottom-left-radius: 5px; |
|
62 | 62 | & + div { |
63 | 63 | position: relative; |
64 | 64 | display: flex; |
65 | | - border: 1px solid $border-color; |
| 65 | + border: 1px solid colors.$border-color; |
66 | 66 | border-left: none; |
67 | 67 | border-top-right-radius: 5px; |
68 | 68 | border-bottom-right-radius: 5px; |
69 | 69 | padding: 0 5px 0 10px; |
70 | 70 |
|
71 | 71 | span { |
72 | | - color: $body-fg-color; |
| 72 | + color: colors.$body-fg-color; |
73 | 73 |
|
74 | 74 | &:hover { |
75 | | - background-color: $selected-bg-color; |
| 75 | + background-color: colors.$selected-bg-color; |
76 | 76 | } |
77 | 77 | } |
78 | 78 |
|
|
91 | 91 | } |
92 | 92 |
|
93 | 93 | &:not(:has(> input:placeholder-shown)) { |
94 | | - background-color: $selected-row-color; |
| 94 | + background-color: colors.$selected-row-color; |
95 | 95 | > input { |
96 | | - background-color: $selected-row-color; |
| 96 | + background-color: colors.$selected-row-color; |
97 | 97 | } |
98 | 98 | } |
99 | 99 |
|
100 | 100 | &:has(> input:focus-visible) { |
101 | | - box-shadow: $focus-visible-box-shadow; |
| 101 | + box-shadow: colors.$focus-visible-box-shadow; |
102 | 102 | } |
103 | 103 | } |
104 | 104 |
|
|
131 | 131 | } |
132 | 132 |
|
133 | 133 | &:has(input:checked) { |
134 | | - background-color: $selected-row-color; |
| 134 | + background-color: colors.$selected-row-color; |
135 | 135 | } |
136 | 136 | } |
137 | 137 |
|
|
157 | 157 | right: -250px; |
158 | 158 |
|
159 | 159 | svg { |
160 | | - color: $body-fg-color; |
| 160 | + color: colors.$body-fg-color; |
161 | 161 | } |
162 | 162 |
|
163 | 163 | svg + span { |
|
0 commit comments