From f180e7672cebc376e6990260009cb2434a80bf0e Mon Sep 17 00:00:00 2001 From: Bram Kragten Date: Wed, 25 Sep 2019 16:19:06 +0200 Subject: [PATCH 1/3] Fix firefox overflow MIght fix... --- src/panels/lovelace/hui-root.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts index 9f57cd25a884..9d019cef0b04 100644 --- a/src/panels/lovelace/hui-root.ts +++ b/src/panels/lovelace/hui-root.ts @@ -364,8 +364,8 @@ class HUIRoot extends LitElement { display: flex; } #view > * { - flex: 1; - width: 100%; + flex: 1 1 100%; + max-width: 100%; } #view.tabs-hidden { min-height: calc(100vh - 64px); From 3e15449c6b97719793a3619ba9cb923948da780d Mon Sep 17 00:00:00 2001 From: Bram Kragten Date: Wed, 25 Sep 2019 21:28:18 +0200 Subject: [PATCH 2/3] Add comment --- src/panels/lovelace/hui-root.ts | 8 ++++++++ 1 file changed, 8 insertions(+) diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts index 9d019cef0b04..b4d60a879cd9 100644 --- a/src/panels/lovelace/hui-root.ts +++ b/src/panels/lovelace/hui-root.ts @@ -364,6 +364,14 @@ class HUIRoot extends LitElement { display: flex; } #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%; max-width: 100%; } From 5240d4804003140dc18e9a4b0511283be7f470f3 Mon Sep 17 00:00:00 2001 From: Bram Kragten Date: Wed, 25 Sep 2019 21:30:25 +0200 Subject: [PATCH 3/3] Align --- src/panels/lovelace/hui-root.ts | 26 +++++++++++++------------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/panels/lovelace/hui-root.ts b/src/panels/lovelace/hui-root.ts index b4d60a879cd9..7788d2411689 100644 --- a/src/panels/lovelace/hui-root.ts +++ b/src/panels/lovelace/hui-root.ts @@ -354,24 +354,24 @@ class HUIRoot extends LitElement { #view { min-height: calc(100vh - 112px); /** - * Since we only set min-height, if child nodes need percentage - * heights they must use absolute positioning so we need relative - * positioning here. - * - * https://www.w3.org/TR/CSS2/visudet.html#the-height-property - */ + * Since we only set min-height, if child nodes need percentage + * heights they must use absolute positioning so we need relative + * positioning here. + * + * https://www.w3.org/TR/CSS2/visudet.html#the-height-property + */ position: relative; display: flex; } #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 - */ + * 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%; max-width: 100%; }