diff --git a/src/layouts/hass-subpage.ts b/src/layouts/hass-subpage.ts index 25d244774c..8a52aa4030 100644 --- a/src/layouts/hass-subpage.ts +++ b/src/layouts/hass-subpage.ts @@ -9,12 +9,14 @@ import { } from "lit-element"; import "../components/ha-menu-button"; import "../components/ha-paper-icon-button-arrow-prev"; +import { classMap } from "lit-html/directives/class-map"; @customElement("hass-subpage") class HassSubpage extends LitElement { @property() public header?: string; - + @property({ type: Boolean }) + public showBackButton = true; @property({ type: Boolean }) public hassio = false; @@ -25,6 +27,7 @@ class HassSubpage extends LitElement { aria-label="Back" .hassio=${this.hassio} @click=${this._backTapped} + class=${classMap({ hidden: !this.showBackButton })} >
${this.header}
@@ -64,6 +67,10 @@ class HassSubpage extends LitElement { pointer-events: auto; } + ha-paper-icon-button-arrow-prev.hidden { + visibility: hidden; + } + [main-title] { margin: 0 0 0 24px; line-height: 20px; diff --git a/src/panels/config/area_registry/dialog-area-registry-detail.ts b/src/panels/config/areas/dialog-area-registry-detail.ts similarity index 100% rename from src/panels/config/area_registry/dialog-area-registry-detail.ts rename to src/panels/config/areas/dialog-area-registry-detail.ts diff --git a/src/panels/config/area_registry/ha-config-area-registry.ts b/src/panels/config/areas/ha-config-areas.ts similarity index 96% rename from src/panels/config/area_registry/ha-config-area-registry.ts rename to src/panels/config/areas/ha-config-areas.ts index cf37726d81..c64ec7edef 100644 --- a/src/panels/config/area_registry/ha-config-area-registry.ts +++ b/src/panels/config/areas/ha-config-areas.ts @@ -5,6 +5,7 @@ import { css, CSSResult, property, + customElement, } from "lit-element"; import "@polymer/paper-item/paper-item"; import "@polymer/paper-item/paper-item-body"; @@ -30,7 +31,8 @@ import { classMap } from "lit-html/directives/class-map"; import { computeRTL } from "../../../common/util/compute_rtl"; import { UnsubscribeFunc } from "home-assistant-js-websocket"; -class HaConfigAreaRegistry extends LitElement { +@customElement("ha-config-areas") +export class HaConfigAreas extends LitElement { @property() public hass!: HomeAssistant; @property() public isWide?: boolean; @property() private _areas?: AreaRegistryEntry[]; @@ -51,7 +53,8 @@ class HaConfigAreaRegistry extends LitElement { } return html` @@ -208,5 +211,3 @@ All devices in this area will become unassigned.`) `; } } - -customElements.define("ha-config-area-registry", HaConfigAreaRegistry); diff --git a/src/panels/config/area_registry/show-dialog-area-registry-detail.ts b/src/panels/config/areas/show-dialog-area-registry-detail.ts similarity index 100% rename from src/panels/config/area_registry/show-dialog-area-registry-detail.ts rename to src/panels/config/areas/show-dialog-area-registry-detail.ts diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts index d261723509..5dca737bb5 100644 --- a/src/panels/config/automation/ha-automation-picker.ts +++ b/src/panels/config/automation/ha-automation-picker.ts @@ -42,6 +42,7 @@ class HaAutomationPicker extends LitElement { protected render(): TemplateResult | void { return html` diff --git a/src/panels/config/cloud/account/cloud-account.js b/src/panels/config/cloud/account/cloud-account.js index 19f37a5aff..d43ce8fb4a 100644 --- a/src/panels/config/cloud/account/cloud-account.js +++ b/src/panels/config/cloud/account/cloud-account.js @@ -63,7 +63,10 @@ class CloudAccount extends EventsMixin(LocalizeMixin(PolymerElement)) { color: var(--primary-color); } - +
- +
- +
+
diff --git a/src/panels/config/dashboard/ha-config-dashboard.ts b/src/panels/config/dashboard/ha-config-dashboard.ts index c3c3b2dc10..0fa264daff 100644 --- a/src/panels/config/dashboard/ha-config-dashboard.ts +++ b/src/panels/config/dashboard/ha-config-dashboard.ts @@ -55,65 +55,67 @@ class HaConfigDashboard extends LitElement { ${isComponentLoaded(this.hass, "cloud") ? html` - - - - - ${this.hass.localize("ui.panel.config.cloud.caption")} - ${ - this.cloudStatus.logged_in - ? html` -
- ${this.hass.localize( - "ui.panel.config.cloud.description_login", - "email", - (this.cloudStatus as CloudStatusLoggedIn).email - )} -
- ` - : html` -
- ${this.hass.localize( - "ui.panel.config.cloud.description_features" - )} -
- ` - } - - - - - - ` + + + + + ${this.hass.localize("ui.panel.config.cloud.caption")} + ${this.cloudStatus.logged_in + ? html` +
+ ${this.hass.localize( + "ui.panel.config.cloud.description_login", + "email", + (this.cloudStatus as CloudStatusLoggedIn) + .email + )} +
+ ` + : html` +
+ ${this.hass.localize( + "ui.panel.config.cloud.description_features" + )} +
+ `} + + + + + + ` : ""} - - - + + + + + + ${!this.showAdvanced ? html` diff --git a/src/panels/config/dashboard/ha-config-navigation.ts b/src/panels/config/dashboard/ha-config-navigation.ts index 3b7ebb889d..4b8e897f18 100644 --- a/src/panels/config/dashboard/ha-config-navigation.ts +++ b/src/panels/config/dashboard/ha-config-navigation.ts @@ -16,11 +16,13 @@ import { css, } from "lit-element"; import { HomeAssistant } from "../../../types"; +import { CloudStatus, CloudStatusLoggedIn } from "../../../data/cloud"; export interface ConfigPageNavigation { page: string; core?: boolean; advanced?: boolean; + info?: any; } @customElement("ha-config-navigation") @@ -28,31 +30,56 @@ class HaConfigNavigation extends LitElement { @property() public hass!: HomeAssistant; @property() public showAdvanced!: boolean; @property() public pages!: ConfigPageNavigation[]; + @property() public curPage!: string; protected render(): TemplateResult | void { return html` - - ${this.pages.map(({ page, core, advanced }) => + + ${this.pages.map(({ page, core, advanced, info }) => (core || isComponentLoaded(this.hass, page)) && (!advanced || this.showAdvanced) ? html` - + - + ${this.hass.localize(`ui.panel.config.${page}.caption`)} -
- ${this.hass.localize( - `ui.panel.config.${page}.description` - )} -
+ ${page === "cloud" && (info as CloudStatus) + ? info.logged_in + ? html` +
+ ${this.hass.localize( + "ui.panel.config.cloud.description_login", + "email", + (info as CloudStatusLoggedIn).email + )} +
+ ` + : html` +
+ ${this.hass.localize( + "ui.panel.config.cloud.description_features" + )} +
+ ` + : html` +
+ ${this.hass.localize( + `ui.panel.config.${page}.description` + )} +
+ `} - ` : "" )} - + `; } @@ -62,6 +89,24 @@ class HaConfigNavigation extends LitElement { text-decoration: none; color: var(--primary-text-color); } + .iron-selected paper-item:before { + border-radius: 4px; + position: absolute; + top: 0; + right: 0; + bottom: 0; + left: 0; + pointer-events: none; + content: ""; + background-color: var(--sidebar-selected-icon-color); + opacity: 0.12; + transition: opacity 15ms linear; + will-change: opacity; + } + + .iron-selected paper-item[pressed]:before { + opacity: 0.37; + } `; } } diff --git a/src/panels/config/devices/device-detail/ha-device-entities-card.ts b/src/panels/config/devices/device-detail/ha-device-entities-card.ts index abc7d88753..48b51a16ca 100644 --- a/src/panels/config/devices/device-detail/ha-device-entities-card.ts +++ b/src/panels/config/devices/device-detail/ha-device-entities-card.ts @@ -20,7 +20,7 @@ import "@polymer/paper-item/paper-item-body"; import "../../../../components/ha-card"; import "../../../../components/ha-icon"; import "../../../../components/ha-switch"; -import { showEntityRegistryDetailDialog } from "../../entity_registry/show-dialog-entity-registry-detail"; +import { showEntityRegistryDetailDialog } from "../../entities/show-dialog-entity-registry-detail"; import { fireEvent } from "../../../../common/dom/fire_event"; import { computeDomain } from "../../../../common/entity/compute_domain"; import { domainIcon } from "../../../../common/entity/domain_icon"; diff --git a/src/panels/config/devices/ha-config-devices-dashboard.ts b/src/panels/config/devices/ha-config-devices-dashboard.ts index c60bcabe91..ef2f32d684 100644 --- a/src/panels/config/devices/ha-config-devices-dashboard.ts +++ b/src/panels/config/devices/ha-config-devices-dashboard.ts @@ -20,6 +20,7 @@ import { AreaRegistryEntry } from "../../../data/area_registry"; export class HaConfigDeviceDashboard extends LitElement { @property() public hass!: HomeAssistant; @property() public narrow = false; + @property() public isWide = false; @property() public devices!: DeviceRegistryEntry[]; @property() public entries!: ConfigEntry[]; @property() public entities!: EntityRegistryEntry[]; @@ -29,7 +30,8 @@ export class HaConfigDeviceDashboard extends LitElement { protected render(): TemplateResult { return html`
@@ -496,14 +499,14 @@ class HaConfigEntityRegistry extends LitElement { } h2 { margin-top: 0; - font-family: var(--paper-font-display1_-_font-family); + font-family: var(--paper-font-headline_-_font-family); -webkit-font-smoothing: var( - --paper-font-display1_-_-webkit-font-smoothing + --paper-font-headline_-_-webkit-font-smoothing ); - font-size: var(--paper-font-display1_-_font-size); - font-weight: var(--paper-font-display1_-_font-weight); - letter-spacing: var(--paper-font-display1_-_letter-spacing); - line-height: var(--paper-font-display1_-_line-height); + font-size: var(--paper-font-headline_-_font-size); + font-weight: var(--paper-font-headline_-_font-weight); + letter-spacing: var(--paper-font-headline_-_letter-spacing); + line-height: var(--paper-font-headline_-_line-height); opacity: var(--dark-primary-opacity); } p { @@ -511,10 +514,8 @@ class HaConfigEntityRegistry extends LitElement { -webkit-font-smoothing: var( --paper-font-subhead_-_-webkit-font-smoothing ); - font-size: var(--paper-font-subhead_-_font-size); font-weight: var(--paper-font-subhead_-_font-weight); line-height: var(--paper-font-subhead_-_line-height); - opacity: var(--dark-primary-opacity); } .intro { padding: 24px 16px; @@ -549,5 +550,3 @@ class HaConfigEntityRegistry extends LitElement { `; } } - -customElements.define("ha-config-entity-registry", HaConfigEntityRegistry); diff --git a/src/panels/config/entity_registry/show-dialog-entity-registry-detail.ts b/src/panels/config/entities/show-dialog-entity-registry-detail.ts similarity index 100% rename from src/panels/config/entity_registry/show-dialog-entity-registry-detail.ts rename to src/panels/config/entities/show-dialog-entity-registry-detail.ts diff --git a/src/panels/config/ha-config-router.ts b/src/panels/config/ha-config-router.ts new file mode 100644 index 0000000000..81f5ab3f53 --- /dev/null +++ b/src/panels/config/ha-config-router.ts @@ -0,0 +1,170 @@ +import { property, customElement } from "lit-element"; +import "../../layouts/hass-loading-screen"; +import { HomeAssistant } from "../../types"; +import { CloudStatus } from "../../data/cloud"; +import { HassRouterPage, RouterOptions } from "../../layouts/hass-router-page"; +import { PolymerElement } from "@polymer/polymer"; + +declare global { + // for fire event + interface HASSDomEvents { + "ha-refresh-cloud-status": undefined; + } +} + +@customElement("ha-config-router") +class HaConfigRouter extends HassRouterPage { + @property() public hass!: HomeAssistant; + @property() public narrow!: boolean; + @property() public wideSidebar: boolean = false; + @property() public wide: boolean = false; + @property() public isWide: boolean = false; + @property() public showAdvanced: boolean = false; + @property() public cloudStatus?: CloudStatus; + + protected routerOptions: RouterOptions = { + defaultPage: "dashboard", + cacheAll: true, + preloadAll: true, + routes: { + areas: { + tag: "ha-config-areas", + load: () => + import( + /* webpackChunkName: "panel-config-areas" */ "./areas/ha-config-areas" + ), + }, + automation: { + tag: "ha-config-automation", + load: () => + import( + /* webpackChunkName: "panel-config-automation" */ "./automation/ha-config-automation" + ), + }, + cloud: { + tag: "ha-config-cloud", + load: () => + import( + /* webpackChunkName: "panel-config-cloud" */ "./cloud/ha-config-cloud" + ), + }, + core: { + tag: "ha-config-core", + load: () => + import( + /* webpackChunkName: "panel-config-core" */ "./core/ha-config-core" + ), + }, + devices: { + tag: "ha-config-devices", + load: () => + import( + /* webpackChunkName: "panel-config-devices" */ "./devices/ha-config-devices" + ), + }, + server_control: { + tag: "ha-config-server-control", + load: () => + import( + /* webpackChunkName: "panel-config-server-control" */ "./server_control/ha-config-server-control" + ), + }, + customize: { + tag: "ha-config-customize", + load: () => + import( + /* webpackChunkName: "panel-config-customize" */ "./customize/ha-config-customize" + ), + }, + dashboard: { + tag: "ha-config-dashboard", + load: () => + import( + /* webpackChunkName: "panel-config-dashboard" */ "./dashboard/ha-config-dashboard" + ), + }, + entities: { + tag: "ha-config-entities", + load: () => + import( + /* webpackChunkName: "panel-config-entities" */ "./entities/ha-config-entities" + ), + }, + integrations: { + tag: "ha-config-integrations", + load: () => + import( + /* webpackChunkName: "panel-config-integrations" */ "./integrations/ha-config-integrations" + ), + }, + person: { + tag: "ha-config-person", + load: () => + import( + /* webpackChunkName: "panel-config-person" */ "./person/ha-config-person" + ), + }, + script: { + tag: "ha-config-script", + load: () => + import( + /* webpackChunkName: "panel-config-script" */ "./script/ha-config-script" + ), + }, + scene: { + tag: "ha-config-scene", + load: () => + import( + /* webpackChunkName: "panel-config-scene" */ "./scene/ha-config-scene" + ), + }, + users: { + tag: "ha-config-users", + load: () => + import( + /* webpackChunkName: "panel-config-users" */ "./users/ha-config-users" + ), + }, + zha: { + tag: "zha-config-dashboard-router", + load: () => + import( + /* webpackChunkName: "panel-config-zha" */ "./zha/zha-config-dashboard-router" + ), + }, + zwave: { + tag: "ha-config-zwave", + load: () => + import( + /* webpackChunkName: "panel-config-zwave" */ "./zwave/ha-config-zwave" + ), + }, + }, + }; + protected updatePageEl(el) { + if ("setProperties" in el) { + // As long as we have Polymer panels + (el as PolymerElement).setProperties({ + route: this.routeTail, + hass: this.hass, + showAdvanced: this.showAdvanced, + isWide: this.isWide, + narrow: this.narrow, + cloudStatus: this.cloudStatus, + }); + } else { + el.route = this.routeTail; + el.hass = this.hass; + el.showAdvanced = this.showAdvanced; + el.isWide = this.isWide; + el.narrow = this.narrow; + el.cloudStatus = this.cloudStatus; + } + } +} + +declare global { + interface HTMLElementTagNameMap { + "ha-config-router": HaConfigRouter; + } +} diff --git a/src/panels/config/ha-config-section.js b/src/panels/config/ha-config-section.js deleted file mode 100644 index 800eda13c8..0000000000 --- a/src/panels/config/ha-config-section.js +++ /dev/null @@ -1,98 +0,0 @@ -import { html } from "@polymer/polymer/lib/utils/html-tag"; -import { PolymerElement } from "@polymer/polymer/polymer-element"; - -import "../../resources/ha-style"; - -class HaConfigSection extends PolymerElement { - static get template() { - return html` - -
-
-
-
-
-
-
- `; - } - - static get properties() { - return { - hass: { - type: Object, - }, - - narrow: { - type: Boolean, - }, - - isWide: { - type: Boolean, - value: false, - }, - }; - } - - computeContentClasses(isWide) { - var classes = "content "; - - return isWide ? classes : classes + "narrow"; - } - - computeClasses(isWide) { - var classes = "together layout "; - - return classes + (isWide ? "horizontal" : "vertical narrow"); - } -} - -customElements.define("ha-config-section", HaConfigSection); diff --git a/src/panels/config/ha-config-section.ts b/src/panels/config/ha-config-section.ts new file mode 100644 index 0000000000..802bd65128 --- /dev/null +++ b/src/panels/config/ha-config-section.ts @@ -0,0 +1,65 @@ +import { customElement } from "lit-element"; + +@customElement("ha-config-section") +export class HaConfigSection extends HTMLElement { + constructor() { + super(); + this.attachShadow({ mode: "open" }); + this.shadowRoot!.innerHTML = ` + +
+
+
+
+
+
+
+ `; + } +} diff --git a/src/panels/config/ha-panel-config.ts b/src/panels/config/ha-panel-config.ts index 213977a577..377b5f406f 100644 --- a/src/panels/config/ha-panel-config.ts +++ b/src/panels/config/ha-panel-config.ts @@ -1,15 +1,26 @@ -import { property, PropertyValues, customElement } from "lit-element"; +import { + property, + PropertyValues, + customElement, + LitElement, + html, + CSSResult, + css, +} from "lit-element"; +import "@polymer/paper-item/paper-item-body"; +import "@polymer/paper-item/paper-item"; import "../../layouts/hass-loading-screen"; import { isComponentLoaded } from "../../common/config/is_component_loaded"; -import { HomeAssistant } from "../../types"; +import { HomeAssistant, Route } from "../../types"; import { CloudStatus, fetchCloudStatus } from "../../data/cloud"; import { listenMediaQuery } from "../../common/dom/media_query"; -import { HassRouterPage, RouterOptions } from "../../layouts/hass-router-page"; import { - CoreFrontendUserData, getOptimisticFrontendUserDataCollection, + CoreFrontendUserData, } from "../../data/frontend"; -import { PolymerElement } from "@polymer/polymer"; +import "./ha-config-router"; +import "./dashboard/ha-config-navigation"; +import { classMap } from "lit-html/directives/class-map"; declare global { // for fire event @@ -19,133 +30,15 @@ declare global { } @customElement("ha-panel-config") -class HaPanelConfig extends HassRouterPage { +class HaPanelConfig extends LitElement { @property() public hass!: HomeAssistant; @property() public narrow!: boolean; - - protected routerOptions: RouterOptions = { - defaultPage: "dashboard", - cacheAll: true, - preloadAll: true, - routes: { - area_registry: { - tag: "ha-config-area-registry", - load: () => - import( - /* webpackChunkName: "panel-config-area-registry" */ "./area_registry/ha-config-area-registry" - ), - }, - automation: { - tag: "ha-config-automation", - load: () => - import( - /* webpackChunkName: "panel-config-automation" */ "./automation/ha-config-automation" - ), - }, - cloud: { - tag: "ha-config-cloud", - load: () => - import( - /* webpackChunkName: "panel-config-cloud" */ "./cloud/ha-config-cloud" - ), - }, - core: { - tag: "ha-config-core", - load: () => - import( - /* webpackChunkName: "panel-config-core" */ "./core/ha-config-core" - ), - }, - devices: { - tag: "ha-config-devices", - load: () => - import( - /* webpackChunkName: "panel-config-devices" */ "./devices/ha-config-devices" - ), - }, - server_control: { - tag: "ha-config-server-control", - load: () => - import( - /* webpackChunkName: "panel-config-server-control" */ "./server_control/ha-config-server-control" - ), - }, - customize: { - tag: "ha-config-customize", - load: () => - import( - /* webpackChunkName: "panel-config-customize" */ "./customize/ha-config-customize" - ), - }, - dashboard: { - tag: "ha-config-dashboard", - load: () => - import( - /* webpackChunkName: "panel-config-dashboard" */ "./dashboard/ha-config-dashboard" - ), - }, - entity_registry: { - tag: "ha-config-entity-registry", - load: () => - import( - /* webpackChunkName: "panel-config-entity-registry" */ "./entity_registry/ha-config-entity-registry" - ), - }, - integrations: { - tag: "ha-config-integrations", - load: () => - import( - /* webpackChunkName: "panel-config-integrations" */ "./integrations/ha-config-integrations" - ), - }, - person: { - tag: "ha-config-person", - load: () => - import( - /* webpackChunkName: "panel-config-person" */ "./person/ha-config-person" - ), - }, - script: { - tag: "ha-config-script", - load: () => - import( - /* webpackChunkName: "panel-config-script" */ "./script/ha-config-script" - ), - }, - scene: { - tag: "ha-config-scene", - load: () => - import( - /* webpackChunkName: "panel-config-scene" */ "./scene/ha-config-scene" - ), - }, - users: { - tag: "ha-config-users", - load: () => - import( - /* webpackChunkName: "panel-config-users" */ "./users/ha-config-users" - ), - }, - zha: { - tag: "zha-config-dashboard-router", - load: () => - import( - /* webpackChunkName: "panel-config-zha" */ "./zha/zha-config-dashboard-router" - ), - }, - zwave: { - tag: "ha-config-zwave", - load: () => - import( - /* webpackChunkName: "panel-config-zwave" */ "./zwave/ha-config-zwave" - ), - }, - }, - }; + @property() public route!: Route; @property() private _wideSidebar: boolean = false; @property() private _wide: boolean = false; @property() private _coreUserData?: CoreFrontendUserData; + @property() private _showAdvanced = false; @property() private _cloudStatus?: CloudStatus; private _listeners: Array<() => void> = []; @@ -168,6 +61,9 @@ class HaPanelConfig extends HassRouterPage { "core" ).subscribe((coreUserData) => { this._coreUserData = coreUserData || {}; + this._showAdvanced = !!( + this._coreUserData && this._coreUserData.showAdvanced + ); }) ); } @@ -189,31 +85,60 @@ class HaPanelConfig extends HassRouterPage { ); } - protected updatePageEl(el) { - const showAdvanced = !!( - this._coreUserData && this._coreUserData.showAdvanced - ); + protected render() { + const dividerPos = this.route.path.indexOf("/", 1); + const curPage = + dividerPos === -1 + ? this.route.path.substr(1) + : this.route.path.substr(1, dividerPos - 1); + const isWide = this.hass.dockedSidebar === "docked" ? this._wideSidebar : this._wide; - if ("setProperties" in el) { - // As long as we have Polymer panels - (el as PolymerElement).setProperties({ - route: this.routeTail, - hass: this.hass, - showAdvanced, - isWide, - narrow: this.narrow, - cloudStatus: this._cloudStatus, - }); - } else { - el.route = this.routeTail; - el.hass = this.hass; - el.showAdvanced = showAdvanced; - el.isWide = isWide; - el.narrow = this.narrow; - el.cloudStatus = this._cloudStatus; - } + return html` + ${isWide + ? html` +
+
Configuration
+
+ +
+
+ ` + : ""} + + `; } private async _updateCloudStatus() { @@ -223,6 +148,54 @@ class HaPanelConfig extends HassRouterPage { setTimeout(() => this._updateCloudStatus(), 5000); } } + + static get styles(): CSSResult { + return css` + :host { + display: block; + height: 100%; + background-color: var(--primary-background-color); + } + + a { + text-decoration: none; + color: var(--primary-text-color); + } + + .side-bar { + border-right: 1px solid #e0e0e0; + background: white; + width: 320px; + float: left; + box-sizing: border-box; + position: fixed; + } + + .toolbar { + display: flex; + align-items: center; + font-size: 20px; + height: 64px; + padding: 0 16px 0 16px; + pointer-events: none; + background-color: var(--primary-background-color); + font-weight: 400; + color: var(--primary-text-color); + border-bottom: 1px solid var(--divider-color); + } + + .wide-config { + float: right; + width: calc(100% - 320px); + height: 100%; + } + + .navigation { + height: calc(100vh - 64px); + overflow: auto; + } + `; + } } declare global { diff --git a/src/panels/config/integrations/ha-config-entries-dashboard.ts b/src/panels/config/integrations/ha-config-entries-dashboard.ts index 3c7f4c3370..d4d4091c5a 100644 --- a/src/panels/config/integrations/ha-config-entries-dashboard.ts +++ b/src/panels/config/integrations/ha-config-entries-dashboard.ts @@ -49,6 +49,7 @@ import { showConfirmationDialog } from "../../../dialogs/confirmation/show-dialo export class HaConfigManagerDashboard extends LitElement { @property() public hass!: HomeAssistant; @property() public showAdvanced!: boolean; + @property() public isWide!: boolean; @property() private configEntries!: ConfigEntry[]; @@ -72,7 +73,8 @@ export class HaConfigManagerDashboard extends LitElement { protected render(): TemplateResult { return html` + ${hass.localize("ui.panel.config.person.caption")} - +
${this.hass.localize("ui.panel.config.scene.picker.header")}
diff --git a/src/panels/config/scene/ha-scene-editor.ts b/src/panels/config/scene/ha-scene-editor.ts index a1407ee4f6..9e1e232a72 100644 --- a/src/panels/config/scene/ha-scene-editor.ts +++ b/src/panels/config/scene/ha-scene-editor.ts @@ -69,7 +69,7 @@ interface DeviceEntitiesLookup { @customElement("ha-scene-editor") export class HaSceneEditor extends SubscribeMixin(LitElement) { @property() public hass!: HomeAssistant; - @property() public narrow?: boolean; + @property() public isWide?: boolean; @property() public scene?: SceneEntity; @property() public creatingNew?: boolean; @property() public showAdvanced!: boolean; @@ -196,7 +196,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) { rtl: computeRTL(this.hass), })}" > - +
${this.scene ? computeStateName(this.scene) @@ -222,7 +222,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) { - +
${this.hass.localize( "ui.panel.config.scene.editor.devices.header" @@ -293,7 +293,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) { ${this.showAdvanced ? html` - +
${this.hass.localize( "ui.panel.config.scene.editor.entities.header" @@ -371,7 +371,7 @@ export class HaSceneEditor extends SubscribeMixin(LitElement) {
@@ -77,7 +78,7 @@ class HaScriptPicker extends LitElement { )}" @click=${this._runScript} > - +
${computeStateName(script)}
diff --git a/src/panels/config/server_control/ha-config-server-control.js b/src/panels/config/server_control/ha-config-server-control.js index cebf5243bd..27325ce499 100644 --- a/src/panels/config/server_control/ha-config-server-control.js +++ b/src/panels/config/server_control/ha-config-server-control.js @@ -35,6 +35,7 @@ class HaConfigServerControl extends LocalizeMixin(PolymerElement) {
- +