From 69cb21f21a6bb3678f7e5d8712a35a88eecbbf9d Mon Sep 17 00:00:00 2001
From: Amirhossein Mahmoodi <amir.mahmoodi74@gmail.com>
Date: Sat, 13 Jul 2024 15:56:02 +0330
Subject: [PATCH] scroll app

---
 src/app/template.js                                    | 10 +++++++---
 .../layouts/dashboard/headerWithSidebar/index.jsx      |  2 +-
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/app/template.js b/src/app/template.js
index 8db5145..3e14053 100644
--- a/src/app/template.js
+++ b/src/app/template.js
@@ -11,14 +11,18 @@ const Template = ({ children }) => {
             <ThemeProvider theme={theme}>
                 <GlobalStyles
                     styles={{
-                        "&::-webkit-scrollbar": {
+                        "*": {
+                            scrollbarWidth: "thin",
+                            scrollbarColor: `#155175 transparent`,
+                        },
+                        "*&::-webkit-scrollbar": {
                             width: "5px",
                         },
-                        "&::-webkit-scrollbar-track": {
+                        "*&::-webkit-scrollbar-track": {
                             boxShadow: "inset 0 0 5px #fff",
                             borderRadius: "5px",
                         },
-                        "&::-webkit-scrollbar-thumb": {
+                        "*&::-webkit-scrollbar-thumb": {
                             background: "#155175",
                             borderRadius: "5px",
                         },
diff --git a/src/components/layouts/dashboard/headerWithSidebar/index.jsx b/src/components/layouts/dashboard/headerWithSidebar/index.jsx
index 715588c..b430f1e 100644
--- a/src/components/layouts/dashboard/headerWithSidebar/index.jsx
+++ b/src/components/layouts/dashboard/headerWithSidebar/index.jsx
@@ -105,7 +105,7 @@ const HeaderWithSidebar = ({ children }) => {
             </Drawer>
             <Main open={open} sx={{ height: '100%', width: '100%', overflow: 'hidden' }}>
                 <DrawerHeader />
-                <Box sx={{ height: '100%', width: '100%', overflowY: 'scroll', overflowX: 'hidden', }}>
+                <Box sx={{ height: '100%', width: '100%', overflowY: 'auto', overflowX: 'hidden', }}>
                     {children}
                 </Box>
             </Main>