assets/stylesheets/App.css

@@ -143,11 +143,21 @@ html.macos-vibrancy .main-layout {
   background: transparent !important;
 }
 
-html.macos-vibrancy .light-mode .ant-layout.main-content-layout {
+html.macos-vibrancy .light-mode .ant-layout.main-content-layout,
+html.macos-vibrancy
+  .light-mode
+  .dashboard-splitter.farmcontrol-splitter
+  > .ant-splitter-bar
+  .ant-splitter-bar-dragger:before {
   background: rgba(255, 255, 255, 0.88) !important;
 }
 
-html.macos-vibrancy .dark-mode .ant-layout.main-content-layout {
+html.macos-vibrancy .dark-mode .ant-layout.main-content-layout,
+html.macos-vibrancy
+  .dark-mode
+  .dashboard-splitter.farmcontrol-splitter
+  > .ant-splitter-bar
+  .ant-splitter-bar-dragger:before {
   background: rgba(0, 0, 0, 0.88) !important;
 }
 
@@ -1558,10 +1568,6 @@ span.ant-skeleton-input.ant-skeleton-input-sm.text-skeleton {
   margin: 0;
 }
 
-.dashboard-splitter.farmcontrol-splitter > .ant-splitter-panel {
-  padding: 0;
-}
-
 .dashboard-splitter.farmcontrol-splitter
   > .ant-splitter-bar
   .ant-splitter-bar-dragger::before {

src/components/Dashboard/Layout.jsx

@@ -51,10 +51,7 @@ const DashboardLayout = ({ children }) => {
       >
         <DashboardNavigation />
         <DashboardSidebarSplitter sidebar={sidebar}>
-          <Layout
+          <Layout style={{ padding: '24px' }} className='main-content-layout'>
-            style={{ padding: '24px', height: '100%' }}
-            className='main-content-layout'
-          >
             <Content>
               <Flex vertical style={{ height: '100%' }} gap='20px'>
                 <Flex justify='space-between'>