Drawer Width - Copy this React, Mui Component to your project
Background and Layout: Background Color: Deep blue (#003366) for consistency with the platform’s professional branding. Width and Position: Fixed on the left, allowing easy navigation while scrolling. Dividers: Silver gray lines (#A5A5A5) separate sections for clarity. Logo and Branding: The platform logo (scales of justice) is displayed in turquoise (#00B3B3) and white, linking back to the homepage. Navigation Links: Text and Icons: White text with Roboto Medium font. Hover state changes to turquoise (#00B3B3). Icons accompany links for better identification. Collapsible Sections: Submenus for categories, with arrow icons indicating dropdowns. Arrows change to turquoise on hover. User Profile Section: Displays user avatar and name with a dropdown for settings and logout. Text is white, with active elements in turquoise. Call to Action Buttons: Prominent turquoise buttons for key actions like “Start Consultation” or “Upload Document.” Responsiveness: Fully responsive design, collapsing into a hamburger menu on mobile devices for compact navigation.
