diff --git a/frontend/src/components/App/Layout.tsx b/frontend/src/components/App/Layout.tsx
index 5be1c59afa..6d6d77502a 100644
--- a/frontend/src/components/App/Layout.tsx
+++ b/frontend/src/components/App/Layout.tsx
@@ -202,12 +202,27 @@ export default function Layout({}: LayoutProps) {
       >
         {t('Skip to main content')}
       </Link>
-      <Box sx={{ display: 'flex', [theme.breakpoints.down('sm')]: { display: 'block' } }}>
+      <Box
+        sx={{
+          display: 'flex',
+          overflow: 'auto',
+          paddingTop: { sm: '64px', xs: '72px' },
+          height: '100vh',
+        }}
+      >
         <VersionDialog />
         <CssBaseline enableColorScheme />
         <TopBar />
         <Sidebar />
-        <Main id="main" sx={{ flexGrow: 1, marginLeft: 'initial' }}>
+        <Main
+          id="main"
+          sx={{
+            flexGrow: 1,
+            marginLeft: 'initial',
+            overflow: 'auto',
+            [theme.breakpoints.down('sm')]: { marginTop: { xs: '-12px', sm: '-8px' } },
+          }}
+        >
           {allClusters &&
           !!clusterInURL &&
           !Object.keys(allClusters).includes(getCluster() || '') ? (
@@ -217,7 +232,7 @@ export default function Layout({}: LayoutProps) {
           )}
           <AlertNotification />
           <Box>
-            <Div sx={theme.mixins.toolbar} />
+            <Div />
             <Container {...containerProps}>
               <NavigationTabs />
               {arePluginsLoaded && (
diff --git a/frontend/src/components/App/__snapshots__/TopBar.NoToken.stories.storyshot b/frontend/src/components/App/__snapshots__/TopBar.NoToken.stories.storyshot
index ddc6df30a2..a0ad4c190b 100644
--- a/frontend/src/components/App/__snapshots__/TopBar.NoToken.stories.storyshot
+++ b/frontend/src/components/App/__snapshots__/TopBar.NoToken.stories.storyshot
@@ -5,7 +5,7 @@
       class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation1 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-1nczbvg-MuiPaper-root-MuiAppBar-root"
     >
       <div
-        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-b3zdwt-MuiToolbar-root"
+        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-1g5gxk7-MuiToolbar-root"
       >
         <svg
           fill="none"
diff --git a/frontend/src/components/App/__snapshots__/TopBar.OneCluster.stories.storyshot b/frontend/src/components/App/__snapshots__/TopBar.OneCluster.stories.storyshot
index 339e216ae1..071496e27c 100644
--- a/frontend/src/components/App/__snapshots__/TopBar.OneCluster.stories.storyshot
+++ b/frontend/src/components/App/__snapshots__/TopBar.OneCluster.stories.storyshot
@@ -5,7 +5,7 @@
       class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation1 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-1nczbvg-MuiPaper-root-MuiAppBar-root"
     >
       <div
-        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-b3zdwt-MuiToolbar-root"
+        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-1g5gxk7-MuiToolbar-root"
       >
         <svg
           fill="none"
diff --git a/frontend/src/components/App/__snapshots__/TopBar.ProcessorAction.stories.storyshot b/frontend/src/components/App/__snapshots__/TopBar.ProcessorAction.stories.storyshot
index 3f3e9b4660..99aca52cbf 100644
--- a/frontend/src/components/App/__snapshots__/TopBar.ProcessorAction.stories.storyshot
+++ b/frontend/src/components/App/__snapshots__/TopBar.ProcessorAction.stories.storyshot
@@ -5,7 +5,7 @@
       class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation1 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-1nczbvg-MuiPaper-root-MuiAppBar-root"
     >
       <div
-        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-b3zdwt-MuiToolbar-root"
+        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-1g5gxk7-MuiToolbar-root"
       >
         <svg
           fill="none"
diff --git a/frontend/src/components/App/__snapshots__/TopBar.Token.stories.storyshot b/frontend/src/components/App/__snapshots__/TopBar.Token.stories.storyshot
index ddc6df30a2..a0ad4c190b 100644
--- a/frontend/src/components/App/__snapshots__/TopBar.Token.stories.storyshot
+++ b/frontend/src/components/App/__snapshots__/TopBar.Token.stories.storyshot
@@ -5,7 +5,7 @@
       class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation1 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-1nczbvg-MuiPaper-root-MuiAppBar-root"
     >
       <div
-        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-b3zdwt-MuiToolbar-root"
+        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-1g5gxk7-MuiToolbar-root"
       >
         <svg
           fill="none"
diff --git a/frontend/src/components/App/__snapshots__/TopBar.TwoCluster.stories.storyshot b/frontend/src/components/App/__snapshots__/TopBar.TwoCluster.stories.storyshot
index 5056db2e4e..e6e7da0fff 100644
--- a/frontend/src/components/App/__snapshots__/TopBar.TwoCluster.stories.storyshot
+++ b/frontend/src/components/App/__snapshots__/TopBar.TwoCluster.stories.storyshot
@@ -5,7 +5,7 @@
       class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation1 MuiAppBar-root MuiAppBar-colorPrimary MuiAppBar-positionFixed mui-fixed css-1nczbvg-MuiPaper-root-MuiAppBar-root"
     >
       <div
-        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-b3zdwt-MuiToolbar-root"
+        class="MuiToolbar-root MuiToolbar-gutters MuiToolbar-regular css-1g5gxk7-MuiToolbar-root"
       >
         <svg
           fill="none"
diff --git a/frontend/src/components/Sidebar/Sidebar.tsx b/frontend/src/components/Sidebar/Sidebar.tsx
index 529db8ab55..ec9e2bb0f0 100644
--- a/frontend/src/components/Sidebar/Sidebar.tsx
+++ b/frontend/src/components/Sidebar/Sidebar.tsx
@@ -248,6 +248,9 @@ export const PureSidebar = memo(
     linkArea,
   }: PureSidebarProps) => {
     const { t } = useTranslation();
+    const listContainerRef = React.useRef<HTMLDivElement | null>(null);
+    const [isOverflowing, setIsOverflowing] = React.useState(false);
+    const adjustedDrawerWidthClosed = isOverflowing ? 84 : 72;
     const temporarySideBarOpen = open === true && isTemporaryDrawer && openUserSelected === true;
 
     // The large sidebar does not open in medium view (600-960px).
@@ -276,8 +279,10 @@ export const PureSidebar = memo(
           })}
         />
         <Grid
+          ref={listContainerRef}
           sx={{
             height: '100%',
+            overflowY: 'auto',
           }}
           container
           direction="column"
@@ -336,6 +341,23 @@ export const PureSidebar = memo(
         }
       : {};
 
+    React.useEffect(() => {
+      const el = listContainerRef.current;
+      if (!el) {
+        return;
+      }
+
+      const observer = new ResizeObserver(() => {
+        setIsOverflowing(el.scrollHeight > el.clientHeight);
+      });
+
+      observer.observe(el);
+
+      setIsOverflowing(el.scrollHeight > el.clientHeight);
+
+      return () => observer.disconnect();
+    }, [items]);
+
     return (
       <Box component="nav" aria-label={t('translation|Navigation')}>
         <Drawer
@@ -362,16 +384,7 @@ export const PureSidebar = memo(
                 duration: theme.transitions.duration.leavingScreen,
               }),
               overflowX: 'hidden',
-              width: '56px',
-              [theme.breakpoints.down('xs')]: {
-                background: 'initial',
-              },
-              [theme.breakpoints.down('sm')]: {
-                width: theme.spacing(0),
-              },
-              [theme.breakpoints.up('sm')]: {
-                width: '72px',
-              },
+              width: `${adjustedDrawerWidthClosed}px`,
               background: theme.palette.sidebarBg,
             };
 
diff --git a/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarClosed.stories.storyshot b/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarClosed.stories.storyshot
index b2a45a4e17..d3783e5e4c 100644
--- a/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarClosed.stories.storyshot
+++ b/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarClosed.stories.storyshot
@@ -5,16 +5,16 @@
       class="MuiBox-root css-0"
     >
       <div
-        class="MuiDrawer-root MuiDrawer-docked css-1p9jtjb-MuiDrawer-docked"
+        class="MuiDrawer-root MuiDrawer-docked css-1g0cdoa-MuiDrawer-docked"
       >
         <div
           class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiDrawer-paper MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft css-12i7wg6-MuiPaper-root-MuiDrawer-paper"
         >
           <div
-            class="MuiBox-root css-6r4z7i"
+            class="MuiBox-root css-dak3i4"
           />
           <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-tf9pd2-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-opqjvv-MuiGrid-root"
           >
             <div
               class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
diff --git a/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarOpen.stories.storyshot b/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarOpen.stories.storyshot
index 5411e949ae..bc0857f80b 100644
--- a/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarOpen.stories.storyshot
+++ b/frontend/src/components/Sidebar/__snapshots__/Sidebar.HomeSidebarOpen.stories.storyshot
@@ -11,10 +11,10 @@
           class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiDrawer-paper MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft css-12i7wg6-MuiPaper-root-MuiDrawer-paper"
         >
           <div
-            class="MuiBox-root css-6r4z7i"
+            class="MuiBox-root css-dak3i4"
           />
           <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-tf9pd2-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-opqjvv-MuiGrid-root"
           >
             <div
               class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
diff --git a/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarClosed.stories.storyshot b/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarClosed.stories.storyshot
index 4146ec27ef..65c17dc087 100644
--- a/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarClosed.stories.storyshot
+++ b/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarClosed.stories.storyshot
@@ -5,16 +5,16 @@
       class="MuiBox-root css-0"
     >
       <div
-        class="MuiDrawer-root MuiDrawer-docked css-1p9jtjb-MuiDrawer-docked"
+        class="MuiDrawer-root MuiDrawer-docked css-1g0cdoa-MuiDrawer-docked"
       >
         <div
           class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiDrawer-paper MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft css-12i7wg6-MuiPaper-root-MuiDrawer-paper"
         >
           <div
-            class="MuiBox-root css-6r4z7i"
+            class="MuiBox-root css-dak3i4"
           />
           <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-tf9pd2-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-opqjvv-MuiGrid-root"
           >
             <div
               class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
diff --git a/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarOpen.stories.storyshot b/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarOpen.stories.storyshot
index 67544741f4..c1638e4a7d 100644
--- a/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarOpen.stories.storyshot
+++ b/frontend/src/components/Sidebar/__snapshots__/Sidebar.InClusterSidebarOpen.stories.storyshot
@@ -11,10 +11,10 @@
           class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiDrawer-paper MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft css-12i7wg6-MuiPaper-root-MuiDrawer-paper"
         >
           <div
-            class="MuiBox-root css-6r4z7i"
+            class="MuiBox-root css-dak3i4"
           />
           <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-tf9pd2-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-opqjvv-MuiGrid-root"
           >
             <div
               class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
diff --git a/frontend/src/components/Sidebar/__snapshots__/Sidebar.SelectedItemWithSidebarOmitted.stories.storyshot b/frontend/src/components/Sidebar/__snapshots__/Sidebar.SelectedItemWithSidebarOmitted.stories.storyshot
index 25cd091be7..99cbfd5275 100644
--- a/frontend/src/components/Sidebar/__snapshots__/Sidebar.SelectedItemWithSidebarOmitted.stories.storyshot
+++ b/frontend/src/components/Sidebar/__snapshots__/Sidebar.SelectedItemWithSidebarOmitted.stories.storyshot
@@ -11,10 +11,10 @@
           class="MuiPaper-root MuiPaper-elevation MuiPaper-elevation0 MuiDrawer-paper MuiDrawer-paperAnchorLeft MuiDrawer-paperAnchorDockedLeft css-12i7wg6-MuiPaper-root-MuiDrawer-paper"
         >
           <div
-            class="MuiBox-root css-6r4z7i"
+            class="MuiBox-root css-dak3i4"
           />
           <div
-            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-tf9pd2-MuiGrid-root"
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-column MuiGrid-wrap-xs-nowrap css-opqjvv-MuiGrid-root"
           >
             <div
               class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
diff --git a/frontend/src/lib/themes.ts b/frontend/src/lib/themes.ts
index 1a02dcd954..57f2ef090c 100644
--- a/frontend/src/lib/themes.ts
+++ b/frontend/src/lib/themes.ts
@@ -30,6 +30,14 @@ const commonRules = {
       xl: 1920,
     },
   },
+  mixins: {
+    toolbar: {
+      minHeight: 64,
+      '@media (max-width:600px)': {
+        minHeight: 60,
+      },
+    },
+  },
   palette: {
     primary: {
       contrastText: '#fff',