RTL fixes (#20880)

home-assistant · May 27, 2024 · dfee3ba · dfee3ba
1 parent 1dbb70b
commit dfee3ba
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/src/components/ha-icon-picker.ts b/src/components/ha-icon-picker.ts
@@ -1,4 +1,3 @@
-import "@material/mwc-list/mwc-list-item";
 import { ComboBoxLitRenderer } from "@vaadin/combo-box/lit";
 import {
   ComboBoxDataProviderCallback,
@@ -11,6 +10,7 @@ import { fireEvent } from "../common/dom/fire_event";
 import { customIcons } from "../data/custom_icons";
 import { HomeAssistant, ValueChangedEvent } from "../types";
 import "./ha-combo-box";
+import "./ha-list-item";
 import "./ha-icon";
 
 type IconItem = {
@@ -67,10 +67,10 @@ const loadCustomIconItems = async (iconsetPrefix: string) => {
 };
 
 const rowRenderer: ComboBoxLitRenderer<IconItem | RankedIcon> = (item) =>
-  html`<mwc-list-item graphic="avatar">
+  html`<ha-list-item graphic="avatar">
     <ha-icon .icon=${item.icon} slot="graphic"></ha-icon>
     ${item.icon}
-  </mwc-list-item>`;
+  </ha-list-item>`;
 
 @customElement("ha-icon-picker")
 export class HaIconPicker extends LitElement {

diff --git a/src/components/ha-list-item.ts b/src/components/ha-list-item.ts
@@ -100,6 +100,7 @@ export class HaListItem extends ListItemBase {
             span.material-icons:first-of-type,
             span.material-icons:last-of-type {
               direction: rtl !important;
+              --direction: rtl;
             }
           `
         : css``,

diff --git a/src/components/ha-textfield.ts b/src/components/ha-textfield.ts
@@ -206,6 +206,7 @@ export class HaTextField extends TextFieldBase {
             .mdc-floating-label,
           .mdc-text-field__input[type="number"] {
             direction: rtl;
+            --direction: rtl;
           }
         `
       : css``,