added navigation tilebar

src/views/HomeView.vue

@@ -1,9 +1,9 @@
 <script setup>
-import TheWelcome from '../components/TheWelcome.vue'
+
 </script>
 
 <template>
   <main>
-    <TheWelcome />
+    <h1 HomeView h1/>
   </main>
 </template>

src/views/Muscles/BackView.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="back">
+      <h1>Back</h1>
+    </div>
+  </template>
+  
+  <style>
+  @media (min-width: 1024px) {
+    .about {
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+    }
+  }
+  </style>
+  

src/views/Muscles/BicepsView.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="biceps">
+      <h1>Biceps</h1>
+    </div>
+  </template>
+  
+  <style>
+  @media (min-width: 1024px) {
+    .about {
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+    }
+  }
+  </style>
+  

src/views/Muscles/ChestView.vue

@@ -1,6 +1,10 @@
+<script setup>
+
+</script>
+
 <template>
-  <div class="about">
-    <h1>This is an about page</h1>
+  <div class="chest">
+    <h1>Chest</h1>
   </div>
 </template>
 

src/views/Muscles/LegsView.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="legs">
+      <h1>Legs</h1>
+    </div>
+  </template>
+  
+  <style>
+  @media (min-width: 1024px) {
+    .about {
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+    }
+  }
+  </style>
+  

src/views/Muscles/ShoulderView.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="shoulder">
+      <h1>Shoulder</h1>
+    </div>
+  </template>
+  
+  <style>
+  @media (min-width: 1024px) {
+    .about {
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+    }
+  }
+  </style>
+  

src/views/Muscles/TricepsView.vue

@@ -0,0 +1,16 @@
+<template>
+    <div class="triceps">
+      <h1><button>Triceps</button></h1>
+    </div>
+  </template>
+  
+  <style>
+  @media (min-width: 1024px) {
+    .about {
+      min-height: 100vh;
+      display: flex;
+      align-items: center;
+    }
+  }
+  </style>
+