some comments added

src/components/home_components/contacts.vue

@@ -15,10 +15,10 @@ const contacts =[
       <ul class="space-y-1">
         <li v-for="(contact) in contacts" :key="contact" class="flex rounded-lg">
           <!--CONTACT-->
-          <img src="../../assets/default_pp.png" alt="" class="w-12 h-12 mr-2">
+          <img src="../../assets/default_pp.png" alt="" class="w-12 h-12 mr-2"> <!--PROFILBILD-->
           <div class="">
-            <label class=" font-bold m-1 text-weiss">{{ contact.display_name }}</label><br>
-            <p class="text-base m-1 text-grau2 underline-offset-3">@{{ contact.username }}</p>
+            <label class=" font-bold m-1 text-weiss">{{ contact.display_name }}</label><br> <!-- display name-->
+            <p class="text-base m-1 text-grau2 underline-offset-3">@{{ contact.username }}</p> <!-- username-->
           </div>
         </li>
       </ul>

src/components/home_components/feed.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
   import { ref } from "vue";
   // import {valueOf} from "tailwindcss";
+
+  // PLACEHOLDER
   const post = ref([
     {id: 1,
       profile_picture: "../../assets/default_pp.png",

src/components/home_components/navigationbar.vue

@@ -2,6 +2,7 @@
 <script setup lang="ts">
 // Funktionen um die Seiten zu öffnen
 // home -> app.vue
+// PLACEHOLDER
 import router from "../../router";
 
 const sb_home = () => {
@@ -28,10 +29,10 @@ const sb_settings = () => {
 
 <template>
   <div class="pt-4 border-b-2 border-b-grau2">
-    <div class="items-center flex justify-center">
+    <div class="items-center flex justify-center"><!-- BILD-->
       <img src="../../assets/esp-logo_no_text.png" alt="" class="rounded-lg h-12 w-24 mx-auto" @click="sb_home">
     </div>
-    <div class="align-middle space-y-3 pt-3 pl-3 pb-4 font-bold text-xl">
+    <div class="align-middle space-y-3 pt-3 pl-3 pb-4 font-bold text-xl"> <!-- Icons (Bild) und Text -->
       <label class="flex text-center text-grau2 hover:bg-logo-farbe-lila shadow-2xl rounded-lg" @click="sb_home"><img  class="pr-2" src="../../assets/icons/home.png" alt=""> Home</label>
       <label class="flex text-center text-grau2 hover:bg-logo-farbe-lila shadow-2xl rounded-lg" @click="sb_search"><img class="pr-2" src="../../assets/icons/lupe.png" alt="">Search</label>
       <label class="flex text-center text-grau2 hover:bg-logo-farbe-rot shadow-2xl rounded-lg" @click="sb_notifications"><img class="pr-2" src="../../assets/icons/glocke.png" alt="">Notifications</label>

src/components/home_components/trending.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-
+//  PLACEHOLDER
 const hashtags = [
   {id: 1,name: "xbox", nr_posts: 553,category: "Gaming" } ,
   {id: 2,name: "lol" , nr_posts: 16422, category: "Gaming"},

src/components/login_components/login_comp.vue

@@ -1,14 +1,16 @@
-<script setup>
-
+<script setup lang="ts">
+/** *
+ * @author Daniel Cwikla
+ */
 </script>
 
 <template>
   <div class="px-20 border-x border-x-grau2 pb-35p">
-    <div class="text-3xl pt-32">
+    <div class="text-3xl pt-32"> <!-- ÜBERSCHRIFT-->
       <p class="text-weiss text-center">Welcome to <span class="text-button-farbe">ESP</span>!</p>
       <p class="text-weiss text-center">Login or create a new Account to continue</p>
     </div>
-    <div class="px-20 pt-7">
+    <div class="px-20 pt-7"><!--  FORM --->
       <form class="flex flex-col items-center">
         <input class="m-4 w-full max-w-xs bg-grau-dunkel p-4 text-weiss placeholder-grau2 focus:outline-none rounded-lg" type="text" placeholder="Username or E-Mail"><br>
         <input class="m-4 w-full max-w-xs bg-grau-dunkel p-4 text-weiss placeholder-grau2 focus:outline-none rounded-lg" type="text" placeholder="Password"><br>

src/router/index.ts

@@ -6,7 +6,6 @@ import { createRouter, createWebHistory } from "vue-router";
 import Home from "../components/Home.vue";
 import Login from "../components/Login.vue";
 import wip from "../components/wip.vue";
-
 // The routing does not happen automatically
 // Each route has to be defined here, or it wont work.
 const routes = [