new navbar

This commit is contained in:
Luca Tamagnini
2024-07-04 12:36:05 +00:00
parent f5eedabc71
commit 95e7bb895e

View File

@@ -1,5 +1,6 @@
<div class="container">
<div class="row center-xs">
<nav class="bg-white dark:bg-gray-900 fixed w-full z-20 top-0 start-0 border-b border-gray-200 dark:border-gray-600">
<div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
<div class="col-md-4 col-sm-4">
<a class="logo-img" href="/">
<div class="logo-image">
@@ -7,89 +8,45 @@
</div>
</a>
</div>
<div class="col-md-8 col-sm-8">
<div class="burger-menu">
<button class="navbar-toggler toggler-example" type="button" data-toggle="collapse" data-target="#navbarSupportedContent1" aria-controls="navbarSupportedContent1" aria-expanded="false" aria-label="Toggle navigation"><span class="dark-blue-text"><i class="fas fa-bars fa-1x"></i></span></button>
</div>
<!-- Collapsible content -->
<div class="collapse navbar-collapse" id="navbarSupportedContent1">
<!-- Links -->
<div class="mobile-container">
<ul class="navbar-nav mr-auto">
<li class="nav-item active">
<a class="nav-link" href="https://forum.beammp.com">Forum</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://wiki.beammp.com">Wiki</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/servers">Servers</a>
</li>
<li class="nav-item">
<a class="nav-link" href="/stats">Statistics</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://github.com/BeamMP/BeamMP">GitHub</a>
</li>
<li class="nav-item">
<a class="nav-link" href="https://www.patreon.com/BeamMP">Patreon</a>
</li>
</ul>
</div>
<div class="flex md:order-2 space-x-3 md:space-x-0 rtl:space-x-reverse">
<button data-collapse-toggle="navbar-sticky" type="button" class="inline-flex items-center p-2 w-10 h-10 justify-center text-sm text-gray-500 rounded-lg md:hidden hover:bg-gray-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-gray-700 dark:focus:ring-gray-600" aria-controls="navbar-sticky" aria-expanded="false">
<span class="sr-only">Open menu</span>
<svg class="w-5 h-5" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 17 14">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M1 1h15M1 7h15M1 13h15"/>
</svg>
</button>
</div>
<div class="mobile-container">
<div class="topnav mobile-links">
<div id="burger-links">
<a href="https://forum.beammp.com">Forum</a>
<a href="https://wiki.beammp.com">Docs</a>
<a href="/servers">Servers</a>
<a href="/stats">Statistics</a>
<a href="https://github.com/BeamMP/BeamMP">GitHub</a>
<a href="https://www.patreon.com/BeamMP">Patreon</a>
</div>
<a href="javascript:void(0);" class="icon" onclick="myFunction()">
<i class="fa fa-bars"></i>
</a>
</div>
</div>
<div class="navbar-links">
<ul class="links">
<div class="items-center justify-between hidden w-full md:flex md:w-auto md:order-1" id="navbar-sticky">
<ul class="flex flex-col p-4 md:p-0 mt-4 font-medium border border-gray-100 rounded-lg bg-gray-50 md:space-x-8 rtl:space-x-reverse md:flex-row md:mt-0 md:border-0 md:bg-white dark:bg-gray-800 md:dark:bg-gray-900 dark:border-gray-700">
<li>
<a href="https://forum.beammp.com">
<span class="text">Forum</span>
</a>
<a href="https://forum.beammp.com" class="block py-2 px-3 text-white bg-blue-700 rounded md:bg-transparent md:text-blue-700 md:p-0 md:dark:text-blue-500" aria-current="page">Forum</a>
</li>
<li>
<a href="https://wiki.beammp.com">
<span class="text">Docs</span>
</a>
<a href="https://wiki.beammp.com" class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 md:dark:hover:text-blue-500 dark:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">Wiki</a>
</li>
<li>
<a href="/servers">
<span class="text">Servers</span>
</a>
<a href="/servers" class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 md:dark:hover:text-blue-500 dark:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">Servers</a>
</li>
<li>
<a href="/stats">
<span class="text">Statistics</span>
</a>
<a href="/stats" class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 md:dark:hover:text-blue-500 dark:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">Statistics</a>
</li>
<li>
<a href="https://github.com/BeamMP/BeamMP">
<span class="text">Github</span>
</a>
<a href="https://github.com/BeamMP/BeamMP" class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 md:dark:hover:text-blue-500 dark:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">GitHub</a>
</li>
<li>
<a href="https://www.patreon.com/BeamMP">
<span class="text">Patreon</span>
</a>
<a href="https://www.patreon.com/BeamMP" class="block py-2 px-3 text-gray-900 rounded hover:bg-gray-100 md:hover:bg-transparent md:hover:text-blue-700 md:p-0 md:dark:hover:text-blue-500 dark:text-white dark:hover:bg-gray-700 dark:hover:text-white md:dark:hover:bg-transparent dark:border-gray-700">Patreon</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>