aside settings btn fixed
This commit was merged in pull request #8.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Outlet } from 'react-router-dom'
|
||||
import { Outlet, useLocation } from 'react-router-dom'
|
||||
|
||||
import DashboardHeader from './DashboardHeader'
|
||||
import { generalLayoutContext } from '../../context/GeneralLayoutContext'
|
||||
@@ -8,6 +8,8 @@ import RightAsideBar from './rightaside/RightAsideBar'
|
||||
|
||||
export default function DashboardLayout() {
|
||||
|
||||
let {pathname} = useLocation()
|
||||
|
||||
const {showAsideDrawer, setShowAsideDrawer} = generalLayoutContext()
|
||||
|
||||
return (
|
||||
@@ -26,7 +28,7 @@ export default function DashboardLayout() {
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className='main w-full bg-inherit large:mr-[400px]'>
|
||||
<div className={`main w-full bg-inherit ${pathname == '/' && 'large:mr-[400px]'}`}>
|
||||
<div className='fixed top-0 left-0 z-[777] w-full px-8 bg-inherit lg:hidden'>
|
||||
<DashboardHeader />
|
||||
</div>
|
||||
@@ -43,15 +45,19 @@ export default function DashboardLayout() {
|
||||
</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`}>
|
||||
{pathname == '/' &&
|
||||
<>
|
||||
<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>
|
||||
<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>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user