@officesdk/design 0.1.9 → 0.1.10

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.
@@ -1473,9 +1473,9 @@ var Track = exports.styled.div`
1473
1473
  var Thumb = exports.styled.div`
1474
1474
  position: absolute;
1475
1475
  top: 50%;
1476
- transform: translateY(-50%);
1477
1476
  border-style: solid;
1478
1477
  box-sizing: border-box;
1478
+ left: 0;
1479
1479
  transition: ${({ theme: theme3 }) => theme3.components.switch.transition || "all 0.2s ease"};
1480
1480
 
1481
1481
  ${({ $size, $checked, theme: theme3 }) => {
@@ -1484,12 +1484,17 @@ var Thumb = exports.styled.div`
1484
1484
  const thumbOffset = sizeConfig.thumb.offset;
1485
1485
  const thumbBorderRadius = sizeConfig.thumb.borderRadius;
1486
1486
  const thumbBorderWidth = sizeConfig.thumb.borderWidth;
1487
+ const trackWidth = sizeConfig.container.width;
1488
+ const thumbSizeNum = parseFloat(thumbSize);
1489
+ const offsetNum = parseFloat(thumbOffset);
1490
+ const trackWidthNum = parseFloat(trackWidth);
1491
+ const leftPosition = $checked ? `${trackWidthNum - thumbSizeNum - offsetNum}px` : thumbOffset;
1487
1492
  return `
1488
1493
  width: ${thumbSize};
1489
1494
  height: ${thumbSize};
1490
1495
  border-radius: ${thumbBorderRadius};
1491
1496
  border-width: ${thumbBorderWidth};
1492
- ${$checked ? "right" : "left"}: ${thumbOffset};
1497
+ transform: translate(${leftPosition}, -50%);
1493
1498
  `;
1494
1499
  }}
1495
1500