translate view editor and explain panel mode (#4043)

This commit is contained in:
Ian Richardson 2019-10-18 09:28:31 -05:00 committed by Bram Kragten
parent 00f2d36cb5
commit 67d8d48855
2 changed files with 39 additions and 4 deletions

View File

@ -4,6 +4,8 @@ import {
TemplateResult, TemplateResult,
customElement, customElement,
property, property,
CSSResult,
css,
} from "lit-element"; } from "lit-element";
import "@polymer/paper-input/paper-input"; import "@polymer/paper-input/paper-input";
@ -80,20 +82,32 @@ export class HuiViewEditor extends LitElement {
${configElementStyle} ${configElementStyle}
<div class="card-config"> <div class="card-config">
<paper-input <paper-input
label="Title" .label="${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.title"
)} (${this.hass.localize(
"ui.panel.lovelace.editor.card.config.optional"
)})"
.value=${this._title} .value=${this._title}
.configValue=${"title"} .configValue=${"title"}
@value-changed=${this._valueChanged} @value-changed=${this._valueChanged}
@blur=${this._handleTitleBlur} @blur=${this._handleTitleBlur}
></paper-input> ></paper-input>
<paper-input <paper-input
label="Icon" .label="${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.icon"
)} (${this.hass.localize(
"ui.panel.lovelace.editor.card.config.optional"
)})"
.value=${this._icon} .value=${this._icon}
.configValue=${"icon"} .configValue=${"icon"}
@value-changed=${this._valueChanged} @value-changed=${this._valueChanged}
></paper-input> ></paper-input>
<paper-input <paper-input
label="URL Path" .label="${this.hass.localize(
"ui.panel.lovelace.editor.card.generic.url"
)} (${this.hass.localize(
"ui.panel.lovelace.editor.card.config.optional"
)})"
.value=${this._path} .value=${this._path}
.configValue=${"path"} .configValue=${"path"}
@value-changed=${this._valueChanged} @value-changed=${this._valueChanged}
@ -108,7 +122,14 @@ export class HuiViewEditor extends LitElement {
?checked=${this._panel !== false} ?checked=${this._panel !== false}
.configValue=${"panel"} .configValue=${"panel"}
@change=${this._valueChanged} @change=${this._valueChanged}
>Panel Mode?</ha-switch >${this.hass.localize(
"ui.panel.lovelace.editor.view.panel_mode.title"
)}</ha-switch
>
<span class="panel"
>${this.hass.localize(
"ui.panel.lovelace.editor.view.panel_mode.description"
)}</span
> >
</div> </div>
`; `;
@ -147,6 +168,14 @@ export class HuiViewEditor extends LitElement {
const config = { ...this._config, path: slugify(ev.currentTarget.value) }; const config = { ...this._config, path: slugify(ev.currentTarget.value) };
fireEvent(this, "view-config-changed", { config }); fireEvent(this, "view-config-changed", { config });
} }
static get styles(): CSSResult {
return css`
.panel {
color: var(--secondary-text-color);
}
`;
}
} }
declare global { declare global {

View File

@ -1532,6 +1532,12 @@
"weather-forecast": { "weather-forecast": {
"name": "Weather Forecast" "name": "Weather Forecast"
} }
},
"view": {
"panel_mode": {
"title": "Panel Mode?",
"description": "This renders the first card at full width; other cards in this view will not be rendered."
}
} }
}, },
"warning": { "warning": {