From bf4f378108e081fa77d018c65843f67b2e8f5046 Mon Sep 17 00:00:00 2001
From: James Collins <james.collins@outlook.com.au>
Date: Mon, 17 Apr 2023 14:58:08 +1000
Subject: [PATCH] added cta button

---
 resources/js/components/SMNavbar.vue | 32 ++++++++++++++++++++--------
 1 file changed, 23 insertions(+), 9 deletions(-)

diff --git a/resources/js/components/SMNavbar.vue b/resources/js/components/SMNavbar.vue
index bb90556..d4cdbc3 100644
--- a/resources/js/components/SMNavbar.vue
+++ b/resources/js/components/SMNavbar.vue
@@ -20,15 +20,22 @@
                             height="40"
                             alt="STEMMechanics" />
                     </router-link>
-                    <label
-                        id="sm-nav-toggle"
-                        @click.stop="handleClickToggleMenu"
-                        ><img
-                            src="/assets/hamburger.svg"
-                            width="24"
-                            height="24"
-                            alt="Navbar Toggle"
-                    /></label>
+                    <div class="sm-nav-right">
+                        <SMButton
+                            type="primary"
+                            size="medium"
+                            :to="{ name: 'event-list' }"
+                            label="Find Workshops" />
+                        <label
+                            id="sm-nav-toggle"
+                            @click.stop="handleClickToggleMenu"
+                            ><img
+                                src="/assets/hamburger.svg"
+                                width="24"
+                                height="24"
+                                alt="Navbar Toggle"
+                        /></label>
+                    </div>
                 </div>
                 <div id="sm-nav">
                     <ul>
@@ -51,6 +58,7 @@
 <script setup lang="ts">
 import { ref } from "vue";
 import { useUserStore } from "../store/UserStore";
+import SMButton from "../components/SMButton.vue";
 
 const userStore = useUserStore();
 const showToggle = ref(false);
@@ -189,6 +197,12 @@ body[data-route-name="page-home"] {
             }
         }
 
+        .sm-nav-right {
+            display: flex;
+            align-items: center;
+            gap: 20px;
+        }
+
         #sm-nav-toggle {
             padding: 24px;
         }