[FIX] Fixes toggle bug on the commands switchers (hedyorg#3819)

**Description** Fixes a bug where the commands switcher toggle would be stuck in the middle. **Fixes** This PR fixes hedyorg#3818. **How to test** Verify that the commands switcher again works as expected.
jl200589 · Dec 9, 2022 · 648d840 · 648d840
1 parent b7078a2
commit 648d840
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 9 deletions.
diff --git a/build-tools/heroku/tailwind/styles.css b/build-tools/heroku/tailwind/styles.css
@@ -512,22 +512,25 @@ p.close-dialog {
   transition: all 0.5s ease-in-out;
 }
 
-body[dir='rtl'] input:checked ~ .toggle-circle {
-  transform: translateX(-200%);
-}
-
 body[dir='ltr'] input:checked ~ .toggle-circle {
-  transform: translateX(200%);
+  transform: translateX(100%);
+  @apply bg-green-400;
 }
 
 body[dir='rtl'] input:checked ~ .toggle-circle {
   transform: translateX(-100%);
   @apply bg-green-400;
 }
 
-body[dir='ltr'] input:checked ~ .toggle-circle {
-  transform: translateX(100%);
-  @apply bg-green-400;
+/* For the keyword toggle we have to move 200% instead of 100%, implement as edge case */
+body[dir='ltr'] #keyword_toggle_container input:checked ~ .toggle-circle {
+  transform: translateX(200%);
+  @apply bg-blue-500;
+}
+
+body[dir='rtl'] #keyword_toggle_container input:checked ~ .toggle-circle {
+  transform: translateX(-200%);
+  @apply bg-blue-500;
 }
 
 input:checked ~ .toggle-path {