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

Allow edit card dialog to be made wider (#7492)

Browse Source
This commit is contained in:
Nathan Orick 2020-10-27 10:59:32 -04:00 committed by GitHub
parent a19477d179
commit 40191a88d4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -54,6 +54,8 @@ export class HuiDialogEditCard extends LitElement
implements HassDialog<EditCardDialogParams> { implements HassDialog<EditCardDialogParams> {
@property({ attribute: false }) public hass!: HomeAssistant; @property({ attribute: false }) public hass!: HomeAssistant;
@property({ type: Boolean, reflect: true }) public large = false;
@internalProperty() private _params?: EditCardDialogParams; @internalProperty() private _params?: EditCardDialogParams;
@internalProperty() private _cardConfig?: LovelaceCardConfig; @internalProperty() private _cardConfig?: LovelaceCardConfig;
@ -82,6 +84,7 @@ export class HuiDialogEditCard extends LitElement
this._viewConfig = params.lovelaceConfig.views[view]; this._viewConfig = params.lovelaceConfig.views[view];
this._cardConfig = this._cardConfig =
card !== undefined ? this._viewConfig.cards![card] : params.cardConfig; card !== undefined ? this._viewConfig.cards![card] : params.cardConfig;
this.large = false;
if (this._cardConfig && !Object.isFrozen(this._cardConfig)) { if (this._cardConfig && !Object.isFrozen(this._cardConfig)) {
this._cardConfig = deepFreeze(this._cardConfig); this._cardConfig = deepFreeze(this._cardConfig);
} }
@ -162,7 +165,7 @@ export class HuiDialogEditCard extends LitElement
> >
<div slot="heading"> <div slot="heading">
<ha-header-bar> <ha-header-bar>
<div slot="title">${heading}</div> <div slot="title" @click=${this._enlarge}>${heading}</div>
${this._documentationURL !== undefined ${this._documentationURL !== undefined
? html` ? html`
<a <a
@ -254,6 +257,10 @@ export class HuiDialogEditCard extends LitElement
`; `;
} }
private _enlarge() {
this.large = !this.large;
}
private _ignoreKeydown(ev: KeyboardEvent) { private _ignoreKeydown(ev: KeyboardEvent) {
ev.stopPropagation(); ev.stopPropagation();
} }
@ -374,6 +381,15 @@ export class HuiDialogEditCard extends LitElement
--dialog-z-index: 5; --dialog-z-index: 5;
} }
@media all and (min-width: 451px) and (min-height: 501px) {
ha-dialog {
--mdc-dialog-max-width: 90vw;
}
:host([large]) .content {
width: calc(90vw - 48px);
}
}
ha-header-bar { ha-header-bar {
--mdc-theme-on-primary: var(--primary-text-color); --mdc-theme-on-primary: var(--primary-text-color);
--mdc-theme-primary: var(--mdc-theme-surface); --mdc-theme-primary: var(--mdc-theme-surface);