Main page created without function. CSS not working

This commit is contained in:
danielvici123
2024-10-31 16:38:36 +01:00
parent be36049883
commit 0e0cdfaa28
10 changed files with 55 additions and 98 deletions

View File

@@ -15,12 +15,12 @@ const contacts =[
<ul class="space-y-1">
<li v-for="(contact) in contacts" :key="contact" class="bg-grau-hell2 flex justify-between rounded-lg">
<!--CONTACT-->
<img src="@/assets/default_pp.png" alt="" class="w-16 h-16 mr-2">
<img src="../assets/default_pp.png" alt="" class="w-16 h-16 mr-2">
<div class="flex flex-col">
<label class="text-lg font-bold m-1" >{{ contact.display_name }}</label><br>
<p class="text-base m-1 text-logo-farbe-blau underline-offset-3">@{{ contact.username }}</p>
</div>
<img src="@/assets/icons/mail.png" alt="" class="ml-auto">
<img src="../assets/icons/mail.png" alt="" class="ml-auto">
</li>
</ul>
</div>

View File

@@ -55,7 +55,7 @@
<ul>
<li v-for="(postitem, indexus) in post" :key="post" class="border border-b-grau-hell rounded-lg p-1 m-2 bg-grau-hell2 flex">
<!-- POST -->
<img src="@/assets/default_pp.png" alt="" class="w-16 h-16">
<img src="../assets/default_pp.png" alt="" class="w-16 h-16">
<div>
<div> <!-- POST HEADER -->
<label class="text-lg font-bold m-1">{{postitem.author_display_name}}</label>
@@ -66,13 +66,13 @@
</div>
<div class="flex "> <!-- POST FOOTER -->
<div class="flex"> <!-- Comments -->
<img src="@/assets/icons/comment.png" alt="" class="align-middle">
<img src="../assets/icons/comment.png" alt="" class="align-middle">
<label class="text-sm m-1" v-if="postitem.comments_count != undefined">{{ postitem.comments_count }}</label>
<label class="text-sm m-1" v-else>Comments disabled</label>
</div>
<div class="flex items-center" @click="addLike(indexus)"> <!-- Likes -->
<img type="image" alt="" src="@/assets/icons/herz.png" class="align-middle">
<img type="image" alt="" src="../assets/icons/herz.png" class="align-middle">
<label class="text-sm m-1">{{ postitem.likes }}</label>
</div><!-- ENDE -->
</div>

View File

@@ -25,14 +25,14 @@ const sb_settings = () => {
<template>
<div class="pt-4 pl-1">
<img src="@/assets/esp-logo_no_text.png" alt="" class="rounded-lg h-12 w-24">
<img src="../assets/esp-logo_no_text.png" alt="" class="rounded-lg h-12 w-24">
<div class="align-middle space-y-3 pt-3 pl-3">
<img src="@/assets/icons/home-black.png" alt="" class="hover:bg-logo-farbe-lila shadow-2xl rounded-lg" v-on:click="sb_home">
<img src="@/assets/icons/lupe.png" alt="" class="hover:bg-logo-farbe-lila shadow-2xl rounded-lg" v-on:click="sb_search">
<img src="@/assets/icons/glocke.png" alt="" class="hover:bg-logo-farbe-rot shadow-2xl rounded-lg" v-on:click="sb_notifications">
<img src="@/assets/icons/mail.png" alt="" class="hover:bg-logo-farbe-rot shadow-2xl rounded-lg" v-on:click="sb_messages">
<img src="@/assets/icons/user.png" alt="" class="hover:bg-logo-farbe-blau shadow-2xl rounded-lg" v-on:click="sb_accounts">
<img src="@/assets/icons/zahnrad.png" alt="" class="hover:bg-logo-farbe-blau shadow-2xl rounded-lg" v-on:click="sb_settings">
<img src="../assets/icons/home-black.png" alt="" class="hover:bg-logo-farbe-lila shadow-2xl rounded-lg" v-on:click="sb_home">
<img src="../assets/icons/lupe.png" alt="" class="hover:bg-logo-farbe-lila shadow-2xl rounded-lg" v-on:click="sb_search">
<img src="../assets/icons/glocke.png" alt="" class="hover:bg-logo-farbe-rot shadow-2xl rounded-lg" v-on:click="sb_notifications">
<img src="../assets/icons/mail.png" alt="" class="hover:bg-logo-farbe-rot shadow-2xl rounded-lg" v-on:click="sb_messages">
<img src="../assets/icons/user.png" alt="" class="hover:bg-logo-farbe-blau shadow-2xl rounded-lg" v-on:click="sb_accounts">
<img src="../assets/icons/zahnrad.png" alt="" class="hover:bg-logo-farbe-blau shadow-2xl rounded-lg" v-on:click="sb_settings">
</div>
</div>
</template>