jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-08-01 05:27:46 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI tweaks for BP (#7883)

Browse Source 
Co-authored-by: Paulus Schoutsen <balloob@gmail.com>
This commit is contained in:
Bram Kragten 2020-12-03 14:18:17 +01:00 committed by GitHub
parent 7b560c727f
commit 3e4955becd
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 43 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/ha-blueprint-picker.ts
View File

@ -52,6 +52,7 @@ class HaBluePrintPicker extends LitElement {
.label=${this.label || .label=${this.label ||
this.hass.localize("ui.components.blueprint-picker.label")} this.hass.localize("ui.components.blueprint-picker.label")}
.disabled=${this.disabled} .disabled=${this.disabled}
horizontal-align="left"
> >
<paper-listbox <paper-listbox
slot="dropdown-content" slot="dropdown-content"

16
src/components/ha-settings-row.ts
View File

@ -18,11 +18,6 @@ export class HaSettingsRow extends LitElement {
protected render(): SVGTemplateResult { protected render(): SVGTemplateResult {
return html` return html`
<style>
paper-item-body {
padding-right: 16px;
}
</style>
<paper-item-body <paper-item-body
?two-line=${!this.threeLine} ?two-line=${!this.threeLine}
?three-line=${this.threeLine} ?three-line=${this.threeLine}
@ -43,6 +38,14 @@ export class HaSettingsRow extends LitElement {
align-self: auto; align-self: auto;
align-items: center; align-items: center;
} }
paper-item-body {
padding: 8px 16px 8px 0;
}
paper-item-body[two-line] {
min-height: calc(
var(--paper-item-body-two-line-min-height, 72px) - 16px
);
}
:host([narrow]) { :host([narrow]) {
align-items: normal; align-items: normal;
flex-direction: column; flex-direction: column;
@ -52,6 +55,9 @@ export class HaSettingsRow extends LitElement {
::slotted(ha-switch) { ::slotted(ha-switch) {
padding: 16px 0; padding: 16px 0;
} }
div[secondary] {
white-space: normal;
}
`; `;
} }
} }

61
src/panels/config/automation/blueprint-automation-editor.ts
View File

@ -157,42 +157,37 @@ export class HaBlueprintAutomationEditor extends LitElement {
There is an error in this Blueprint: ${blueprint.error} There is an error in this Blueprint: ${blueprint.error}
</p>` </p>`
: html`${blueprint?.metadata.description : html`${blueprint?.metadata.description
? html`<p>${blueprint.metadata.description}</p>` ? html`<p class="card-content">
${blueprint.metadata.description}
</p>`
: ""} : ""}
${blueprint?.metadata?.input && ${blueprint?.metadata?.input &&
Object.keys(blueprint.metadata.input).length Object.keys(blueprint.metadata.input).length
? html`<h3> ? Object.entries(blueprint.metadata.input).map(
${this.hass.localize( ([key, value]) =>
"ui.panel.config.automation.editor.blueprint.inputs" html`<ha-settings-row .narrow=${this.narrow}>
)} <span slot="heading">${value?.name || key}</span>
</h3> <span slot="description">${value?.description}</span>
${Object.entries(blueprint.metadata.input).map( ${value?.selector
([key, value]) => ? html`<ha-selector
html`<ha-settings-row .narrow=${this.narrow}> .hass=${this.hass}
<span slot="heading">${value?.name || key}</span> .selector=${value.selector}
<span slot="description" .key=${key}
>${value?.description}</span .value=${(this.config.use_blueprint.input &&
> this.config.use_blueprint.input[key]) ||
${value?.selector value?.default}
? html`<ha-selector @value-changed=${this._inputChanged}
.hass=${this.hass} ></ha-selector>`
.selector=${value.selector} : html`<paper-input
.key=${key} .key=${key}
.value=${(this.config.use_blueprint.input && required
this.config.use_blueprint.input[key]) || .value=${this.config.use_blueprint.input &&
value?.default} this.config.use_blueprint.input[key]}
@value-changed=${this._inputChanged} @value-changed=${this._inputChanged}
></ha-selector>` no-label-float
: html`<paper-input ></paper-input>`}
.key=${key} </ha-settings-row>`
required )
.value=${this.config.use_blueprint.input &&
this.config.use_blueprint.input[key]}
@value-changed=${this._inputChanged}
no-label-float
></paper-input>`}
</ha-settings-row>`
)}`
: html`<p class="padding"> : html`<p class="padding">
${this.hass.localize( ${this.hass.localize(
"ui.panel.config.automation.editor.blueprint.no_inputs" "ui.panel.config.automation.editor.blueprint.no_inputs"

6
src/panels/config/blueprint/ha-blueprint-overview.ts
View File

@ -112,7 +112,6 @@ class HaBlueprintOverview extends LitElement {
create: { create: {
title: "", title: "",
type: narrow ? "icon-button" : undefined, type: narrow ? "icon-button" : undefined,
width: narrow ? undefined : "180px",
template: (_, blueprint: any) => template: (_, blueprint: any) =>
blueprint.error blueprint.error
? "" ? ""
@ -126,8 +125,9 @@ class HaBlueprintOverview extends LitElement {
"ui.panel.config.blueprint.overview.use_blueprint" "ui.panel.config.blueprint.overview.use_blueprint"
)} )}
@click=${(ev) => this._createNew(ev)} @click=${(ev) => this._createNew(ev)}
><ha-svg-icon .path=${mdiRobot}></ha-svg-icon >
></mwc-icon-button>` <ha-svg-icon .path=${mdiRobot}></ha-svg-icon>
</mwc-icon-button>`
: html`<mwc-button : html`<mwc-button
.blueprint=${blueprint} .blueprint=${blueprint}
@click=${(ev) => this._createNew(ev)} @click=${(ev) => this._createNew(ev)}

1
src/translations/en.json
View File

@ -1161,7 +1161,6 @@
"blueprint_to_use": "Blueprint to use", "blueprint_to_use": "Blueprint to use",
"no_blueprints": "You don't have any blueprints", "no_blueprints": "You don't have any blueprints",
"manage_blueprints": "Manage Blueprints", "manage_blueprints": "Manage Blueprints",
"inputs": "Inputs",
"no_inputs": "This blueprint doesn't have any inputs." "no_inputs": "This blueprint doesn't have any inputs."
}, },
"modes": { "modes": {