1 files changed, 20 insertions, 0 deletions

diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue
index d3ceaf8..fd57156 100644
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -3,6 +3,12 @@
     <nav class="navbar" role="navigation" aria-label="main navigation">
       <div class="container">
         <div class="navbar-brand">
+          <SearchInput
+            class="search-bar search-bar-mobile is-hidden-desktop"
+            @input="filterServices"
+            @search:open="navigateToFirstService"
+            @search:cancel="filterServices"
+          />
           <a
             role="button"
             aria-label="menu"
@@ -36,6 +42,13 @@
           </div>
           <div class="navbar-end">
             <slot></slot>
+
+            <SearchInput
+              class="navbar-item is-inline-block-mobile is-hidden-touch"
+              @input="filterServices"
+              @search:open="navigateToFirstService"
+              @search:cancel="filterServices"
+            />
           </div>
         </div>
       </div>
@@ -44,14 +57,21 @@
 </template>
 
 <script>
+import SearchInput from "./SearchInput.vue";
+
 export default {
   name: "Navbar",
+  components: {
+    SearchInput,
+  },
   props: {
     open: {
       type: Boolean,
       default: false,
     },
     links: Array,
+    navigateToFirstService: { type: Function },
+    filterServices: { type: Function },
   },
   computed: {
     showMenu: function () {