src/components/Navbar.vue

@@ -30,7 +30,7 @@ SPDX-License-Identifier: AGPL-3.0-or-later
         :class="{ show: showMobileNav }"
         id="navbarSupportedContent"
       >
-        <ul class="navbar-nav mb-2 mb-lg-0 me-auto">
+        <ul class="navbar-nav mb-2 mb-lg-0">
           <li class="nav-item">
             <router-link
               class="nav-link"
@@ -56,6 +56,21 @@ SPDX-License-Identifier: AGPL-3.0-or-later
           >
           </li>
         </ul>
+        <form class="flex-grow-1 d-flex ms-lg-3 me-lg-4 mb-3 mb-lg-0" @submit.prevent="searchRedirect()">
+          <input
+            class="form-control bg-white me-2"
+            v-model="searchText"
+            type="search"
+            placeholder="Profile durchsuchen"
+            aria-label="Search"
+          />
+          <button
+            class="btn btn-primary"
+            type="submit"
+          >
+            <i class="bi bi-search"></i>
+          </button>
+        </form>
         <ul class="navbar-nav">
           <li class="nav-item">
             <button class="btn btn-danger w-100" @click="logout()">
@@ -80,6 +95,7 @@ export default {
   mixins: [RequestMixin],
   data() {
     return {
+      searchText: '',
       showMobileNav: false
     }
   },
@@ -94,6 +110,9 @@ export default {
       this.$store.dispatch('clear')
       this.$router.push({ path: '/' });
     },
+    searchRedirect() {
+      this.$router.push({ path: `/s/search?text`, query: { query: this.searchText } } );
+    },
   }
 }