jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-24 09:46:36 +00:00
Code Issues Packages Projects Releases Wiki Activity

RTL arrow problems (#3467)

Browse Source 
* Updated style check since load sequence must have changed

* Refactored to timeout

* Added comment
This commit is contained in:
Yosi Levy 2019-08-12 20:31:23 +03:00 committed by Paulus Schoutsen
parent 9fa8544972
commit 807dff99af
6 changed files with 52 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

14
src/components/ha-icon-next.ts
View File

@ -5,13 +5,15 @@ import { HaIcon } from "./ha-icon";
export class HaIconNext extends HaIcon {
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-right"
: "hass:chevron-left";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-right"
: "hass:chevron-left";
}, 100);
}
}

14
src/components/ha-icon-prev.ts
View File

@ -5,13 +5,15 @@ import { HaIcon } from "./ha-icon";
export class HaIconPrev extends HaIcon {
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-left"
: "hass:chevron-right";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-left"
: "hass:chevron-right";
}, 100);
}
}

14
src/components/ha-paper-icon-button-arrow-next.ts
View File

@ -10,13 +10,15 @@ const paperIconButtonClass = customElements.get(
export class HaPaperIconButtonArrowNext extends paperIconButtonClass {
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:arrow-right"
: "hass:arrow-left";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:arrow-right"
: "hass:arrow-left";
}, 100);
}
}

22
src/components/ha-paper-icon-button-arrow-prev.ts
View File

@ -12,17 +12,19 @@ export class HaPaperIconButtonArrowPrev extends paperIconButtonClass {
public hassio?: boolean;
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? this.hassio
? "hassio:arrow-left"
: "hass:arrow-left"
: this.hassio
? "hassio:arrow-right"
: "hass:arrow-right";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? this.hassio
? "hassio:arrow-left"
: "hass:arrow-left"
: this.hassio
? "hassio:arrow-right"
: "hass:arrow-right";
}, 100);
}
}

14
src/components/ha-paper-icon-button-next.ts
View File

@ -10,13 +10,15 @@ const paperIconButtonClass = customElements.get(
export class HaPaperIconButtonNext extends paperIconButtonClass {
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-right"
: "hass:chevron-left";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-right"
: "hass:chevron-left";
}, 100);
}
}

14
src/components/ha-paper-icon-button-prev.ts
View File

@ -10,13 +10,15 @@ const paperIconButtonClass = customElements.get(
export class HaPaperIconButtonPrev extends paperIconButtonClass {
public connectedCallback() {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-left"
: "hass:chevron-right";
// calling super after setting icon to have it consistently show the icon (otherwise not always shown)
super.connectedCallback();
// wait to check for direction since otherwise direction is wrong even though top level is RTL
setTimeout(() => {
this.icon =
window.getComputedStyle(this).direction === "ltr"
? "hass:chevron-left"
: "hass:chevron-right";
}, 100);
}
}