File Manager

Editing:navbar.php

<?php
$root_prefix = (strpos($_SERVER['PHP_SELF'], '/admin/') !== false) ? '../' : '';
?>
<header id="main-header" class="<?= basename($_SERVER['PHP_SELF']) == 'index.php' ? 'header-transparent' : 'header-solid' ?>">
    <div class="header-container">
        <div class="logo">
            <a href="<?= $root_prefix ?>index.php">
                <img src="<?= $root_prefix ?>assets/img/logo.png" alt="Methsisila" id="nav-logo" onerror="this.src='https://images.pexels.com/photos/2108845/pexels-photo-2108845.jpeg?auto=compress&cs=tinysrgb&w=600';">
            </a>
        </div>
        
        
        <div class="mobile-toggle" id="mobile-toggle">
            <span></span>
            <span></span>
            <span></span>
        </div>

<nav id="main-nav">
            <div class="mobile-close" id="mobile-close">&times;</div>
            <ul>
                <li><a href="<?= $root_prefix ?>index.php" class="<?= basename($_SERVER['PHP_SELF']) == 'index.php' ? 'active' : '' ?>"><i class="fas fa-home me-2"></i>Home</a></li>
                <li><a href="<?= $root_prefix ?>packages.php" class="<?= basename($_SERVER['PHP_SELF']) == 'packages.php' ? 'active' : '' ?>"><i class="fas fa-route me-2"></i>Tours</a></li>
                <li><a href="<?= $root_prefix ?>local-tours.php" class="<?= basename($_SERVER['PHP_SELF']) == 'local-tours.php' ? 'active' : '' ?>"><i class="fas fa-map-marked-alt me-2"></i>Sri Lanka Tours</a></li>
                <li><a href="<?= $root_prefix ?>gallery.php" class="<?= basename($_SERVER['PHP_SELF']) == 'gallery.php' ? 'active' : '' ?>"><i class="fas fa-images me-2"></i>Gallery</a></li>
                <li><a href="<?= $root_prefix ?>contact.php" class="<?= basename($_SERVER['PHP_SELF']) == 'contact.php' ? 'active' : '' ?>"><i class="fas fa-envelope me-2"></i>Contact</a></li>
                <li><a href="<?= $root_prefix ?>booking.php" class="nav-btn"><i class="fas fa-calendar-check me-2"></i>Book Now</a></li>
            </ul>
        </nav>
    </div>
</header>

#main-header.scrolled, #main-header.header-solid {
    background: #fff;
    padding: 10px 0;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
#main-header.scrolled #nav-logo, #main-header.header-solid #nav-logo { height: 120px !important; }
#main-header.scrolled #main-nav a, #main-header.header-solid #main-nav a { color: #333; }
#main-header.scrolled #main-nav a:hover, #main-header.header-solid #main-nav a:hover { color: var(--primary); }
#main-header.header-solid .mobile-toggle span { background: #333; }

/* Mobile Navigation */
.mobile-toggle {
    display: none;
    cursor: pointer;
}
.mobile-toggle span {
    display: block;
    width: 25px;
    height: 3px;
    background: #fff;
    margin: 5px 0;
    transition: 0.4s;
}
#main-header.scrolled .mobile-toggle span { background: #333; }

.mobile-close {
    display: none;
}

@media (max-width: 992px) {
    #main-header {
        background: transparent;
        padding: 10px 0;
    }
    #main-header.scrolled, #main-header.header-solid {
        background: #fff;
        padding: 5px 0;
    }
    .header-container { 
        padding: 0 10px; 
        flex-direction: column; /* Separate rows */
        gap: 10px;
        align-items: center;
    }
    #nav-logo { height: 100px !important; }
    #main-header.scrolled #nav-logo, #main-header.header-solid #nav-logo { height: 80px !important; }
    
    .mobile-toggle, .mobile-close { 
        display: none !important; 
    }
    
    #main-nav {
        position: static;
        width: 100%;
        height: auto;
        background: transparent;
        padding: 0;
        box-shadow: none;
        display: block;
    }
    #main-nav ul {
        flex-direction: row;
        justify-content: center;
        gap: 15px;
        flex-wrap: wrap;
    }
    #main-nav a { 
        color: #fff !important;
        font-size: 11px;
        flex-direction: column;
        gap: 5px;
        padding: 5px;
        border: none;
        text-align: center;
    }
    #main-header.scrolled #main-nav a, #main-header.header-solid #main-nav a {
        color: #333 !important;
    }
    #main-nav a i {
        font-size: 18px;
        margin: 0;
    }
    /* Hide Book Now button on mobile */
    #main-nav a.nav-btn {
        display: none !important;
    }
}
</style>

document.getElementById('mobile-toggle').addEventListener('click', function() {
    document.getElementById('main-nav').classList.toggle('active');
    this.classList.toggle('active');
});

document.getElementById('mobile-close').addEventListener('click', function() {
    document.getElementById('main-nav').classList.remove('active');
    document.getElementById('mobile-toggle').classList.remove('active');
});
</script>

Cancel

🤩 File Manager - Mr.X

Editing:navbar.php