generated from dwd/boilarplate-remix-tailwind-antd
40 lines
1.3 KiB
TypeScript
40 lines
1.3 KiB
TypeScript
import React, { useState } from 'react';
|
|
import { Layout, Menu, theme, Button, Modal, MenuProps } from 'antd';
|
|
import { Dropdown, Space } from 'antd';
|
|
import DirectoryDashboard from '../components/DirectoryDashboard';
|
|
import '../../public/assets/left_side_nav.css';
|
|
const { Content, Sider } = Layout;
|
|
import Sidebar from '../components/Sidebar';
|
|
import NavBar from '../components/NavBar';
|
|
|
|
|
|
const App: React.FC = () => {
|
|
const [isCollapsed, setIsCollapsed] = useState(false);
|
|
|
|
const toggleSidebar = () => {
|
|
setIsCollapsed(!isCollapsed);
|
|
};
|
|
|
|
return (
|
|
<Layout>
|
|
<Layout>
|
|
<Sidebar isCollapsed={isCollapsed} toggleSidebar={toggleSidebar} />
|
|
<Layout style={{ marginLeft: isCollapsed ? 80 : 366, transition: 'margin-left 0.2s ease' }}>
|
|
|
|
|
|
<Content style={{ overflow: 'initial', }}>
|
|
<NavBar />
|
|
|
|
<div className='grid grid-cols-1 gap-y-6 border-[1px] border-[#CFCFCF]'>
|
|
<DirectoryDashboard />
|
|
</div>
|
|
|
|
</Content>
|
|
|
|
</Layout>
|
|
|
|
</Layout>
|
|
</Layout>
|
|
);
|
|
};
|
|
export default App; |