From 2e3f48a49dde34f7e94314727a41972f3dcf19c8 Mon Sep 17 00:00:00 2001
From: Ashley Harrison <ashley.harrison@grafana.com>
Date: Tue, 6 Aug 2024 10:51:31 +0200
Subject: [PATCH] Navigation: Fix browse dashboards/scenes dashboards when
 `bodyScrolling` is enabled (#91479)

set explicit height (not min-height) so everything works in safari
---
 .../src/themes/GlobalStyles/page.ts           |  2 +-
 .../scene/DashboardSceneRenderer.tsx          | 29 ++++++++++++-------
 2 files changed, 19 insertions(+), 12 deletions(-)

diff --git a/packages/grafana-ui/src/themes/GlobalStyles/page.ts b/packages/grafana-ui/src/themes/GlobalStyles/page.ts
index ba925349ec3..95f25fe6584 100644
--- a/packages/grafana-ui/src/themes/GlobalStyles/page.ts
+++ b/packages/grafana-ui/src/themes/GlobalStyles/page.ts
@@ -12,7 +12,7 @@ export function getPageStyles(theme: GrafanaTheme2) {
       ? {
           display: 'flex',
           flexDirection: 'column',
-          minHeight: '100vh',
+          height: '100vh',
         }
       : {
           display: 'flex',
diff --git a/public/app/features/dashboard-scene/scene/DashboardSceneRenderer.tsx b/public/app/features/dashboard-scene/scene/DashboardSceneRenderer.tsx
index 97cc9322015..a06650ad702 100644
--- a/public/app/features/dashboard-scene/scene/DashboardSceneRenderer.tsx
+++ b/public/app/features/dashboard-scene/scene/DashboardSceneRenderer.tsx
@@ -4,6 +4,7 @@ import { useMedia } from 'react-use';
 
 import { GrafanaTheme2, PageLayoutType } from '@grafana/data';
 import { selectors } from '@grafana/e2e-selectors';
+import { config } from '@grafana/runtime';
 import { SceneComponentProps } from '@grafana/scenes';
 import { CustomScrollbar, useStyles2, useTheme2 } from '@grafana/ui';
 import { Page } from 'app/core/components/Page/Page';
@@ -93,18 +94,24 @@ export function DashboardSceneRenderer({ model }: SceneComponentProps<DashboardS
 
 function getStyles(theme: GrafanaTheme2) {
   return {
-    pageContainer: css({
-      display: 'grid',
-      gridTemplateAreas: `
-        "panels"`,
-      gridTemplateColumns: `1fr`,
-      gridTemplateRows: '1fr',
-      height: '100%',
-      [theme.breakpoints.down('sm')]: {
-        display: 'flex',
-        flexDirection: 'column',
+    pageContainer: css(
+      {
+        display: 'grid',
+        gridTemplateAreas: `
+  "panels"`,
+        gridTemplateColumns: `1fr`,
+        gridTemplateRows: '1fr',
+        height: '100%',
+        [theme.breakpoints.down('sm')]: {
+          display: 'flex',
+          flexDirection: 'column',
+        },
       },
-    }),
+      config.featureToggles.bodyScrolling && {
+        position: 'absolute',
+        width: '100%',
+      }
+    ),
     pageContainerWithControls: css({
       gridTemplateAreas: `
         "controls"