A
Anonymous

Drawer Width - Copy this React, Mui Component to your project

import-Footer-from-"./components/footer/Footer";-import-Menu-from-"./components/menu/Menu";-import-Navbar-from-"./components/navbar/Navbar";-import-{-Home-}-from-"./pages/home/Home";-import-Login-from-"./pages/login/Login";-import-Product-from-"./pages/product/Product";-import-{-Products-}-from-"./pages/products/Products";-import-Register-from-"./pages/register/Register";-import-User-from-"./pages/user/User";-import-{-MasterFrekuensi-}-from-"./pages/Frekuensi/frekuensi";-import-{-Users-}-from-"./pages/users/Users";-import-"./styles/global.scss";-import-{-createBrowserRouter,-RouterProvider,-Outlet-}-from-"react-router-dom";-function-App()-{-const-Layout-=-()-=>-{-return-(-<div-className="main">-<Navbar-/>-<div-className="container">-<div-className="menuContainer">-<Menu-/>-</div>-<div-className="contentContainer">-<Outlet-/>-</div>-</div>-<Footer-/>-</div>-);-};-const-router-=-createBrowserRouter([-{-path:-"/",-element:-<Layout-/>,-children:-[-{-path:-"/",-element:-<Home-/>,-},-{-path:-"/users",-element:-<Users-/>,-},-{-path:-"/frekuensi",-element:-<MasterFrekuensi-/>,-},-{-path:-"/users/:userId",-element:-<User-/>,-},-{-path:-"/products",-element:-<Products-/>,-},-{-path:-"/products/:id",-element:-<Product-/>,-},-],-},-{-path:-"login",-element:-<Login-/>,-},-{-path:-"register",-element:-<Register-/>,-},-]);-return-<RouterProvider-router={router}-/>;-}-export-default-App;

Prompt
Component Preview

About

drawerWidth - Customize your layout's sidebar with adjustable width, enhancing navigation. Built with React and MUI. Start coding now!

Share

Last updated 1 month ago