Fix layout - Sidebar and Nav placement

This commit is contained in:
sosokker 2023-11-10 19:45:01 +07:00
parent de3abcee06
commit 79186766dc
3 changed files with 16 additions and 17 deletions

View File

@ -14,21 +14,23 @@ import IconSideNav from './components/IconSideNav'; // Import IconSideNav
const App = () => { const App = () => {
return ( return (
<BrowserRouter> <BrowserRouter>
<div className="App"> <div className='display: flex'>
<IconSideNav />
<div className='flex-1'>
<NavBar /> <NavBar />
<Routes> <div className='flex items-center justify-center'>
<Route path="/" element={<Home />} /> <Routes>
<Route path="/login" element={<LoginPage />} /> <Route path="/" element={<Home />} />
<Route path="/signup" element={<SignUpPage />} /> <Route path="/tasks" element={<KanbanBoard />} />
<Route path="/testAuth" element={<TestAuth />} /> <Route path="/login" element={<LoginPage />} />
<Route path="/update_profile" element={<ProfileUpdate />} /> <Route path="/signup" element={<SignUpPage />} />
<Route path="/calendar" element={<Calendar />} /> <Route path="/testAuth" element={<TestAuth />} />
</Routes> <Route path="/update_profile" element={<ProfileUpdate />} />
<Route path="/calendar" element={<Calendar />} />
</Routes>
</div>
</div>
</div> </div>
<div>
<IconSideNav /> {<KanbanBoard />}
</div>
</BrowserRouter> </BrowserRouter>
); );
} }

View File

@ -18,7 +18,6 @@ const IconSideNav = () => {
return ( return (
<div className="bg-slate-900 text-slate-100 flex"> <div className="bg-slate-900 text-slate-100 flex">
<SideNav /> <SideNav />
<div className="w-full"></div>
</div> </div>
); );
}; };
@ -27,7 +26,7 @@ const SideNav = () => {
const [selected, setSelected] = useState(0); const [selected, setSelected] = useState(0);
return ( return (
<nav className="h-[500px] w-fit bg-slate-950 p-4 flex flex-col items-center gap-2"> <nav className="bg-slate-950 p-4 flex flex-col items-center gap-2 h-screen">
{menuItems.map((item) => ( {menuItems.map((item) => (
<NavItem <NavItem
key={item.id} key={item.id}

View File

@ -119,12 +119,10 @@ function KanbanBoard() {
className=" className="
m-auto m-auto
flex flex
min-h-screen
w-full w-full
items-center items-center
overflow-x-auto overflow-x-auto
overflow-y-hidden overflow-y-hidden
px-[40px]
" "
> >
<DndContext <DndContext