@gitlab/ui 137.0.0 → 137.0.1
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/package.json
CHANGED
|
@@ -82,7 +82,9 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
82
82
|
@include gl-prefers-reduced-motion-transition;
|
|
83
83
|
|
|
84
84
|
@media (forced-colors: active) {
|
|
85
|
-
|
|
85
|
+
outline: 1px solid CanvasText !important; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
86
|
+
outline-offset: -1px;
|
|
87
|
+
transition: none;
|
|
86
88
|
}
|
|
87
89
|
|
|
88
90
|
&::selection,
|
|
@@ -136,6 +138,10 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
136
138
|
transition: transform $gl-transition-duration-medium $gl-easing-out-cubic;
|
|
137
139
|
@include gl-prefers-reduced-motion-transition;
|
|
138
140
|
|
|
141
|
+
@media (forced-colors: active) {
|
|
142
|
+
transition: none;
|
|
143
|
+
}
|
|
144
|
+
|
|
139
145
|
&::before {
|
|
140
146
|
content: "";
|
|
141
147
|
@apply gl-absolute;
|
|
@@ -147,6 +153,11 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
147
153
|
transform $gl-transition-duration-medium $gl-easing-out-cubic,
|
|
148
154
|
background-color $gl-transition-duration-medium $gl-easing-out-cubic;
|
|
149
155
|
@include gl-prefers-reduced-motion-transition;
|
|
156
|
+
|
|
157
|
+
@media (forced-colors: active) {
|
|
158
|
+
background-color: CanvasText; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
159
|
+
transition: none;
|
|
160
|
+
}
|
|
150
161
|
}
|
|
151
162
|
|
|
152
163
|
> svg {
|
|
@@ -162,6 +173,7 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
162
173
|
display: none;
|
|
163
174
|
|
|
164
175
|
@media (forced-colors: active) {
|
|
176
|
+
color: Canvas; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
165
177
|
display: block;
|
|
166
178
|
}
|
|
167
179
|
}
|
|
@@ -198,6 +210,14 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
198
210
|
);
|
|
199
211
|
}
|
|
200
212
|
|
|
213
|
+
@media (forced-colors: active) {
|
|
214
|
+
background-color: CanvasText !important; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
215
|
+
|
|
216
|
+
svg {
|
|
217
|
+
color: CanvasText; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
218
|
+
}
|
|
219
|
+
}
|
|
220
|
+
|
|
201
221
|
.toggle-icon {
|
|
202
222
|
transform: translateX($toggle-translate-width);
|
|
203
223
|
}
|
|
@@ -223,6 +243,10 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
223
243
|
|
|
224
244
|
.toggle-icon::before {
|
|
225
245
|
background-color: var(--gl-toggle-switch-background-color-unchecked-disabled);
|
|
246
|
+
|
|
247
|
+
@media (forced-colors: active) {
|
|
248
|
+
background-color: GrayText; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
249
|
+
}
|
|
226
250
|
}
|
|
227
251
|
|
|
228
252
|
&:hover .toggle-icon::before,
|
|
@@ -263,6 +287,10 @@ $toggle-height: 2.5 * $grid-size;
|
|
|
263
287
|
$important: true
|
|
264
288
|
);
|
|
265
289
|
}
|
|
290
|
+
|
|
291
|
+
@media (forced-colors: active) {
|
|
292
|
+
background-color: GrayText !important; // stylelint-disable-line scale-unlimited/declaration-strict-value
|
|
293
|
+
}
|
|
266
294
|
}
|
|
267
295
|
|
|
268
296
|
// A loading toggle renders a spinner in place of the thumb, so the track is
|