From 2fdbf860a919981c1fba75f0a6610600a1930084 Mon Sep 17 00:00:00 2001
From: Flycro <flycro@live.de>
Date: Sat, 29 Apr 2023 12:36:21 +0200
Subject: [PATCH] feat: Added Styling

---
 src/components/NavigationModel.vue | 54 +++++++++++++++++++++++-------
 1 file changed, 42 insertions(+), 12 deletions(-)

diff --git a/src/components/NavigationModel.vue b/src/components/NavigationModel.vue
index 1dba898..43557d9 100644
--- a/src/components/NavigationModel.vue
+++ b/src/components/NavigationModel.vue
@@ -1,17 +1,47 @@
-<script setup>
-
-</script>
-
 <template>
     <nav v-show="true" class="navbar navbar-expand navbar-dark bg-dark">
+        <div class="logo">
+            LOGO IS HERE
+        </div>
         <div class="navbar-nav">
-            <router-link to="/" class="nav-item nav-link">Home</router-link>
-            <router-link to="/Muscles/Legs" class="nav-item nav-link">Legs</router-link>
-            <router-link to="/Muscles/Back" class="nav-item nav-link">Back</router-link>
-            <router-link to="/Muscles/Chest" class="nav-item nav-link">Chest</router-link>
-            <router-link to="/Muscles/Shoulder" class="nav-item nav-link">Shoulder</router-link>
-            <router-link to="/Muscles/Triceps" class="nav-item nav-link">Triceps</router-link>
-            <router-link to="/Muscles/Bicepts" class="nav-item nav-link">Bicepts</router-link>
+            <router-link to="/" class="nav-item nav-link">HomeView</router-link>
+            <router-link to="/muscles/legs" class="nav-item nav-link">Legs</router-link>
+            <router-link to="/muscles/back" class="nav-item nav-link">Back</router-link>
+            <router-link to="/muscles/chest" class="nav-item nav-link">Chest</router-link>
+            <router-link to="/muscles/shoulder" class="nav-item nav-link">Shoulder</router-link>
+            <router-link to="/muscles/triceps" class="nav-item nav-link">Triceps</router-link>
+            <router-link to="/muscles/biceps" class="nav-item nav-link">Biceps</router-link>
         </div>
     </nav>
-</template>
\ No newline at end of file
+</template>
+
+<script setup>
+</script>
+
+<style lang="scss" scoped>
+.navbar{
+    display: flex;
+    width: 100%;
+    height: 4rem;
+    justify-content: start;
+    background: grey;
+}
+.navbar-nav{
+    display: flex;
+    width: 100%;
+    justify-content: start;
+    align-items: center;
+}
+.nav-item{
+    margin-left: 1rem;
+    margin-right: 1rem;
+    color: white;
+    text-decoration: none;
+}
+.nav-item:hover{
+    color: blue;
+}
+.logo{
+    width: 20%;
+}
+</style>