@oardi/css-utils 0.68.0 → 0.68.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
|
@@ -347,6 +347,10 @@
|
|
|
347
347
|
--form-switch-thumb-size: 1rem;
|
|
348
348
|
--form-switch-thumb-bg-color: var(--bg-surface);
|
|
349
349
|
--form-switch-thumb-box-shadow: var(--shadow-sm);
|
|
350
|
+
--form-switch-thumb-checked-translate-x: calc(
|
|
351
|
+
var(--form-switch-input-width) - var(--form-switch-thumb-size) -
|
|
352
|
+
(var(--form-switch-input-padding) * 2) - (var(--form-switch-input-border-width) * 2)
|
|
353
|
+
);
|
|
350
354
|
|
|
351
355
|
--form-switch-disabled-bg-color: var(--disabled-bg-color);
|
|
352
356
|
--form-switch-disabled-border-color: var(--disabled-border-color);
|
|
@@ -380,6 +384,13 @@
|
|
|
380
384
|
var(--form-switch-input-border-color);
|
|
381
385
|
border-radius: var(--form-switch-input-border-radius);
|
|
382
386
|
|
|
387
|
+
&:dir(rtl) {
|
|
388
|
+
--form-switch-thumb-checked-translate-x: calc(
|
|
389
|
+
var(--form-switch-thumb-size) + (var(--form-switch-input-padding) * 2) +
|
|
390
|
+
(var(--form-switch-input-border-width) * 2) - var(--form-switch-input-width)
|
|
391
|
+
);
|
|
392
|
+
}
|
|
393
|
+
|
|
383
394
|
transition:
|
|
384
395
|
background-color var(--form-switch-transition-duration)
|
|
385
396
|
var(--form-switch-transition-easing),
|
|
@@ -411,13 +422,7 @@
|
|
|
411
422
|
border-color: var(--form-switch-input-checked-border-color);
|
|
412
423
|
|
|
413
424
|
&::after {
|
|
414
|
-
transform: translateX(
|
|
415
|
-
calc(
|
|
416
|
-
var(--form-switch-input-width) - var(--form-switch-thumb-size) -
|
|
417
|
-
(var(--form-switch-input-padding) * 2) -
|
|
418
|
-
(var(--form-switch-input-border-width) * 2)
|
|
419
|
-
)
|
|
420
|
-
);
|
|
425
|
+
transform: translateX(var(--form-switch-thumb-checked-translate-x));
|
|
421
426
|
}
|
|
422
427
|
}
|
|
423
428
|
|
|
@@ -24,6 +24,7 @@
|
|
|
24
24
|
--table-active-color: var(--table-color);
|
|
25
25
|
|
|
26
26
|
--table-row-state-accent-width: 0.25rem;
|
|
27
|
+
--table-row-state-accent-offset-x: var(--table-row-state-accent-width);
|
|
27
28
|
|
|
28
29
|
--table-row-invalid-bg-color: rgba(var(--error-rgb), 0.08);
|
|
29
30
|
--table-row-invalid-hover-bg-color: rgba(var(--error-rgb), 0.12);
|
|
@@ -42,6 +43,10 @@
|
|
|
42
43
|
border-color: var(--table-border-color);
|
|
43
44
|
border-collapse: collapse;
|
|
44
45
|
|
|
46
|
+
&:dir(rtl) {
|
|
47
|
+
--table-row-state-accent-offset-x: calc(0rem - var(--table-row-state-accent-width));
|
|
48
|
+
}
|
|
49
|
+
|
|
45
50
|
& > thead {
|
|
46
51
|
vertical-align: bottom;
|
|
47
52
|
}
|
|
@@ -112,7 +117,7 @@
|
|
|
112
117
|
}
|
|
113
118
|
|
|
114
119
|
.table > tbody > tr.is-invalid > :first-child {
|
|
115
|
-
box-shadow: inset var(--table-row-state-accent-
|
|
120
|
+
box-shadow: inset var(--table-row-state-accent-offset-x) 0 0
|
|
116
121
|
var(--table-row-invalid-accent-color);
|
|
117
122
|
}
|
|
118
123
|
|
|
@@ -126,7 +131,7 @@
|
|
|
126
131
|
}
|
|
127
132
|
|
|
128
133
|
.table > tbody > tr.is-warning > :first-child {
|
|
129
|
-
box-shadow: inset var(--table-row-state-accent-
|
|
134
|
+
box-shadow: inset var(--table-row-state-accent-offset-x) 0 0
|
|
130
135
|
var(--table-row-warning-accent-color);
|
|
131
136
|
}
|
|
132
137
|
}
|