jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-29 12:16:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

Edit card fixes (#3043)

Browse Source
This commit is contained in:
Paulus Schoutsen 2019-03-31 19:38:11 -07:00 committed by GitHub
parent 22fdac4189
commit dc61a62149
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 28 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/panels/lovelace/editor/card-editor/hui-card-preview.ts
View File

@ -37,6 +37,14 @@ export class HuiCardPreview extends HTMLElement {
set config(configValue: LovelaceCardConfig) { set config(configValue: LovelaceCardConfig) {
if (!configValue) { if (!configValue) {
this._cleanup();
return;
}
if (!configValue.type) {
this._createCard(
createErrorCardConfig("No card type found", configValue)
);
return; return;
} }
@ -59,10 +67,7 @@ export class HuiCardPreview extends HTMLElement {
} }
private _createCard(configValue: LovelaceCardConfig): void { private _createCard(configValue: LovelaceCardConfig): void {
if (this._element) { this._cleanup();
this.removeChild(this._element);
}
this._element = createCardElement(configValue); this._element = createCardElement(configValue);
if (this._hass) { if (this._hass) {
@ -71,6 +76,14 @@ export class HuiCardPreview extends HTMLElement {
this.appendChild(this._element!); this.appendChild(this._element!);
} }
private _cleanup() {
if (!this._element) {
return;
}
this.removeChild(this._element);
this._element = undefined;
}
} }
declare global { declare global {

16
src/panels/lovelace/editor/card-editor/hui-edit-card.ts
View File

@ -247,8 +247,8 @@ export class HuiEditCard extends LitElement {
} }
private _handleYamlChanged(ev: CustomEvent): void { private _handleYamlChanged(ev: CustomEvent): void {
this._cardConfig = yaml.safeLoad(ev.detail.value);
try { try {
this._cardConfig = yaml.safeLoad(ev.detail.value);
this._updatePreview(this._cardConfig!); this._updatePreview(this._cardConfig!);
this._configState = "OK"; this._configState = "OK";
} catch (err) { } catch (err) {
@ -392,20 +392,20 @@ export class HuiEditCard extends LitElement {
@media all and (max-width: 450px), all and (max-height: 500px) { @media all and (max-width: 450px), all and (max-height: 500px) {
/* overrule the ha-style-dialog max-height on small screens */ /* overrule the ha-style-dialog max-height on small screens */
paper-dialog { ha-paper-dialog {
max-height: 100%; max-height: 100%;
height: 100%; height: 100%;
} }
} }
@media all and (min-width: 660px) { @media all and (min-width: 660px) {
paper-dialog { ha-paper-dialog {
width: 650px; width: 845px;
} }
} }
paper-dialog { ha-paper-dialog {
max-width: 650px; max-width: 845px;
} }
.center { .center {
@ -420,7 +420,8 @@ export class HuiEditCard extends LitElement {
} }
.content hui-card-preview { .content hui-card-preview {
margin-top: 16px; margin-top: 16px;
margin: 0 10px; margin: 0 auto;
max-width: 390px;
} }
.content .element-editor { .content .element-editor {
margin: 0 10px; margin: 0 10px;
@ -442,6 +443,7 @@ export class HuiEditCard extends LitElement {
min-width: 0; min-width: 0;
} }
.content hui-card-preview { .content hui-card-preview {
padding-top: 0;
margin: 0 10px; margin: 0 10px;
max-width: 490px; max-width: 490px;
} }

3
src/resources/styles.ts
View File

@ -72,7 +72,8 @@ export const haStyleDialog = css`
} }
@media all and (max-width: 450px), all and (max-height: 500px) { @media all and (max-width: 450px), all and (max-height: 500px) {
paper-dialog { paper-dialog,
ha-paper-dialog {
margin: 0; margin: 0;
width: 100% !important; width: 100% !important;
max-height: calc(100% - 64px); max-height: calc(100% - 64px);