feat: horizontally align navbar

Johannes1803 · Dec 22, 2023 · e2b93c1 · e2b93c1
1 parent ab4ddb0
commit e2b93c1
Showing 1 changed file with 33 additions and 27 deletions.
diff --git a/in_concert/app/templates/base.html b/in_concert/app/templates/base.html
@@ -7,33 +7,39 @@
       integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
       crossorigin="anonymous"
     />
-    <nav class="navbar navbar-expand-lg navbar-light bg-light">
-      <a class="navbar-brand" href="{{ url_for('read_main') }}">Navbar</a>
-      <button
-        class="navbar-toggler"
-        type="button"
-        data-toggle="collapse"
-        data-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 active">
-            <a class="nav-link" href="{{ url_for('read_main') }}">Events </a>
-          </li>
-          <li class="nav-item active">
-            <a class="nav-link" href="{{ url_for('list_bands') }}">Bands </a>
-          </li>
-          <li class="nav-item active">
-            <a class="nav-link" href="{{ url_for('list_venues') }}">Venues </a>
-          </li>
-        </ul>
-      </div>
-    </nav>
+    <div class="container">
+      <nav class="navbar navbar-expand-sm navbar-light bg-light">
+        <a class="navbar-brand" href="{{ url_for('read_main') }}"
+          >in concert!</a
+        >
+        <button
+          class="navbar-toggler"
+          type="button"
+          data-toggle="collapse"
+          data-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 active">
+              <a class="nav-link" href="{{ url_for('read_main') }}">Events </a>
+            </li>
+            <li class="nav-item active">
+              <a class="nav-link" href="{{ url_for('list_bands') }}">Bands </a>
+            </li>
+            <li class="nav-item active">
+              <a class="nav-link" href="{{ url_for('list_venues') }}"
+                >Venues
+              </a>
+            </li>
+          </ul>
+        </div>
+      </nav>
+    </div>
     <title>Welcome to inConcert!</title>
     <link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />