fix(components): rtl styles in toggle (#2392)

* fix(components): rtl styles in toggle * chore(root): add changeset for switcher rtl issue
heroui-inc · Feb 27, 2024 · 37bed23 · 37bed23
1 parent 755a835
commit 37bed23
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/.changeset/mighty-ladybugs-joke.md b/.changeset/mighty-ladybugs-joke.md
@@ -0,0 +1,5 @@
+---
+"@nextui-org/theme": patch
+---
+
+fixed incorrect RTL behaviour in toggle (#2266)
diff --git a/packages/core/theme/src/components/toggle.ts b/packages/core/theme/src/components/toggle.ts
@@ -104,7 +104,7 @@ const toggle = tv({
         thumb: [
           "w-4 h-4 text-tiny",
           //selected
-          "group-data-[selected=true]:ml-4",
+          "group-data-[selected=true]:ml-4 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-4",
         ],
         endContent: "text-tiny",
         startContent: "text-tiny",
@@ -115,7 +115,7 @@ const toggle = tv({
         thumb: [
           "w-5 h-5 text-small",
           //selected
-          "group-data-[selected=true]:ml-5",
+          "group-data-[selected=true]:ml-5 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-5",
         ],
         endContent: "text-small",
         startContent: "text-small",
@@ -126,7 +126,7 @@ const toggle = tv({
         thumb: [
           "w-6 h-6 text-medium",
           //selected
-          "group-data-[selected=true]:ml-6",
+          "group-data-[selected=true]:ml-6 rtl:group-data-[selected=true]:ml-0 rtl:group-data-[selected=true]:mr-6",
         ],
         endContent: "text-medium",
         startContent: "text-medium",