Register gemacht. Kleine Änderung

Kleine Änderung:
- In Login:
    - Logo RICHTIG gefärbt
    - Remember me (keine Funktion) hinzufegüt
    - Weiterleitung auf register
Register:
Registrierung seite erstellt und registrieren möglich gemacht + API anbindung
This commit is contained in:
danielvici123
2024-12-22 20:08:47 +01:00
parent 1d8665d6ce
commit 8b4b99a015
6 changed files with 128 additions and 14 deletions

View File

@@ -5,7 +5,8 @@ import { ref } from 'vue';
let input_username_mail = ref("");
let input_user_password = ref("");
async function login() {
async function login(event: Event) {
event.preventDefault();
const username = input_username_mail;
@@ -37,25 +38,25 @@ async function login() {
}
}
function handleSubmit(event: Event) {
event.preventDefault();
login();
}
</script>
<template>
<div class="px-20 border-x border-x-grau2 pb-35p">
<div class="text-3xl pt-32"> <!-- ÜBERSCHRIFT-->
<p class="text-weiss text-center">Welcome to <span class="text-logo-farbe-rot">E</span><span class="text-logo-farbe-lila">S</span><span class="text-logo-farbe-blau">P</span>!</p>
<p class="text-weiss text-center">Welcome to <label class="bg-schwarz p-1 rounded-lg mr-1"><span class="text-logo-farbe-lila">E</span><span class="text-logo-farbe-rot">S</span><span class="text-logo-farbe-blau">P</span></label>!</p>
<p class="text-weiss text-center">Login or create a new Account to continue</p>
</div>
<div class="px-20 pt-7"><!-- FORM --->
<form class="flex flex-col items-center" @submit.prevent="handleSubmit">
<form class="flex flex-col items-center" @submit.prevent="login">
<input class="m-4 w-full max-w-xs bg-grau-dunkel p-4 text-weiss placeholder-grau2 focus:outline-none rounded-lg" v-model="input_username_mail" 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" v-model="input_user_password" type="password" placeholder="Password"><br>
<button class="m-4 bg-button-farbe w-full max-w-xs p-4 text-grau-dunkel rounded-lg" @click="login()">Login</button>
<button class="m-4 bg-button-farbe w-full max-w-xs p-4 text-schwarz rounded-lg hover:shadow-2xl hover:shadow-grau-dunkel">Login</button>
<p class="text-weiss"><input type="checkbox" > Remeber me</p>
</form>
</div>
<div>
<p class="text-weiss text-center">No Account? <router-link to="/register" class="text-button-farbe">Register here</router-link></p>
</div>
</div>
</template>