Files
wevads-platform/public/includes/sidebar.php.backup
2026-02-26 04:53:11 +01:00

167 lines
4.2 KiB
Plaintext
Executable File

<!-- Sidebar Menu - Brain Section -->
<div class="sidebar">
<div class="sidebar-header">
<h3>WEVADS</h3>
</div>
<ul class="sidebar-menu">
<!-- Dashboard -->
<li class="nav-item">
<a class="nav-link" href="/dashboard.php">
<i class="fas fa-tachometer-alt"></i>
<span>Dashboard</span>
</a>
</li>
<!-- Brain Menu -->
<li class="nav-item has-submenu">
<a class="nav-link" href="#brainMenu" data-toggle="collapse">
<i class="fas fa-brain"></i>
<span>Brain</span>
<i class="fas fa-chevron-down submenu-arrow"></i>
</a>
<ul class="collapse submenu" id="brainMenu">
<li>
<a href="/warning-config.html">
<i class="fas fa-exclamation-triangle"></i>
Warning Config
</a>
</li>
<li>
<a href="/process-supervision.php">
<i class="fas fa-tasks"></i>
Process Supervision
</a>
</li>
<li>
<a href="/widgets/routines_dashboard.html">
<i class="fas fa-robot"></i>
IA Routines Monitor
</a>
</li>
<li>
<a href="/widgets/cloud_health.html">
<i class="fas fa-cloud"></i>
Cloud Health
</a>
</li>
</ul>
</li>
<!-- Control Hub -->
<li class="nav-item">
<a class="nav-link" href="/control-hub.html">
<i class="fas fa-sliders-h"></i>
<span>Control Hub</span>
</a>
</li>
<!-- MTA Servers -->
<li class="nav-item">
<a class="nav-link" href="/mta-servers.html">
<i class="fas fa-server"></i>
<span>MTA Servers</span>
</a>
</li>
</ul>
</div>
<style>
.sidebar {
width: 250px;
height: 100vh;
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
position: fixed;
left: 0;
top: 0;
overflow-y: auto;
box-shadow: 2px 0 10px rgba(0,0,0,0.3);
}
.sidebar-header {
padding: 20px;
text-align: center;
background: rgba(255,255,255,0.05);
border-bottom: 1px solid rgba(255,255,255,0.1);
}
.sidebar-menu {
list-style: none;
padding: 0;
margin: 0;
}
.nav-item {
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.nav-link {
display: flex;
align-items: center;
padding: 15px 20px;
color: #fff;
text-decoration: none;
transition: all 0.3s;
}
.nav-link:hover {
background: rgba(255,255,255,0.1);
padding-left: 25px;
}
.nav-link i {
margin-right: 10px;
width: 20px;
}
.submenu {
background: rgba(0,0,0,0.2);
}
.submenu li a {
padding: 12px 20px 12px 50px;
display: block;
color: rgba(255,255,255,0.8);
text-decoration: none;
transition: all 0.3s;
}
.submenu li a:hover {
background: rgba(255,255,255,0.1);
color: #fff;
padding-left: 55px;
}
.submenu-arrow {
margin-left: auto;
font-size: 0.8em;
transition: transform 0.3s;
}
.has-submenu.active .submenu-arrow {
transform: rotate(180deg);
}
</style>
<script>
// Toggle submenu
document.querySelectorAll('.has-submenu > a').forEach(link => {
link.addEventListener('click', function(e) {
e.preventDefault();
const parent = this.parentElement;
parent.classList.toggle('active');
const submenu = parent.querySelector('.submenu');
submenu.style.display = submenu.style.display === 'block' ? 'none' : 'block';
});
});
// Highlight active page
const currentPage = window.location.pathname;
document.querySelectorAll('.nav-link, .submenu a').forEach(link => {
if (link.getAttribute('href') === currentPage) {
link.style.background = 'rgba(76, 175, 80, 0.3)';
link.style.borderLeft = '4px solid #4CAF50';
}
});
</script>