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

Better place where device edit button is on desktop (#8566)

Browse Source
This commit is contained in:
Paulus Schoutsen 2021-03-06 05:18:42 -08:00 committed by GitHub
parent f659a6fe37
commit 35f776284b
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 32 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
src/panels/config/devices/ha-config-device-page.ts
View File

@ -181,15 +181,17 @@ export class HaConfigDevicePage extends LitElement {
<span slot="header"> <span slot="header">
${computeDeviceName(device, this.hass)} ${computeDeviceName(device, this.hass)}
</span> </span>
<ha-icon-button
slot="toolbar-icon"
icon="hass:pencil"
@click=${this._showSettings}
></ha-icon-button>
` `
: "" : ""
} }
<ha-icon-button
slot="toolbar-icon"
icon="hass:cog"
@click=${this._showSettings}
></ha-icon-button>
<div class="container"> <div class="container">
<div class="header fullwidth"> <div class="header fullwidth">
@ -197,19 +199,25 @@ export class HaConfigDevicePage extends LitElement {
this.narrow this.narrow
? "" ? ""
: html` : html`
<div> <div class="header-name">
<h1>${computeDeviceName(device, this.hass)}</h1> <div>
${area <h1>${computeDeviceName(device, this.hass)}</h1>
? html` ${area
<a href="/config/areas/area/${area.area_id}" ? html`
>${this.hass.localize( <a href="/config/areas/area/${area.area_id}"
"ui.panel.config.integrations.config_entry.area", >${this.hass.localize(
"area", "ui.panel.config.integrations.config_entry.area",
area.name || "Unnamed Area" "area",
)}</a area.name || "Unnamed Area"
> )}</a
` >
: ""} `
: ""}
</div>
<ha-icon-button
icon="hass:pencil"
@click=${this._showSettings}
></ha-icon-button>
</div> </div>
` `
} }
@ -780,6 +788,12 @@ export class HaConfigDevicePage extends LitElement {
justify-content: space-between; justify-content: space-between;
} }
.header-name {
display: flex;
align-items: center;
padding-left: 8px;
}
.column, .column,
.fullwidth { .fullwidth {
padding: 8px; padding: 8px;