Merge branch 'master' into style/round-icon-button-colour

IDEMSInternational · Jan 7, 2025 · be4865d · be4865d
2 parents af5101d + 806696a
commit be4865d
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 3 deletions.
diff --git a/src/app/feature/nav-stack/components/nav-stack/nav-stack.component.global.scss b/src/app/feature/nav-stack/components/nav-stack/nav-stack.component.global.scss
@@ -20,7 +20,7 @@ ion-modal.nav-stack-modal {
   &::part(content) {
     border-radius: var(--border-radius) var(--border-radius) 0 0;
     position: absolute;
-    bottom: 0px;
+    bottom: calc(0px + var(--ion-safe-area-bottom, 0));
   }
 
   ion-toolbar {

diff --git a/src/theme/variables.scss b/src/theme/variables.scss
@@ -18,8 +18,10 @@
 
 /** Ionic CSS Variables **/
 :root {
-  // The total height of the central safe area of the device viewport
-  --safe-area-height: calc(100vh - var(--ion-safe-area-top, 0) - var(--ion-safe-area-bottom, 0));
+  // The total height of the central safe area of the device viewport.
+  // Use 100% rather than 100vh to handle browsers with toolbars,
+  // see https://github.com/IDEMSInternational/open-app-builder/issues/2680
+  --safe-area-height: calc(100% - var(--ion-safe-area-top, 0) - var(--ion-safe-area-bottom, 0));
 
   // Margins //
   --row-margin-top: 1em; // used in downstream calculations, e.g. sticky display-group