From 05fdbc498154ee5163b58aad2bdd688dedbc8e88 Mon Sep 17 00:00:00 2001
From: Yosi Levy <yosilevy@gmail.com>
Date: Tue, 17 May 2022 15:25:56 +0300
Subject: [PATCH 1/2] RTL fixes

---
 src/components/ha-select.ts                        | 14 +++++++++++---
 src/components/ha-target-picker.ts                 |  3 ++-
 .../lovelace/components/hui-action-editor.ts       |  3 +++
 src/state/translations-mixin.ts                    |  4 ++++
 4 files changed, 20 insertions(+), 4 deletions(-)

diff --git a/src/components/ha-select.ts b/src/components/ha-select.ts
index f432bcb280d4..8ed23be29751 100644
--- a/src/components/ha-select.ts
+++ b/src/components/ha-select.ts
@@ -47,11 +47,19 @@ export class HaSelect extends SelectBase {
       .mdc-select__anchor {
         width: var(--ha-select-min-width, 200px);
       }
-      .mdc-floating-label {
-        inset-inline-start: 16px !important;
-        inset-inline-end: initial !important;
+      .mdc-select--filled .mdc-floating-label {
+        inset-inline-start: 12px;
+        inset-inline-end: initial;
         direction: var(--direction);
       }
+      .mdc-select .mdc-select__anchor {
+        padding-inline-start: 12px;
+        padding-inline-end: 0px;
+        direction: var(--direction);
+      }
+      .mdc-select__anchor .mdc-floating-label--float-above {
+        transform-origin: var(--float-start);
+      }
     `,
   ];
 }
diff --git a/src/components/ha-target-picker.ts b/src/components/ha-target-picker.ts
index adeba087227a..a7b1fa4d0241 100644
--- a/src/components/ha-target-picker.ts
+++ b/src/components/ha-target-picker.ts
@@ -616,7 +616,8 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
         opacity: var(--light-disabled-opacity);
         pointer-events: none;
       }
-      .mdc-chip__icon {
+      .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,
+      .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden) {
         margin-inline-start: -14px !important;
         margin-inline-end: 4px !important;
         direction: var(--direction);
diff --git a/src/panels/lovelace/components/hui-action-editor.ts b/src/panels/lovelace/components/hui-action-editor.ts
index f57a51f51ddb..3ec925e58f89 100644
--- a/src/panels/lovelace/components/hui-action-editor.ts
+++ b/src/panels/lovelace/components/hui-action-editor.ts
@@ -198,6 +198,9 @@ export class HuiActionEditor extends LitElement {
         position: absolute;
         right: 40px;
         top: 16px;
+        inset-inline-start: initial;
+        inset-inline-end: 40px;
+        direction: var(--direction);
       }
       ha-select,
       ha-textfield {
diff --git a/src/state/translations-mixin.ts b/src/state/translations-mixin.ts
index 8205817911d0..d4dcadf67fd9 100644
--- a/src/state/translations-mixin.ts
+++ b/src/state/translations-mixin.ts
@@ -191,6 +191,10 @@ export default <T extends Constructor<HassBaseEl>>(superClass: T) =>
       this.style.direction = direction;
       document.dir = direction;
       this.style.setProperty("--direction", direction);
+      this.style.setProperty(
+        "--float-start",
+        direction === "ltr" ? "left" : "right"
+      );
       this.style.setProperty(
         "--float-end",
         direction === "ltr" ? "right" : "left"

From e8d2946d4d63cc5c091ee6bbcd7e8e530327c3b1 Mon Sep 17 00:00:00 2001
From: Yosi Levy <yosilevy@gmail.com>
Date: Tue, 17 May 2022 15:37:59 +0300
Subject: [PATCH 2/2] Fixes 2

---
 src/components/ha-target-picker.ts | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/src/components/ha-target-picker.ts b/src/components/ha-target-picker.ts
index a7b1fa4d0241..1453afa07bc7 100644
--- a/src/components/ha-target-picker.ts
+++ b/src/components/ha-target-picker.ts
@@ -569,6 +569,9 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
         height: 16px;
         --mdc-icon-size: 14px;
         color: var(--secondary-text-color);
+        margin-inline-start: 4px !important;
+        margin-inline-end: -4px !important;
+        direction: var(--direction);
       }
       .mdc-chip__icon--leading {
         display: flex;
@@ -578,6 +581,9 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
         border-radius: 50%;
         padding: 6px;
         margin-left: -14px !important;
+        margin-inline-start: -14px !important;
+        margin-inline-end: 4px !important;
+        direction: var(--direction);
       }
       .expand-btn {
         margin-right: 0;
@@ -616,12 +622,6 @@ export class HaTargetPicker extends SubscribeMixin(LitElement) {
         opacity: var(--light-disabled-opacity);
         pointer-events: none;
       }
-      .mdc-chip.mdc-chip--selected .mdc-chip__checkmark,
-      .mdc-chip .mdc-chip__icon--leading:not(.mdc-chip__icon--leading-hidden) {
-        margin-inline-start: -14px !important;
-        margin-inline-end: 4px !important;
-        direction: var(--direction);
-      }
     `;
   }
 }