first commit

2025-07-21 05:51:52 -04:00
commit 7e28fc8f51
114 changed files with 23749 additions and 0 deletions
@@ -0,0 +1,57 @@
+import { Outlet } from 'react-router-dom'
+
+import DashboardHeader from './DashboardHeader'
+import { generalLayoutContext } from '../../context/GeneralLayoutContext'
+import DashboardAside from './aside/DashboardAside'
+import RightAsideBar from './rightaside/RightAsideBar'
+
+export default function DashboardLayout() {
+
+    // let {pathname} = useLocation()
+
+  const {showAsideDrawer, setShowAsideDrawer} = generalLayoutContext()
+  
+  return (
+    <div className='w-full flex gap-10 relative m-auto h-screen overflow-x-hidden overflow-y-auto bg-white-body dark:bg-black-body p-8 pt-0 lg:p-10'>
+        <div className='hidden lg:block min-w-[300px] px-8 py-4 rounded-3xl sticky top-0 h-full bg-white-aside dark:bg-black-aside shadow-round_black dark:shadow-round_white'>
+            <DashboardAside />
+        </div>
+
+        <div className={`${showAsideDrawer =='aside' ? 'left-0' : '-left-full'} lg:hidden w-full fixed inset-0 z-[999]`}>
+            <div className={`${showAsideDrawer =='aside' ? 'fixed left-0 top-0 inset-0' : '-left-full'} w-full bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div>
+            <div className={`fixed px-8 py-4 h-full w-4/5 sm:w-[400px] bg-white-aside dark:bg-black-aside dark:text-white-light`}>
+                <DashboardAside />
+            </div>
+        </div>
+
+        <div className={`main w-full bg-inherit large:mr-[400px]`}>
+            <div className='fixed top-0 left-0 z-[980] w-full px-8 bg-inherit lg:hidden'>
+                <DashboardHeader />
+            </div> 
+
+            {/* main body section */}
+            <div className='min-h-[calc(99vh-111px)] pt-20 lg:pt-0'>
+                <Outlet />
+            </div>
+
+            {/* FOOTER SECTION */}
+            <footer className="py-5 text-center lg:text-end w-full text-brown dark:text-white-light">
+                <p className="text-10">Copyright @ {new Date().getFullYear()} - Developed by digiFi. All Rights Reserved</p>
+            </footer>
+        </div>
+
+        {/* Right Aisde */}
+        <>
+            <div className={`px-8 py-4 hidden large:flex fixed right-5 top-0 bottom-0 sm:w-[400px] bg-[#192440] dark:bg-[#1E1E2D] text-white-body`}>
+                <RightAsideBar />
+            </div>
+            <div className={`${showAsideDrawer =='right-aside' ? 'right-0 w-full' : '-right-full w-0'} fixed inset-0 z-[999] large:hidden bg-[rgba(0,_0,_0,_0.2)] dark:bg-[rgba(0,_0,_0,_0.4)] transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')}>
+                {/* <div className={`${showAsideDrawer =='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] right-0 top-0 inset-0 w-full bg-white/20 bg-red-400 transition-all cursor-pointer`} onClick={()=>setShowAsideDrawer('')} ></div> */}
+                <div onClick={(e)=>e.stopPropagation()} className={`${showAsideDrawer =='right-aside' ? 'right-0' : '-right-full'} fixed z-[999] top-0 botom-0 px-8 py-4 h-full w-4/5 sm:w-[400px] bg-[#192440] dark:bg-[#1E1E2D] text-white-body`}>
+                    <RightAsideBar />
+                </div>
+            </div>
+        </>
+    </div>
+  )
+}