templates/menubar.html.example

<style>
    .btn-primary {
        background-color: <?php echo $SERVICE_COLOR;
        ?>;
        border-color: <?php echo $SERVICE_COLOR;
        ?>;
    }
    
    .nav,
    ul .dropdown-menu .fg-primary,
    .bg-primary,
    .nav-link {
        background-color: #2f9c97 !important;
        color: white;
    }
    
    .nav-link:hover,
    .nav-link:visited {
        background-color: #2f9c97 !important;
        color: white;
    }
    
    .nav-pills a.nav-link.active,
    a.nav-link:hover,
    a.nav-link.active:visited {
        border-radius: 0%;
        text-decoration: none;
        background-color: #d5ebea !important;
        color: <?php echo $SERVICE_COLOR;
        ?>!important;
    }
    
    a.dropdown-item:hover {
        text-decoration: none;
        background: #d5ebea;
        color: #2f9c97;
    }
    
    a.dropdown-item {
        color: #d5ebea;
    }
</style>
<nav class="col-12 bold navbar-expand-lg mt-5 ml-5  pl-5 bg-primary" data-bs-theme="dark">
    <ul class="nav nav-pills justify-content-start fs-4">
        <li class="nav-item"><a href="https://korpus.cz/icc" class="nav-link">Home</a></li>
        <li class="nav-item"><a href="#" class="nav-link active" aria-current="page">Sign up</a></li>
        <li class="nav-item dropdown">
            <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
            Query
          </a>
            <ul class="dropdown-menu fg-primary bg-primary fs-4" aria-labelledby="navbarDropdown">
                <li><a class="dropdown-item" href="https://korap.korpus.cz/">ICC Czech</a></li>
                <li><a class="dropdown-item" href="//korap.ids-mannheim.de/instance/icc/eng">ICC English</a></li>
                <li><a class="dropdown-item" href="//korap.ids-mannheim.de/instance/icc/ger">ICC German</a></li>
                <li><a class="dropdown-item" href="//korap.ids-mannheim.de/instance/icc/nor">ICC Norwegian</a></li>
                <li>
                    <hr class="dropdown-divider">
                </li>
                <li><a class="dropdown-item" href="#">QL Introduction</a></li>
            </ul>
        </li>
    </ul>
</nav>