Navigation: Fix browse dashboards/scenes dashboards when `bodyScrolling` is enabled (#91479)

set explicit height (not min-height) so everything works in safari

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',

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"