Responsive Design
Automatically adapts to any screen size with horizontal desktop menu and vertical mobile accordion.
Welcome to Menu System
A fully customizable, responsive multi-level menu system with advanced features
right | right
/* Dynamic Menu Styles - Auto-generated */
/* Generated: 2025-12-08 23:45:43 */
:root {
--menu-transition: 0.3s;
--menu-font-family: 'Roboto', sans-serif;
--menu-font-size: 16px;
}
/* Desktop Menu */
.desktop-menu {
background: #72c9ee !important;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1) !important;
border-radius: 0px !important;
position: sticky !important;
top: 0 !important;
z-index: 1000 !important;
}
.menu-container {
max-width: 1400px !important;
padding: 0 20px !important;
justify-content: flex-end !important;
}
.menu-main {
justify-content: flex-end !important;
}
.menu-main > .menu-item > a {
color: #000000 !important;
padding: 20px 16px !important;
}
.menu-main > .menu-item > a:hover {
color: #000000 !important;
background: rgba(33, 150, 243, 0.05) !important;
}
.menu-main > .menu-item > a::after {
background: #000000 !important;
}
/* Submenu */
.submenu {
background: #ffffff !important;
border-radius: 8px !important;
}
/* Mobile Menu */
.mobile-menu {
width: 300px !important;
background: #ffffff !important;
left: -300px !important;
right: auto !important;
}
.mobile-menu.active {
left: 0 !important;
}
.mobile-menu-toggle {
background: #72c9ee !important;
color: #000000 !important;
right: 20px !important;
left: auto !important;
}
.mobile-menu-header {
background: #72c9ee !important;
color: #000000 !important;
}
.accordion-header, .accordion-link {
text-align: left !important;
}
System Features
Style Customization
Complete control over colors, fonts, alignments, and dimensions through the style editor.
Multi-Level Support
Create unlimited nested menu levels with smooth transitions and intuitive navigation.
Drag & Drop
Easily reorder menu items with visual drag and drop interface in the admin dashboard.
Database Driven
All menu items and settings stored in MySQL database for easy management and persistence.
Secure System
CSRF protection, prepared statements, and input sanitization for maximum security.
Current Configuration
15
Menu Items
37
Settings
Right
Menu Alignment
Left
Mobile Position
Manage Your Menu
Access the admin dashboard to manage menu items and customize the appearance