Update navigation bar to work with bootstrap 5

This commit is contained in:
Sravan Balaji
2025-01-02 00:16:57 -05:00
parent 46db1fd2e0
commit dd4671b7b8

View File

@@ -1,6 +1,7 @@
<!doctype html> <!doctype html>
<header role="banner" class="site-head"> <header role="banner" class="site-head">
<nav class="navbar my-nav navbar-expand-md fixed-top"> <nav class="navbar my-nav navbar-expand-md fixed-top">
<div class="container-fluid">
<!-- Brand --> <!-- Brand -->
<a class="navbar-brand" href="/"> <a class="navbar-brand" href="/">
<img <img
@@ -19,18 +20,19 @@
</a> </a>
<!-- Toggler/collapsible Button --> <!-- Toggler/collapsible Button -->
<button <button class="navbar-toggler"
class="navbar-toggler"
type="button" type="button"
data-toggle="collapse" data-bs-toggle="collapse"
data-target="#collapsibleNavbar" data-bs-target="#collapsibleNavbar"
> aria-controls="collapsibleNavbar"
aria-expanded="false"
aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span> <span class="navbar-toggler-icon"></span>
</button> </button>
<!-- Navbar links --> <!-- Navbar links -->
<div class="collapse navbar-collapse" id="collapsibleNavbar"> <div class="collapse navbar-collapse" id="collapsibleNavbar">
<ul class="navbar-nav"> <ul class="navbar-nav me-auto mb-2 mb-lg-0">
{% for item in navigation.items %} {% for item in navigation.items %}
<li class="nav-item"> <li class="nav-item">
<a class="nav-link" href="{{ item.url }}"><b>{{ item.text }}</b></a> <a class="nav-link" href="{{ item.url }}"><b>{{ item.text }}</b></a>
@@ -51,5 +53,6 @@
> >
</div> </div>
<script src="/scripts/dark-mode-switch.min.js"></script> <script src="/scripts/dark-mode-switch.min.js"></script>
</div>
</nav> </nav>
</header> </header>