temp navbar

resources/views/home.antlers.html

@@ -1,5 +1,5 @@
 <!--HERO SECTION-->
-<div class="px-4 py-5" style="height: 100vh;">
+<div class="px-4 py-5" style="height: 120vh;">
 
     <div class="d-flex flex-column position-relative" style="height: 100%;overflow: hidden;">
         <!-- <nav class="navbar navbar-expand-lg p-0" style="background-color: rgba(0, 0, 0, 0);">
@@ -24,13 +24,41 @@
             </div>
         </nav> -->
 
+        <!--TEMP NAVBAR-->
+        <nav class="navbar navbar-expand-lg w-100" style="position: absolute;z-index: 2;background-color: rgba(255, 255, 255, 0.2);">
+            <div class="container-fluid">
+              <a class="navbar-brand py-3 px-5" href="/">
+                <img src="/assets/svg/logo.svg" width="100">
+              </a>
+              <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+              </button>
+              <div class="collapse navbar-collapse d-flex" id="navbarNavDropdown">
+                <ul class="navbar-nav me-auto me-md-0 ms-md-auto">
+                  <li class="nav-item">
+                    <a class="nav-link active fw-bolder font-18" aria-current="page" href="/" style="color: #fff;">Home</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link fw-bolder font-18" href="#" style="color: #fff;">Introduction</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link fw-bolder font-18" href="#" style="color: #fff;">What is Text4u?</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link fw-bolder font-18" href="#" style="color: #159B9B;">Submit</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </nav>
+
         <video autoplay muted loop style="width: 100%;">
             <source src="/assets/video/hero.mp4" type="video/mp4">
         </video>
 
         <div class="w-100 flex-grow-1 row p-0 m-0 position-absolute" style="overflow: hidden;z-index: 1; background: rgba(0, 0, 0, 0.5); height: 100%;">
             <div class="col-4 d-none d-lg-flex">
-                <img src="/assets/img/group_21.png" class="img-fluid mt-auto mx-auto" style="height: 90%;" />
+                <img src="/assets/img/group_21.png" class="img-fluid mt-auto mx-auto" style="height: 75%;" />
             </div>
             <div class="col-12 col-lg-8 px-5 d-flex">
                 <div class="my-auto w-100">