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

Make space for fab (#17070)

Browse Source
This commit is contained in:
Bram Kragten 2023-06-28 15:55:12 +02:00 committed by GitHub
parent 625da46da9
commit e6d77af438
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 16 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/panels/lovelace/views/hui-masonry-view.ts
View File

@ -90,9 +90,12 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
protected render(): TemplateResult { protected render(): TemplateResult {
return html` return html`
${this.badges.length > 0 ${this.badges.length > 0
? html` <div class="badges">${this.badges}</div>` ? html`<div class="badges">${this.badges}</div>`
: ""} : ""}
<div id="columns"></div> <div
id="columns"
class=${this.lovelace?.editMode ? "edit-mode" : ""}
></div>
${this.lovelace?.editMode ${this.lovelace?.editMode
? html` ? html`
<ha-fab <ha-fab
@ -315,6 +318,10 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
margin-right: 4px; margin-right: 4px;
} }
#columns.edit-mode {
margin-bottom: 72px;
}
.column { .column {
flex: 1 0 0; flex: 1 0 0;
max-width: 500px; max-width: 500px;

8
src/panels/lovelace/views/hui-sidebar-view.ts
View File

@ -91,7 +91,9 @@ export class SideBarView extends LitElement implements LovelaceViewElement {
protected render(): TemplateResult { protected render(): TemplateResult {
return html` return html`
<div class="container"></div> <div
class="container ${this.lovelace?.editMode ? "edit-mode" : ""}"
></div>
${this.lovelace?.editMode ${this.lovelace?.editMode
? html` ? html`
<ha-fab <ha-fab
@ -205,6 +207,10 @@ export class SideBarView extends LitElement implements LovelaceViewElement {
margin-right: 4px; margin-right: 4px;
} }
.container.edit-mode {
margin-bottom: 72px;
}
#main { #main {
max-width: 1620px; max-width: 1620px;
flex-grow: 2; flex-grow: 2;