From 09c9f2ea6d7b13419d374d5af5dd78e24e3b9b8e Mon Sep 17 00:00:00 2001 From: Andreas Nordahl Date: Tue, 2 Jul 2024 10:44:20 +0200 Subject: [PATCH 1/2] use dynamic view height for mobile menu height --- packages/client/src/styles/dropdown-menu.module.css | 12 +----------- 1 file changed, 1 insertion(+), 11 deletions(-) diff --git a/packages/client/src/styles/dropdown-menu.module.css b/packages/client/src/styles/dropdown-menu.module.css index 322b0520..26d2b410 100644 --- a/packages/client/src/styles/dropdown-menu.module.css +++ b/packages/client/src/styles/dropdown-menu.module.css @@ -26,21 +26,11 @@ transition-timing-function: ease-in-out; z-index: 1; height: calc(100vh - var(--header-height)); + height: calc(100dvh - var(--header-height)); overflow-y: auto; overscroll-behavior: contain; @media (min-width: 768px) { height: initial; } - - /* Quick fix for mobile browser bar etc overlapping the menu container. - This component should be rewritten to NOT use vh units - */ - @media (max-width: 768px) { - &:after { - content: ""; - display: block; - height: 6rem; - } - } } From 32e1ce2dca59ffc8e09da37d9a3bb68e8d1155d7 Mon Sep 17 00:00:00 2001 From: Andreas Nordahl Date: Wed, 3 Jul 2024 13:44:06 +0200 Subject: [PATCH 2/2] -6rem --- packages/client/src/styles/dropdown-menu.module.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/client/src/styles/dropdown-menu.module.css b/packages/client/src/styles/dropdown-menu.module.css index 26d2b410..2a7c6160 100644 --- a/packages/client/src/styles/dropdown-menu.module.css +++ b/packages/client/src/styles/dropdown-menu.module.css @@ -25,7 +25,7 @@ transition-property: max-height; transition-timing-function: ease-in-out; z-index: 1; - height: calc(100vh - var(--header-height)); + height: calc(100vh - var(--header-height) - 6rem); height: calc(100dvh - var(--header-height)); overflow-y: auto; overscroll-behavior: contain;