@rogieking/figui3 1.7.4 → 1.7.6
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/components.css +9 -5
- package/package.json +1 -1
package/components.css
CHANGED
|
@@ -803,6 +803,7 @@ fig-button {
|
|
|
803
803
|
&[size="large"],
|
|
804
804
|
&[size="large"] > button {
|
|
805
805
|
height: var(--spacer-5);
|
|
806
|
+
padding: 0 var(--spacer-3);
|
|
806
807
|
}
|
|
807
808
|
|
|
808
809
|
&[size="large"][icon],
|
|
@@ -1552,14 +1553,15 @@ details {
|
|
|
1552
1553
|
fig-slider {
|
|
1553
1554
|
--slider-field-height: 1.5rem;
|
|
1554
1555
|
--slider-height: 1rem;
|
|
1556
|
+
--slider-handle-color: #fff;
|
|
1555
1557
|
--slider-thumb-size: var(--slider-height);
|
|
1556
1558
|
--slider-percent: calc(var(--slider-complete) * 100%);
|
|
1557
1559
|
--start-percent: calc(var(--default, 0) * 100%);
|
|
1558
1560
|
--slider-tick-size: calc(var(--slider-height) / 4);
|
|
1559
1561
|
--slider-handle-shadow: inset 0 0 0 calc(4px + 0.5rem * var(--unchanged))
|
|
1560
|
-
var(--
|
|
1562
|
+
var(--slider-handle-color),
|
|
1561
1563
|
inset 0 0 0 5px rgba(0, 0, 0, 0.1), var(--figma-elevation-200);
|
|
1562
|
-
--slider-handle-shadow-focus: inset 0 0 0 4px var(--
|
|
1564
|
+
--slider-handle-shadow-focus: inset 0 0 0 4px var(--slider-handle-color),
|
|
1563
1565
|
inset 0 0 0 5px rgba(0, 0, 0, 0.1), 0px 0 0 0.75px rgba(0, 0, 0, 0.1),
|
|
1564
1566
|
0px 1px 3px 0px rgba(0, 0, 0, 0.1), 0px 3px 8px 0px rgba(0, 0, 0, 0.1),
|
|
1565
1567
|
0px 0px 0.5px 0px rgba(0, 0, 0, 0.18),
|
|
@@ -1840,7 +1842,7 @@ fig-slider {
|
|
|
1840
1842
|
--handle-transition: none;
|
|
1841
1843
|
--slider-transition: none;
|
|
1842
1844
|
--slider-handle-shadow: inset 0 0 0 calc(6px + 0.5rem * var(--unchanged))
|
|
1843
|
-
var(--
|
|
1845
|
+
var(--slider-handle-color),
|
|
1844
1846
|
0 0 0 0.75px rgba(0, 0, 0, 0.075), inset 0 0 0 5px rgba(0, 0, 0, 0.1),
|
|
1845
1847
|
var(--figma-elevation-200);
|
|
1846
1848
|
|
|
@@ -2389,6 +2391,7 @@ fig-segmented-control {
|
|
|
2389
2391
|
|
|
2390
2392
|
fig-input-joystick {
|
|
2391
2393
|
--size: 1.5rem;
|
|
2394
|
+
--joystick-handle-color: #fff;
|
|
2392
2395
|
display: inline-flex;
|
|
2393
2396
|
gap: var(--spacer-2);
|
|
2394
2397
|
user-select: none;
|
|
@@ -2478,7 +2481,7 @@ fig-input-joystick {
|
|
|
2478
2481
|
z-index: 1;
|
|
2479
2482
|
width: 0.5rem;
|
|
2480
2483
|
height: 0.5rem;
|
|
2481
|
-
background: var(--
|
|
2484
|
+
background: var(--joystick-handle-color);
|
|
2482
2485
|
box-shadow: var(--handle-shadow);
|
|
2483
2486
|
border-radius: 50%;
|
|
2484
2487
|
transform: translate(-50%, -50%);
|
|
@@ -2487,6 +2490,7 @@ fig-input-joystick {
|
|
|
2487
2490
|
|
|
2488
2491
|
fig-input-angle {
|
|
2489
2492
|
--size: 1.5rem;
|
|
2493
|
+
--handle-color: #fff;
|
|
2490
2494
|
display: inline-flex;
|
|
2491
2495
|
gap: var(--spacer-2);
|
|
2492
2496
|
user-select: none;
|
|
@@ -2518,7 +2522,7 @@ fig-input-angle {
|
|
|
2518
2522
|
display: block;
|
|
2519
2523
|
width: 0.5rem;
|
|
2520
2524
|
height: 0.5rem;
|
|
2521
|
-
background: var(--
|
|
2525
|
+
background: var(--handle-color);
|
|
2522
2526
|
box-shadow: var(--handle-shadow);
|
|
2523
2527
|
border-radius: 50%;
|
|
2524
2528
|
}
|