<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
    <div class="container">
        <a class="navbar-brand" href="#!">SuperMega</a>
        <button class="navbar-toggler" 
                type="button" 
                data-bs-toggle="collapse" 
                data-bs-target="#navbarSupportedContent" 
                aria-controls="navbarSupportedContent" 
                aria-expanded="false" 
                aria-label="Toggle navigation"
        >
            <span class="navbar-toggler-icon"></span>
        </button>

        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mr-auto">
                <li class="nav-item">
                    <a class="nav-link {{ 'active' if request.path == '/' else '' }}" 
                       href="/">Home</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link {{ 'active' if request.path == '/projects' else '' }}" 
                       href="/projects">Projects</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link {{ 'active' if request.path == '/shellcodes' else '' }}" 
                       href="/shellcodes">Shellcodes</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link {{ 'active' if request.path == '/exes' else '' }}" 
                       href="/exes">EXE's</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link {{ 'active' if request.path == '/shcdev' else '' }}" 
                       href="/shcdev">ShcDev</a>
                </li>
            </ul>
        </div>
    </div>
</nav>

