diff --git a/src/panels/lovelace/editor/view-editor/hui-view-editor.ts b/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
index e2b7c330e9..71abdfe123 100644
--- a/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
+++ b/src/panels/lovelace/editor/view-editor/hui-view-editor.ts
@@ -4,6 +4,8 @@ import {
TemplateResult,
customElement,
property,
+ CSSResult,
+ css,
} from "lit-element";
import "@polymer/paper-input/paper-input";
@@ -80,20 +82,32 @@ export class HuiViewEditor extends LitElement {
${configElementStyle}
Panel Mode?${this.hass.localize(
+ "ui.panel.lovelace.editor.view.panel_mode.title"
+ )}
+ ${this.hass.localize(
+ "ui.panel.lovelace.editor.view.panel_mode.description"
+ )}
`;
@@ -147,6 +168,14 @@ export class HuiViewEditor extends LitElement {
const config = { ...this._config, path: slugify(ev.currentTarget.value) };
fireEvent(this, "view-config-changed", { config });
}
+
+ static get styles(): CSSResult {
+ return css`
+ .panel {
+ color: var(--secondary-text-color);
+ }
+ `;
+ }
}
declare global {
diff --git a/src/translations/en.json b/src/translations/en.json
index a302af1917..8889864451 100755
--- a/src/translations/en.json
+++ b/src/translations/en.json
@@ -1532,6 +1532,12 @@
"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": {