some comments added
This commit is contained in:
@@ -15,10 +15,10 @@ const contacts =[
|
|||||||
<ul class="space-y-1">
|
<ul class="space-y-1">
|
||||||
<li v-for="(contact) in contacts" :key="contact" class="flex rounded-lg">
|
<li v-for="(contact) in contacts" :key="contact" class="flex rounded-lg">
|
||||||
<!--CONTACT-->
|
<!--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="">
|
<div class="">
|
||||||
<label class=" font-bold m-1 text-weiss">{{ contact.display_name }}</label><br>
|
<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>
|
<p class="text-base m-1 text-grau2 underline-offset-3">@{{ contact.username }}</p> <!-- username-->
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@@ -1,6 +1,8 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { ref } from "vue";
|
import { ref } from "vue";
|
||||||
// import {valueOf} from "tailwindcss";
|
// import {valueOf} from "tailwindcss";
|
||||||
|
|
||||||
|
// PLACEHOLDER
|
||||||
const post = ref([
|
const post = ref([
|
||||||
{id: 1,
|
{id: 1,
|
||||||
profile_picture: "../../assets/default_pp.png",
|
profile_picture: "../../assets/default_pp.png",
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
// Funktionen um die Seiten zu öffnen
|
// Funktionen um die Seiten zu öffnen
|
||||||
// home -> app.vue
|
// home -> app.vue
|
||||||
|
// PLACEHOLDER
|
||||||
import router from "../../router";
|
import router from "../../router";
|
||||||
|
|
||||||
const sb_home = () => {
|
const sb_home = () => {
|
||||||
@@ -28,10 +29,10 @@ const sb_settings = () => {
|
|||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="pt-4 border-b-2 border-b-grau2">
|
<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">
|
<img src="../../assets/esp-logo_no_text.png" alt="" class="rounded-lg h-12 w-24 mx-auto" @click="sb_home">
|
||||||
</div>
|
</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_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-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>
|
<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>
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
|
// PLACEHOLDER
|
||||||
const hashtags = [
|
const hashtags = [
|
||||||
{id: 1,name: "xbox", nr_posts: 553,category: "Gaming" } ,
|
{id: 1,name: "xbox", nr_posts: 553,category: "Gaming" } ,
|
||||||
{id: 2,name: "lol" , nr_posts: 16422, category: "Gaming"},
|
{id: 2,name: "lol" , nr_posts: 16422, category: "Gaming"},
|
||||||
|
|||||||
@@ -1,14 +1,16 @@
|
|||||||
<script setup>
|
<script setup lang="ts">
|
||||||
|
/** *
|
||||||
|
* @author Daniel Cwikla
|
||||||
|
*/
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="px-20 border-x border-x-grau2 pb-35p">
|
<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">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>
|
<p class="text-weiss text-center">Login or create a new Account to continue</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="px-20 pt-7">
|
<div class="px-20 pt-7"><!-- FORM --->
|
||||||
<form class="flex flex-col items-center">
|
<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="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>
|
<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>
|
||||||
|
|||||||
@@ -6,7 +6,6 @@ import { createRouter, createWebHistory } from "vue-router";
|
|||||||
import Home from "../components/Home.vue";
|
import Home from "../components/Home.vue";
|
||||||
import Login from "../components/Login.vue";
|
import Login from "../components/Login.vue";
|
||||||
import wip from "../components/wip.vue";
|
import wip from "../components/wip.vue";
|
||||||
|
|
||||||
// The routing does not happen automatically
|
// The routing does not happen automatically
|
||||||
// Each route has to be defined here, or it wont work.
|
// Each route has to be defined here, or it wont work.
|
||||||
const routes = [
|
const routes = [
|
||||||
|
|||||||
Reference in New Issue
Block a user