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

RTL fixes - cloud section, ha-formfield, some missing + (mwc-fab)

Browse Source
This commit is contained in:
Yosi Levy 2020-07-05 06:23:35 +03:00
parent f236b76d5c
commit da10da79b3
28 changed files with 252 additions and 160 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/ha-dialog.ts
View File

@ -5,6 +5,7 @@ import "./ha-icon-button";
import { css, CSSResult, customElement, html } from "lit-element";
import type { Constructor, HomeAssistant } from "../types";
import { mdiClose } from "@mdi/js";
import { computeRTL } from "../common/util/compute_rtl";
const MwcDialog = customElements.get("mwc-dialog") as Constructor<Dialog>;
@ -13,6 +14,7 @@ export const createCloseHeading = (hass: HomeAssistant, title: string) => html`
<mwc-icon-button
aria-label=${hass.localize("ui.dialogs.generic.close")}
dialogAction="close"
?rtl=${computeRTL(hass)}
class="header_button"
>
<ha-svg-icon path=${mdiClose}></ha-svg-icon>
@ -48,6 +50,10 @@ export class HaDialog extends MwcDialog {
text-decoration: none;
color: inherit;
}
mwc-icon-button[rtl].header_button {
right: auto;
left: 16px;
}
`,
];
}

4
src/components/ha-formfield.ts
View File

@ -17,9 +17,9 @@ export class HaFormfield extends MwcFormfield {
::slotted(ha-switch) {
margin-right: 10px;
}
[dir="rtl"] ::slotted(ha-switch),
::slotted(ha-switch)[dir="rtl"] {
:host([dir="rtl"]:not([alignEnd])) ::slotted(ha-switch) {
margin-left: 10px;
margin-right: auto;
}
`,
];

2
src/dialogs/config-entry-system-options/dialog-config-entry-system-options.ts
View File

@ -22,6 +22,7 @@ import type { PolymerChangedEvent } from "../../polymer-types";
import { haStyleDialog } from "../../resources/styles";
import type { HomeAssistant } from "../../types";
import { ConfigEntrySystemOptionsDialogParams } from "./show-dialog-config-entry-system-options";
import { computeRTLDirection } from "../../common/util/compute_rtl";
@customElement("dialog-config-entry-system-options")
class DialogConfigEntrySystemOptions extends LitElement {
@ -99,6 +100,7 @@ class DialogConfigEntrySystemOptions extends LitElement {
) || this._params.entry.domain
)}
</p>`}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked=${!this._disableNewEntities}

14
src/panels/config/cloud/account/cloud-account.js
View File

@ -10,6 +10,7 @@ import { fetchCloudSubscriptionInfo } from "../../../../data/cloud";
import "../../../../layouts/hass-subpage";
import { EventsMixin } from "../../../../mixins/events-mixin";
import LocalizeMixin from "../../../../mixins/localize-mixin";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
import "../../../../styles/polymer-ha-style";
import "../../ha-config-section";
import "./cloud-alexa-pref";
@ -33,7 +34,6 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
}
.content {
padding-bottom: 24px;
direction: ltr;
}
.account-row {
display: flex;
@ -132,21 +132,25 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
<cloud-remote-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-remote-pref>
<cloud-alexa-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-alexa-pref>
<cloud-google-pref
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-google-pref>
<cloud-webhooks
hass="[[hass]]"
cloud-status="[[cloudStatus]]"
dir="[[_rtlDirection]]"
></cloud-webhooks>
</ha-config-section>
</div>
@ -163,6 +167,10 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
type: Object,
value: null,
},
_rtlDirection: {
type: Boolean,
computed: "_computeRTLDirection(hass)",
},
};
}
@ -215,6 +223,10 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) {
return description;
}
_computeRTLDirection(hass) {
return computeRTLDirection(hass);
}
}
customElements.define("cloud-account", CloudAccount);

4
src/panels/config/cloud/account/cloud-alexa-pref.ts
View File

@ -167,6 +167,10 @@ export class CloudAlexaPref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
.card-actions {
display: flex;
}

4
src/panels/config/cloud/account/cloud-google-pref.ts
View File

@ -205,6 +205,10 @@ export class CloudGooglePref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
ha-call-api-button {
color: var(--primary-color);
font-weight: 500;

4
src/panels/config/cloud/account/cloud-remote-pref.ts
View File

@ -150,6 +150,10 @@ export class CloudRemotePref extends LitElement {
right: 24px;
top: 32px;
}
:host([dir="rtl"]) .switch {
right: auto;
left: 24px;
}
.card-actions {
display: flex;
}

2
src/panels/config/cloud/alexa/cloud-alexa.ts
View File

@ -34,6 +34,7 @@ import "../../../../layouts/hass-loading-screen";
import "../../../../layouts/hass-subpage";
import type { HomeAssistant } from "../../../../types";
import "../../../../components/ha-formfield";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const DEFAULT_CONFIG_EXPOSE = true;
const IGNORE_INTERFACES = ["Alexa.EndpointHealth"];
@ -132,6 +133,7 @@ class CloudAlexa extends LitElement {
.label=${this.hass!.localize(
"ui.panel.config.cloud.alexa.expose"
)}
.dir="${computeRTLDirection(this.hass!)}"
>
<ha-switch
.entityId=${entity.entity_id}

1
src/panels/config/cloud/forgot-password/cloud-forgot-password.js
View File

@ -19,7 +19,6 @@ class CloudForgotPassword extends LocalizeMixin(EventsMixin(PolymerElement)) {
<style include="iron-flex ha-style">
.content {
padding-bottom: 24px;
direction: ltr;
}
ha-card {

56
src/panels/config/cloud/google-assistant/cloud-google-assistant.ts
View File

@ -39,6 +39,7 @@ import "../../../../layouts/hass-subpage";
import type { HomeAssistant } from "../../../../types";
import { showToast } from "../../../../util/toast";
import "../../../../components/ha-formfield";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const DEFAULT_CONFIG_EXPOSE = true;
@ -128,32 +129,38 @@ class CloudGoogleAssistant extends LitElement {
.map((trait) => trait.substr(trait.lastIndexOf(".") + 1))
.join(", ")}
</state-info>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.expose"
)}
>
<ha-switch
.entityId=${entity.entity_id}
.disabled=${!emptyFilter}
.checked=${isExposed}
@change=${this._exposeChanged}
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.expose"
)}
.dir="${computeRTLDirection(this.hass!)}"
>
</ha-switch>
</ha-formfield>
<ha-switch
.entityId=${entity.entity_id}
.disabled=${!emptyFilter}
.checked=${isExposed}
@change=${this._exposeChanged}
>
</ha-switch>
</ha-formfield>
</div>
${entity.might_2fa
? html`
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.disable_2FA"
)}
>
<ha-switch
.entityId=${entity.entity_id}
.checked=${Boolean(config.disable_2fa)}
@change=${this._disable2FAChanged}
></ha-switch>
</ha-formfield>
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.panel.config.cloud.google.disable_2FA"
)}
.dir="${computeRTLDirection(this.hass!)}"
>
<ha-switch
.entityId=${entity.entity_id}
.checked=${Boolean(config.disable_2fa)}
@change=${this._disable2FAChanged}
></ha-switch>
</ha-formfield>
</div>
`
: ""}
</div>
@ -377,9 +384,6 @@ class CloudGoogleAssistant extends LitElement {
state-info {
cursor: pointer;
}
ha-formfield {
display: block;
}
ha-switch {
padding: 8px 0;
}

1
src/panels/config/cloud/login/cloud-login.js
View File

@ -30,7 +30,6 @@ class CloudLogin extends LocalizeMixin(
<style include="iron-flex ha-style">
.content {
padding-bottom: 24px;
direction: ltr;
}
[slot="introduction"] {
margin: -1em 0;

4
src/panels/config/cloud/register/cloud-register.js
View File

@ -18,10 +18,6 @@ class CloudRegister extends LocalizeMixin(EventsMixin(PolymerElement)) {
static get template() {
return html`
<style include="iron-flex ha-style">
.content {
direction: ltr;
}
[slot=introduction] {
margin: -1em 0;
}

50
src/panels/config/devices/device-detail/integration-elements/mqtt/dialog-mqtt-device-debug-info.ts
View File

@ -23,6 +23,7 @@ import { HomeAssistant } from "../../../../../../types";
import "./mqtt-discovery-payload";
import "./mqtt-messages";
import { MQTTDeviceDebugInfoDialogParams } from "./show-dialog-mqtt-device-debug-info";
import { computeRTLDirection } from "../../../../../../common/util/compute_rtl";
@customElement("dialog-mqtt-device-debug-info")
class DialogMQTTDeviceDebugInfo extends LitElement {
@ -65,28 +66,34 @@ class DialogMQTTDeviceDebugInfo extends LitElement {
"ui.dialogs.mqtt_device_debug_info.payload_display"
)}
</h4>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.deserialize"
)}
>
<ha-switch
.checked=${this._showDeserialized}
@change=${this._showDeserializedChanged}
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.deserialize"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.show_as_yaml"
)}
>
<ha-switch
.checked=${this._showAsYaml}
@change=${this._showAsYamlChanged}
<ha-switch
.checked=${this._showDeserialized}
@change=${this._showDeserializedChanged}
>
</ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass!.localize(
"ui.dialogs.mqtt_device_debug_info.show_as_yaml"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-switch
.checked=${this._showAsYaml}
@change=${this._showAsYamlChanged}
>
</ha-switch>
</ha-formfield>
</div>
<h4>
${this.hass!.localize("ui.dialogs.mqtt_device_debug_info.entities")}
</h4>
@ -232,9 +239,6 @@ class DialogMQTTDeviceDebugInfo extends LitElement {
.triggerlistitem {
margin-bottom: 12px;
}
ha-formfield {
display: block;
}
`,
];
}

50
src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-detail.ts
View File

@ -24,6 +24,7 @@ import { PolymerChangedEvent } from "../../../../polymer-types";
import { haStyleDialog } from "../../../../resources/styles";
import { HomeAssistant } from "../../../../types";
import { LovelaceDashboardDetailsDialogParams } from "./show-dialog-lovelace-dashboard-detail";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
@customElement("dialog-lovelace-dashboard-detail")
export class DialogLovelaceDashboardDetail extends LitElement {
@ -143,28 +144,34 @@ export class DialogLovelaceDashboardDetail extends LitElement {
></paper-input>
`
: ""}
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.show_sidebar"
)}
>
<ha-switch
.checked=${this._showInSidebar}
@change=${this._showSidebarChanged}
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.show_sidebar"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.require_admin"
)}
>
<ha-switch
.checked=${this._requireAdmin}
@change=${this._requireAdminChanged}
<ha-switch
.checked=${this._showInSidebar}
@change=${this._showSidebarChanged}
>
</ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.config.lovelace.dashboards.detail.require_admin"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-switch
.checked=${this._requireAdmin}
@change=${this._requireAdminChanged}
>
</ha-switch>
</ha-formfield>
</div>
</div>
`}
</div>
@ -318,9 +325,6 @@ export class DialogLovelaceDashboardDetail extends LitElement {
ha-switch {
padding: 16px 0;
}
ha-formfield {
display: block;
}
`,
];
}

6
src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
View File

@ -36,6 +36,7 @@ import { lovelaceTabs } from "../ha-config-lovelace";
import { showDashboardDetailDialog } from "./show-dialog-lovelace-dashboard-detail";
import "../../../../components/ha-svg-icon";
import { mdiPlus } from "@mdi/js";
import { computeRTL } from "../../../../common/util/compute_rtl";
@customElement("ha-config-lovelace-dashboards")
export class HaConfigLovelaceDashboards extends LitElement {
@ -227,6 +228,7 @@ export class HaConfigLovelaceDashboards extends LitElement {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass)}
title="${this.hass.localize(
"ui.panel.config.lovelace.dashboards.picker.add_dashboard"
)}"
@ -324,6 +326,10 @@ export class HaConfigLovelaceDashboards extends LitElement {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab[rtl] {
left: 16px;
right: auto;
}
`;
}
}

2
src/panels/config/users/dialog-add-user.ts
View File

@ -26,6 +26,7 @@ import { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { AddUserDialogParams } from "./show-dialog-add-user";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
@customElement("dialog-add-user")
export class DialogAddUser extends LitElement {
@ -115,6 +116,7 @@ export class DialogAddUser extends LitElement {
></paper-input>
<ha-formfield
.label=${this.hass.localize("ui.panel.config.users.editor.admin")}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch .checked=${this._isAdmin} @change=${this._adminChanged}>
</ha-switch>

2
src/panels/config/users/dialog-user-detail.ts
View File

@ -21,6 +21,7 @@ import { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { UserDetailDialogParams } from "./show-dialog-user-detail";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
@customElement("dialog-user-detail")
class DialogUserDetail extends LitElement {
@ -102,6 +103,7 @@ class DialogUserDetail extends LitElement {
></paper-input>
<ha-formfield
.label=${this.hass.localize("ui.panel.config.users.editor.admin")}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.disabled=${user.system_generated}

2
src/panels/config/zone/dialog-zone-detail.ts
View File

@ -22,6 +22,7 @@ import {
import { haStyleDialog } from "../../../resources/styles";
import { HomeAssistant } from "../../../types";
import { ZoneDetailDialogParams } from "./show-dialog-zone-detail";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
class DialogZoneDetail extends LitElement {
@property() public hass!: HomeAssistant;
@ -186,6 +187,7 @@ class DialogZoneDetail extends LitElement {
.label=${this.hass!.localize(
"ui.panel.config.zone.detail.passive"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked=${this._passive}

6
src/panels/config/zone/ha-config-zone.ts
View File

@ -50,6 +50,7 @@ import type { HomeAssistant, Route } from "../../../types";
import "../ha-config-section";
import { configSections } from "../ha-panel-config";
import { showZoneDetailDialog } from "./show-dialog-zone-detail";
import { computeRTL } from "../../../common/util/compute_rtl";
@customElement("ha-config-zone")
export class HaConfigZone extends SubscribeMixin(LitElement) {
@ -258,6 +259,7 @@ export class HaConfigZone extends SubscribeMixin(LitElement) {
<mwc-fab
?is-wide=${this.isWide}
?narrow=${this.narrow}
?rtl=${computeRTL(this.hass)}
title="${hass.localize("ui.panel.config.zone.add_zone")}"
@click=${this._createZone}
>
@ -554,6 +556,10 @@ export class HaConfigZone extends SubscribeMixin(LitElement) {
mwc-fab[narrow] {
bottom: 84px;
}
mwc-fab[rtl] {
left: 24px;
right: auto;
}
`;
}
}

51
src/panels/lovelace/editor/config-elements/hui-button-card-editor.ts
View File

@ -25,6 +25,7 @@ import {
import "../../../../components/ha-switch";
import "../../../../components/ha-formfield";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -143,28 +144,34 @@ export class HuiButtonCardEditor extends LitElement
></ha-icon-input>
</div>
<div class="side-by-side">
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
>
<ha-switch
.checked="${this._config!.show_name !== false}"
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_icon"
)}
>
<ha-switch
.checked="${this._config!.show_icon !== false}"
.configValue="${"show_icon"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.show_name !== false}"
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_icon"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.show_icon !== false}"
.configValue="${"show_icon"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
</div>
</div>
<div class="side-by-side">
<paper-input

2
src/panels/lovelace/editor/config-elements/hui-entities-card-editor.ts
View File

@ -31,6 +31,7 @@ import {
EntitiesEditorEvent,
} from "../types";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -93,6 +94,7 @@ export class HuiEntitiesCardEditor extends LitElement
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.entities.show_header_toggle"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.show_header_toggle !== false}"

2
src/panels/lovelace/editor/config-elements/hui-gauge-card-editor.ts
View File

@ -19,6 +19,7 @@ import "../../components/hui-theme-select-editor";
import { LovelaceCardEditor } from "../../types";
import { EditorTarget, EntitiesEditorEvent } from "../types";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -146,6 +147,7 @@ export class HuiGaugeCardEditor extends LitElement
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.gauge.severity.define"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.severity !== undefined}"

76
src/panels/lovelace/editor/config-elements/hui-glance-card-editor.ts
View File

@ -27,6 +27,7 @@ import {
EntitiesEditorEvent,
} from "../types";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -116,41 +117,50 @@ export class HuiGlanceCardEditor extends LitElement
></paper-input>
</div>
<div class="side-by-side">
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
>
<ha-switch
.checked=${this._config!.show_name !== false}
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_icon"
)}
>
<ha-switch
.checked=${this._config!.show_icon !== false}
.configValue="${"show_icon"}"
@change="${this._valueChanged}"
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_state"
)}
>
<ha-switch
.checked=${this._config!.show_state !== false}
.configValue="${"show_state"}"
@change="${this._valueChanged}"
<ha-switch
.checked=${this._config!.show_name !== false}
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_icon"
)}
.dir="${computeRTLDirection(this.hass)}"
>
</ha-switch>
</ha-formfield>
<ha-switch
.checked=${this._config!.show_icon !== false}
.configValue="${"show_icon"}"
@change="${this._valueChanged}"
>
</ha-switch>
</ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_state"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked=${this._config!.show_state !== false}
.configValue="${"show_state"}"
@change="${this._valueChanged}"
>
</ha-switch>
</ha-formfield>
</div>
</div>
</div>
<hui-entity-editor

2
src/panels/lovelace/editor/config-elements/hui-map-card-editor.ts
View File

@ -26,6 +26,7 @@ import {
import "../../../../components/ha-switch";
import "../../../../components/ha-formfield";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -124,6 +125,7 @@ export class HuiMapCardEditor extends LitElement implements LovelaceCardEditor {
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.map.dark_mode"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._dark_mode}"

51
src/panels/lovelace/editor/config-elements/hui-picture-entity-card-editor.ts
View File

@ -26,6 +26,7 @@ import {
EntitiesEditorEvent,
} from "../types";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -188,28 +189,34 @@ export class HuiPictureEntityCardEditor extends LitElement
></paper-input>
</div>
<div class="side-by-side">
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
>
<ha-switch
.checked="${this._config!.show_name !== false}"
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch
></ha-formfield>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_state"
)}
>
<ha-switch
.checked="${this._config!.show_state !== false}"
.configValue="${"show_state"}"
@change="${this._valueChanged}"
></ha-switch
></ha-formfield>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_name"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.show_name !== false}"
.configValue="${"show_name"}"
@change="${this._valueChanged}"
></ha-switch
></ha-formfield>
</div>
<div>
<ha-formfield
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.show_state"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked="${this._config!.show_state !== false}"
.configValue="${"show_state"}"
@change="${this._valueChanged}"
></ha-switch
></ha-formfield>
</div>
</div>
<div class="side-by-side">
<hui-action-editor

2
src/panels/lovelace/editor/config-elements/hui-weather-forecast-card-editor.ts
View File

@ -16,6 +16,7 @@ import "../../components/hui-theme-select-editor";
import { LovelaceCardEditor } from "../../types";
import { EditorTarget, EntitiesEditorEvent } from "../types";
import { configElementStyle } from "./config-elements-style";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
const cardConfigStruct = struct({
type: "string",
@ -114,6 +115,7 @@ export class HuiWeatherForecastCardEditor extends LitElement
.label=${this.hass.localize(
"ui.panel.lovelace.editor.card.weather-forecast.show_forecast"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked=${this._config!.show_forecast !== false}

2
src/panels/lovelace/editor/hui-dialog-save-config.ts
View File

@ -21,6 +21,7 @@ import type { PolymerChangedEvent } from "../../../polymer-types";
import { haStyleDialog } from "../../../resources/styles";
import type { HomeAssistant } from "../../../types";
import type { SaveDialogParams } from "./show-save-config-dialog";
import { computeRTLDirection } from "../../../common/util/compute_rtl";
const EMPTY_CONFIG = { views: [] };
@ -77,6 +78,7 @@ export class HuiSaveConfig extends LitElement {
.label=${this.hass!.localize(
"ui.panel.lovelace.editor.save_config.empty_config"
)}
.dir="${computeRTLDirection(this.hass)}"
>
<ha-switch
.checked=${this._emptyConfig}

4
src/panels/lovelace/editor/view-editor/hui-view-editor.ts
View File

@ -18,6 +18,7 @@ import { HomeAssistant } from "../../../../types";
import "../../components/hui-theme-select-editor";
import { configElementStyle } from "../config-elements/config-elements-style";
import { EditorTarget } from "../types";
import { computeRTLDirection } from "../../../../common/util/compute_rtl";
declare global {
interface HASSDomEvents {
@ -126,6 +127,7 @@ export class HuiViewEditor extends LitElement {
.label=${this.hass.localize(
"ui.panel.lovelace.editor.view.panel_mode.title"
)}
.dir="${computeRTLDirection(this.hass!)}"
>
<ha-switch
.checked=${this._panel !== false}
@ -180,8 +182,6 @@ export class HuiViewEditor extends LitElement {
return css`
.panel {
color: var(--secondary-text-color);
}
ha-formfield {
display: block;
}
`;