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

Fix background and padding on dashboard views (#16098)Co-authored-by: Bram Kragten <mail@bramkragten.nl>

Browse Source 
* Fix background and padding on dashboard views

* Clean code

* update fab position clean

---------

Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
Paul Bottein 2023-04-06 18:25:23 +02:00 committed by GitHub
parent de00842f22
commit cc4e815a58
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 14 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
src/panels/lovelace/hui-root.ts
View File

@ -1049,15 +1049,6 @@ class HUIRoot extends LitElement {
#view {
margin-top: calc(var(--header-height) + env(safe-area-inset-top));
height: calc(100vh - var(--header-height) - env(safe-area-inset-top));
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
background: var(
--lovelace-background,
var(--primary-background-color)
);
overflow: auto;
transform: translateZ(0);
display: flex;
}
/**
* In edit mode we have the tab bar on a new line *
@ -1070,19 +1061,17 @@ class HUIRoot extends LitElement {
var(--header-height) + 48px + env(safe-area-inset-top)
);
}
#view > * {
/**
* The view could get larger than the window in Firefox
* to prevent that we set the max-width to 100%
* flex-grow: 1 and flex-basis: 100% should make sure the view
* stays full width.
*
* https://github.com/home-assistant/home-assistant-polymer/pull/3806
*/
flex: 1 1 100%;
hui-view {
padding-left: env(safe-area-inset-left);
padding-right: env(safe-area-inset-right);
background: var(
--lovelace-background,
var(--primary-background-color)
);
overflow: auto;
width: 100%;
height: 100%;
max-width: 100%;
padding-bottom: env(safe-area-inset-bottom);
transform: translateZ(0);
display: block;
}
.hide-tab {

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

@ -298,8 +298,7 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
:host {
display: block;
padding-top: 4px;
height: 100%;
box-sizing: border-box;
padding-bottom: env(safe-area-inset-bottom);
}
.badges {
@ -328,15 +327,13 @@ export class MasonryView extends LitElement implements LovelaceViewElement {
}
ha-fab {
position: sticky;
float: right;
position: absolute;
right: calc(16px + env(safe-area-inset-right));
bottom: calc(16px + env(safe-area-inset-bottom));
z-index: 1;
}
ha-fab.rtl {
float: left;
right: auto;
left: calc(16px + env(safe-area-inset-left));
}

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

@ -196,8 +196,7 @@ export class SideBarView extends LitElement implements LovelaceViewElement {
:host {
display: block;
padding-top: 4px;
height: 100%;
box-sizing: border-box;
padding-bottom: env(safe-area-inset-bottom);
}
.container {
@ -236,15 +235,13 @@ export class SideBarView extends LitElement implements LovelaceViewElement {
}
ha-fab {
position: sticky;
float: right;
position: absolute;
right: calc(16px + env(safe-area-inset-right));
bottom: calc(16px + env(safe-area-inset-bottom));
z-index: 1;
}
ha-fab.rtl {
float: left;
right: auto;
left: calc(16px + env(safe-area-inset-left));
}