<?php
// Include database configuration
require_once __DIR__ . "/../database/db_config.php";
function formatUrl($url) {
// Check if URL starts with http:// or https://
if (stripos($url, 'http://') === 0 || stripos($url, 'https://') === 0) {
// URL is already absolute, use as is
return $url;
} else {
// URL is relative, prepend "../"
return "../" . $url;
}
}
// Make sure we have a database connection
if (!isset($conn) || !($conn instanceof mysqli)) {
// Attempt to reconnect or initialize connection
require_once __DIR__ . "/../database/db_config.php";
}
// Start session if not already started
if (session_status() === PHP_SESSION_NONE) {
session_start();
}
// Check if user has admin privileges (handled via helper function)
require_admin_privileges('login.php');
// Get current page for highlighting active menu item
$current_page = basename($_SERVER['PHP_SELF']);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Dashboard - Popular Computer Institute</title>
<!-- Bootstrap 5 CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<!-- Animate.css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css">
<!-- ApexCharts -->
<script src="https://cdn.jsdelivr.net/npm/apexcharts"></script>
<!-- Additional JS for slider management -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-sortable/0.9.13/jquery-sortable-min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/3.4.0/js/bootstrap-colorpicker.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-colorpicker/3.4.0/css/bootstrap-colorpicker.min.css">
<script src="https://cdn.jsdelivr.net/npm/bs-custom-file-input/dist/bs-custom-file-input.min.js"></script>
<!-- Custom Admin CSS -->
<link rel="stylesheet" href="../assets/css/admin.css">
<style>
:root {
--primary-color: #4e73df;
--primary-dark: #224abe;
--secondary-color: #6c757d;
--success-color: #1cc88a;
--info-color: #36b9cc;
--warning-color: #f6c23e;
--danger-color: #e74a3b;
--light-color: #f8f9fc;
--dark-color: #5a5c69;
--transition-speed: 0.3s;
/* RGB values for transparency effects */
--primary-rgb: 78, 115, 223;
--secondary-rgb: 108, 117, 125;
--success-rgb: 28, 200, 138;
--info-rgb: 54, 185, 204;
--warning-rgb: 246, 194, 62;
--danger-rgb: 231, 74, 59;
--light-rgb: 248, 249, 252;
--dark-rgb: 90, 92, 105;
}
body {
background-color: var(--light-color);
font-family: 'Poppins', sans-serif;
overflow-x: hidden;
}
/* Sidebar Styles */
.sidebar {
/* min-height: 100vh; */
background: linear-gradient(135deg, var(--primary-color) 0%, var(--primary-dark) 100%);
color: white;
transition: all var(--transition-speed);
position: fixed;
margin: 10px 10px;
left: 0;
top: 0;
border-radius: 15px;
width: 300px;
z-index: 1000;
box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.15);
display: flex;
flex-direction: column;
overflow: hidden;
max-height: 100vh;
}
.sidebar-header {
padding: 20px;
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
}
.sidebar-header .logo-img {
width: 40px;
height: 40px;
border-radius: 8px;
object-fit: cover;
transition: all var(--transition-speed);
}
.sidebar-header .logo-text {
font-weight: 600;
font-size: 18px;
transition: all 0.2s;
}
.sidebar.collapsed .sidebar-header {
justify-content: center;
}
.sidebar.collapsed .sidebar-header .logo-text {
display: none;
}
.sidebar.collapsed .sidebar-header .logo-img {
width: 40px;
height: 40px;
}
.sidebar-nav {
overflow-y: auto;
overflow-x: hidden;
max-height: calc(100vh - 80px);
padding-top: 10px;
scrollbar-width: thin;
scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}
/* Custom scrollbar for sidebar navigation */
.sidebar-nav::-webkit-scrollbar {
width: 2px;
}
.sidebar-nav::-webkit-scrollbar-track {
background: transparent;
}
.sidebar-nav::-webkit-scrollbar-thumb {
background-color: rgba(255, 255, 255, 0.2);
border-radius: 10px;
}
.sidebar-nav::-webkit-scrollbar-thumb:hover {
background-color: rgba(255, 255, 255, 0.4);
}
.sidebar .nav-link {
color: rgba(255, 255, 255, 0.8);
padding: 15px 20px;
margin: 5px 15px;
border-radius: 10px;
transition: all var(--transition-speed);
display: flex;
align-items: center;
white-space: nowrap;
}
.sidebar .nav-link:hover {
color: white;
background: rgba(255, 255, 255, 0.1);
transform: translateX(5px);
}
.sidebar .nav-link.active {
color: white;
background: rgba(255, 255, 255, 0.2);
font-weight: 600;
transform: translateX(5px);
}
.sidebar .nav-link i {
min-width: 30px;
text-align: center;
font-size: 1.1rem;
color: rgba(255, 255, 255, 0.8);
}
.sidebar .nav-link.active i {
color: white;
}
.sidebar .nav-item {
margin-bottom: 5px;
}
/* Sidebar Toggle */
.sidebar-toggler {
position: absolute;
right: -15px;
top: 25px;
padding: 2px;
background: white;
border-radius: 50%;
width: 30px;
height: 30px;
text-align: center;
line-height: 24px;
color: var(--primary-color);
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
cursor: pointer;
z-index: 1001;
transition: all var(--transition-speed);
}
.sidebar.collapsed {
width: 80px;
margin: 10px;
}
.sidebar.collapsed .sidebar-header h4,
.sidebar.collapsed .nav-link span {
display: none;
/* visibility: hidden; */
}
.sidebar.collapsed .nav-link {
padding: 15px 0;
justify-content: center;
margin: 5px 10px;
}
.sidebar.collapsed .nav-link i {
margin-right: 0;
}
.sidebar.collapsed .sidebar-toggler {
transform: rotate(180deg);
}
/* Main Content Styles */
.main-content {
margin-left: 300px;
padding: 20px;
transition: all var(--transition-speed);
min-height: 100vh;
}
.main-content.expanded {
margin-left: 80px;
}
/* Topbar Styles */
.topbar {
background: white;
box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.1);
border-radius: 15px;
padding: 15px 25px;
margin-bottom: 25px;
display: flex;
justify-content: space-between;
align-items: center;
}
.topbar h4 {
margin: 0;
color: var(--dark-color);
font-weight: 600;
}
.topbar .search-box {
position: relative;
max-width: 300px;
}
.topbar .search-box input {
border-radius: 50px;
padding-left: 40px;
background-color: var(--light-color);
border: none;
transition: all var(--transition-speed);
}
.topbar .search-box input:focus {
box-shadow: 0 0 0 0.25rem rgba(78, 115, 223, 0.25);
}
.topbar .search-box i {
position: absolute;
left: 15px;
top: 50%;
transform: translateY(-50%);
color: var(--secondary-color);
}
.user-profile {
display: flex;
align-items: center;
gap: 15px;
}
.user-profile .user-image {
width: 45px;
height: 45px;
border-radius: 50%;
overflow: hidden;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.user-profile .user-image img {
width: 100%;
height: 100%;
object-fit: cover;
}
.user-profile .user-info {
display: flex;
flex-direction: column;
}
.user-profile .user-name {
font-weight: 600;
color: var(--dark-color);
font-size: 1rem;
line-height: 1.2;
}
.user-profile .user-role {
font-size: 0.8rem;
color: var(--secondary-color);
}
.user-dropdown {
position: relative;
}
.user-dropdown-menu {
position: absolute;
top: 100%;
right: 0;
background: white;
border-radius: 10px;
box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
padding: 10px 0;
min-width: 200px;
z-index: 1000;
display: none;
}
.user-dropdown-menu.show {
display: block;
animation: fadeIn 0.3s;
}
.user-dropdown-menu a {
display: block;
padding: 10px 20px;
color: var(--dark-color);
text-decoration: none;
transition: all var(--transition-speed);
}
.user-dropdown-menu a:hover {
background: var(--light-color);
color: var(--primary-color);
}
.user-dropdown-menu a i {
margin-right: 10px;
width: 20px;
text-align: center;
}
/* Card Styles */
.card {
border: none;
border-radius: 15px;
box-shadow: 0 0.15rem 1.75rem 0 rgba(58, 59, 69, 0.1);
margin-bottom: 25px;
transition: transform var(--transition-speed), box-shadow var(--transition-speed);
}
.card:hover {
transform: translateY(-5px);
box-shadow: 0 0.5rem 2rem 0 rgba(58, 59, 69, 0.15);
}
.card-header {
background-color: transparent;
border-bottom: 1px solid rgba(0, 0, 0, 0.05);
padding: 20px 25px;
display: flex;
justify-content: space-between;
align-items: center;
}
.card-header h5 {
margin: 0;
font-weight: 600;
color: var(--dark-color);
}
.card-body {
padding: 25px;
}
/* Stat Card Styles */
.stat-card {
border-left: 5px solid;
border-radius: 15px;
overflow: hidden;
transition: all var(--transition-speed);
height: 100%;
}
.stat-card:hover {
transform: translateY(-5px);
box-shadow: 0 0.5rem 2rem 0 rgba(58, 59, 69, 0.15);
}
.stat-card.primary { border-left-color: var(--primary-color); }
.stat-card.success { border-left-color: var(--success-color); }
.stat-card.info { border-left-color: var(--info-color); }
.stat-card.warning { border-left-color: var(--warning-color); }
.stat-icon {
font-size: 2.5rem;
opacity: 0.3;
transition: all var(--transition-speed);
}
.stat-card:hover .stat-icon {
opacity: 0.5;
transform: scale(1.1);
}
.stat-value {
font-size: 2rem;
font-weight: 700;
color: var(--dark-color);
margin-bottom: 5px;
}
.stat-label {
color: var(--secondary-color);
font-weight: 500;
margin: 0;
}
/* Animation Classes */
.fadeIn {
animation: fadeIn 0.5s;
}
.slideInLeft {
animation: slideInLeft 0.5s;
}
.slideInUp {
animation: slideInUp 0.5s;
}
.pulse {
animation: pulse 2s infinite;
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes slideInLeft {
from {
transform: translateX(-50px);
opacity: 0;
}
to {
transform: translateX(0);
opacity: 1;
}
}
@keyframes slideInUp {
from {
transform: translateY(50px);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes pulse {
0% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
100% {
transform: scale(1);
}
}
/* Button Styles */
.btn {
border-radius: 50px;
padding: 0.5rem 1.5rem;
font-weight: 500;
transition: all var(--transition-speed);
}
.btn-primary {
background-color: var(--primary-color);
border-color: var(--primary-color);
}
.btn-primary:hover {
background-color: var(--primary-dark);
border-color: var(--primary-dark);
transform: translateY(-3px);
box-shadow: 0 4px 10px rgba(78, 115, 223, 0.3);
}
.btn-success {
background-color: var(--success-color);
border-color: var(--success-color);
}
.btn-success:hover {
background-color: #19b37b;
border-color: #19b37b;
transform: translateY(-3px);
box-shadow: 0 4px 10px rgba(28, 200, 138, 0.3);
}
.btn-icon {
width: 40px;
height: 40px;
padding: 0;
line-height: 40px;
text-align: center;
border-radius: 50%;
}
/* Table Styles */
.table {
font-size: 0.9rem;
}
.table th {
font-weight: 600;
border-top: 0;
vertical-align: middle;
}
.table td {
vertical-align: middle;
}
/* Badge Styles */
.badge {
padding: 0.5em 0.8em;
border-radius: 50px;
font-weight: 500;
}
/* Responsive Adjustments */
@media (max-width: 992px) {
.sidebar {
width: 70px;
}
.sidebar .sidebar-header h4,
.sidebar .nav-link span {
display: none;
}
.sidebar .nav-link {
padding: 15px 0;
justify-content: center;
margin: 5px;
}
.sidebar .nav-link i {
margin-right: 0;
}
.main-content {
margin-left: 70px;
}
.topbar {
padding: 15px;
}
.topbar .search-box {
display: none;
}
}
@media (max-width: 576px) {
.user-profile .user-info {
display: none;
}
.topbar h4 {
font-size: 1.2rem;
}
}
/* Sidebar Dropdown Styles */
.sidebar-dropdown .submenu-icon {
transition: transform 0.3s;
font-size: 10px;
}
.sidebar-dropdown .nav-link[aria-expanded="true"] .submenu-icon {
transform: rotate(180deg);
}
.sidebar-submenu {
list-style: none;
padding-left: 15px;
}
.sidebar-submenu .nav-link {
padding: 10px 15px;
font-size: 0.9rem;
}
.sidebar-submenu .nav-link i {
font-size: 0.9rem;
min-width: 25px;
}
.sidebar-submenu .nav-link:hover {
transform: translateX(3px);
}
.sidebar-submenu .nav-link.active {
transform: translateX(3px);
}
@media (max-width: 992px) {
.sidebar-submenu {
padding-left: 5px;
}
.sidebar-submenu .nav-link span {
display: none;
}
}
</style>
</head>
<body>
<!-- Sidebar -->
<div class="sidebar" id="sidebar">
<button type="button" class="sidebar-toggler" id="sidebarToggler" aria-label="Toggle Sidebar">
<i class="fas fa-chevron-left"></i>
</button>
<div class="sidebar-header">
<img src="../assets/img/logo_1743140535_pc.png" alt="Logo" class="logo-img">
<div class="logo-text">PCI</div>
</div>
<div class="sidebar-nav">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'index.php' ? 'active' : ''; ?>" href="index.php">
<i class="fas fa-home"></i>
<span>Dashboard</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'courses.php' ? 'active' : ''; ?>" href="courses.php">
<i class="fas fa-book"></i>
<span>Courses</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'categories.php' ? 'active' : ''; ?>" href="categories.php">
<i class="fas fa-list"></i>
<span>Categories</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'users.php' ? 'active' : ''; ?>" href="users.php">
<i class="fas fa-users"></i>
<span>Users</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'team_management.php' ? 'active' : ''; ?>" href="team_management.php">
<i class="fas fa-user-tie"></i>
<span>Team Management</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'students.php' ? 'active' : ''; ?>" href="students.php">
<i class="fas fa-user-graduate"></i>
<span>Students</span>
</a>
</li>
<li class="nav-item sidebar-dropdown">
<a class="nav-link <?php echo in_array(basename($_SERVER['PHP_SELF']), ['enrollments.php', 'verify_documents.php', 'student_documents.php']) ? 'active' : ''; ?>" href="#enrollmentSubmenu" data-bs-toggle="collapse" aria-expanded="<?php echo in_array(basename($_SERVER['PHP_SELF']), ['enrollments.php', 'verify_documents.php', 'student_documents.php']) ? 'true' : 'false'; ?>">
<i class="fas fa-user-graduate"></i>
<span>Enrollment</span>
<i class="fas fa-chevron-down ms-auto submenu-icon"></i>
</a>
<ul class="collapse <?php echo in_array(basename($_SERVER['PHP_SELF']), ['enrollments.php', 'verify_documents.php', 'student_documents.php']) ? 'show' : ''; ?> sidebar-submenu" id="enrollmentSubmenu">
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'enrollments.php' ? 'active' : ''; ?>" href="enrollments.php">
<i class="fas fa-clipboard-list"></i>
<span>Enrollments</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'enrollment_applications.php' ? 'active' : ''; ?>" href="enrollment_applications.php">
<i class="fas fa-file-alt"></i>
<span>Applications</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'student_documents.php' ? 'active' : ''; ?>" href="student_documents.php">
<i class="fas fa-file-signature"></i>
<span>Documents</span>
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'record_attendance.php' ? 'active' : ''; ?>" href="record_attendance.php">
<i class="fas fa-calendar-check"></i>
<span>Attendance</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'reviews.php' ? 'active' : ''; ?>" href="reviews.php">
<i class="fas fa-star"></i>
<span>Reviews</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'payments.php' ? 'active' : ''; ?>" href="payments.php">
<i class="fas fa-credit-card"></i>
<span>Payments</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'reports.php' ? 'active' : ''; ?>" href="reports.php">
<i class="fas fa-chart-bar"></i>
<span>Reports</span>
</a>
</li>
<!-- Exam Management Dropdown -->
<li class="nav-item sidebar-dropdown">
<a class="nav-link <?php echo in_array(basename($_SERVER['PHP_SELF']), ['exam_dashboard.php', 'schedule.php', 'student_documents.php']) ? 'active' : ''; ?>" href="#examSubmenu" data-bs-toggle="collapse" aria-expanded="<?php echo in_array(basename($_SERVER['PHP_SELF']), ['exam_dashboard.php', 'schedule.php', 'student_documents.php']) ? 'true' : 'false'; ?>">
<i class="fas fa-clipboard-check"></i>
<span>Exam Management</span>
<i class="fas fa-chevron-down ms-auto submenu-icon"></i>
</a>
<ul class="collapse <?php echo (strpos(basename($_SERVER['PHP_SELF']), 'exam') !== false) ? 'show' : ''; ?> sidebar-submenu" id="examSubmenu">
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'exam_dashboard.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/exam_dashboard.php">
<i class="fas fa-tachometer-alt"></i>
<span>Exam Dashboard</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'schedules.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/schedules.php">
<i class="fas fa-calendar-alt"></i>
<span>Exam Schedules</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'banks.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/banks.php">
<i class="fas fa-book"></i>
<span>Question Banks</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'questions.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/questions.php">
<i class="fas fa-question-circle"></i>
<span>Questions</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'results.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/results.php">
<i class="fas fa-chart-pie"></i>
<span>Results</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'exam_settings_config.php' ? 'active' : ''; ?>" href="<?php echo str_replace('/admin/includes', '/admin', dirname($_SERVER['PHP_SELF'])); ?>/exam_settings_config.php">
<i class="fas fa-cogs"></i>
<span>Exam Settings</span>
</a>
</li>
</ul>
</li>
<!-- Settings Dropdown -->
<li class="nav-item sidebar-dropdown">
<a class="nav-link <?php echo in_array(basename($_SERVER['PHP_SELF']), ['settings.php', 'site_settings.php', 'sliders.php', 'themes.php', 'live_editor.php', 'gallery.php']) ? 'active' : ''; ?>" href="#settingsSubmenu" data-bs-toggle="collapse" aria-expanded="<?php echo in_array(basename($_SERVER['PHP_SELF']), ['settings.php', 'site_settings.php', 'sliders.php', 'themes.php', 'live_editor.php', 'gallery.php']) ? 'true' : 'false'; ?>">
<i class="fas fa-cog"></i>
<span>Settings</span>
<i class="fas fa-chevron-down ms-auto submenu-icon"></i>
</a>
<ul class="collapse <?php echo in_array(basename($_SERVER['PHP_SELF']), ['settings.php', 'site_settings.php', 'sliders.php', 'themes.php', 'live_editor.php', 'gallery.php']) ? 'show' : ''; ?> sidebar-submenu" id="settingsSubmenu">
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'site_settings.php' ? 'active' : ''; ?>" href="site_settings.php">
<i class="fas fa-wrench"></i>
<span>Site Settings</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'settings.php' ? 'active' : ''; ?>" href="settings.php">
<i class="fas fa-sliders-h"></i>
<span>General Settings</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'sliders.php' ? 'active' : ''; ?>" href="sliders.php">
<i class="fas fa-images"></i>
<span>Manage Hero Sliders</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'themes.php' ? 'active' : ''; ?>" href="themes.php">
<i class="fas fa-paint-brush"></i>
<span>Themes & Colors</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'settings.php' ? 'active' : ''; ?>" href="settings.php">
<i class="fas fa-palette"></i>
<span>UI Settings</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'live_editor.php' ? 'active' : ''; ?>" href="live_editor.php">
<i class="fas fa-edit"></i>
<span>Live Website Editor</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'certificate_setup.php' ? 'active' : ''; ?>" href="certificate_setup.php">
<i class="fas fa-certificate"></i>
<span>Certificate Setup</span>
</a>
</li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="../logout.php">
<i class="fas fa-sign-out-alt"></i>
<span>Logout</span>
</a>
</li>
</ul>
</div>
</div>
<!-- Main Content -->
<div class="main-content" id="mainContent">
<?php include_once 'topbar.php'; ?>
<!-- Page Content Starts Here -->
<div class="container-fluid">
<!-- Bootstrap JS and dependencies -->
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.min.js"></script>
<!-- Custom Scripts -->
<script src="../assets/js/sidebar.js"></script>
</body>
</html>
