RTL fixes for voice assistant page (#16398)

This commit is contained in:
Paul Bottein 2023-05-03 15:14:02 +02:00 committed by GitHub
parent a39c2a314a
commit 6c25e23ad2
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 14 additions and 2 deletions

View File

@ -207,9 +207,14 @@ export class AssistPref extends LitElement {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
} }
:host([dir="rtl"]) .header-actions {
right: auto;
left: 0;
}
.header-actions .icon-link { .header-actions .icon-link {
margin-top: -16px; margin-top: -16px;
margin-inline-end: 8px; margin-inline-end: 8px;
margin-inline-start: 8px;
margin-right: 8px; margin-right: 8px;
direction: var(--direction); direction: var(--direction);
color: var(--secondary-text-color); color: var(--secondary-text-color);
@ -239,6 +244,8 @@ export class AssistPref extends LitElement {
img { img {
height: 28px; height: 28px;
margin-right: 16px; margin-right: 16px;
margin-inline-end: 16px;
margin-inline-start: initial;
} }
`; `;
} }

View File

@ -284,6 +284,8 @@ export class CloudAlexaPref extends LitElement {
img { img {
height: 28px; height: 28px;
margin-right: 16px; margin-right: 16px;
margin-inline-end: 16px;
margin-inline-start: initial;
} }
`; `;
} }

View File

@ -364,6 +364,8 @@ export class CloudGooglePref extends LitElement {
img { img {
height: 28px; height: 28px;
margin-right: 16px; margin-right: 16px;
margin-inline-end: 16px;
margin-inline-start: initial;
} }
`; `;
} }

View File

@ -50,6 +50,7 @@ export class HaConfigVoiceAssistantsAssistants extends LitElement {
${isComponentLoaded(this.hass, "assist_pipeline") ${isComponentLoaded(this.hass, "assist_pipeline")
? html` ? html`
<assist-pref <assist-pref
.dir=${computeRTLDirection(this.hass)}
.hass=${this.hass} .hass=${this.hass}
.cloudStatus=${this.cloudStatus} .cloudStatus=${this.cloudStatus}
.exposedEntities=${this.exposedEntities} .exposedEntities=${this.exposedEntities}
@ -62,13 +63,13 @@ export class HaConfigVoiceAssistantsAssistants extends LitElement {
.hass=${this.hass} .hass=${this.hass}
.exposedEntities=${this.exposedEntities} .exposedEntities=${this.exposedEntities}
.cloudStatus=${this.cloudStatus} .cloudStatus=${this.cloudStatus}
dir=${computeRTLDirection(this.hass)} .dir=${computeRTLDirection(this.hass)}
></cloud-alexa-pref> ></cloud-alexa-pref>
<cloud-google-pref <cloud-google-pref
.hass=${this.hass} .hass=${this.hass}
.exposedEntities=${this.exposedEntities} .exposedEntities=${this.exposedEntities}
.cloudStatus=${this.cloudStatus} .cloudStatus=${this.cloudStatus}
dir=${computeRTLDirection(this.hass)} .dir=${computeRTLDirection(this.hass)}
></cloud-google-pref> ></cloud-google-pref>
` `
: html`<cloud-discover .hass=${this.hass}></cloud-discover>`} : html`<cloud-discover .hass=${this.hass}></cloud-discover>`}