br0kenpixel/isop-mirror
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: restructure login page layout with container and card components

Browse Source
This commit is contained in:
Fábián Varga
2025-10-20 18:26:33 +02:00
parent ca19e0a4f7
commit d26d51c71d
1 changed files with 27 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

48
frontend/app/pages/login.vue
View File

@@ -1,29 +1,31 @@
<template> <template>
<div class="page-container form-wrap"> <v-container fluid class="page-container form-wrap">
<h2 class="page-title">Prihlásenie</h2> <v-card id="page-container-card">
<h2 class="page-title">Prihlásenie</h2>
<v-form v-model="isValid" @submit.prevent="onSubmit"> <v-form v-model="isValid" @submit.prevent="onSubmit">
<v-text-field v-model="form.email" :rules="[rules.required, rules.email]" label="Email:" variant="outlined" <v-text-field v-model="form.email" :rules="[rules.required, rules.email]" label="Email:"
density="comfortable" /> variant="outlined" density="comfortable" />
<v-text-field v-model="form.password" :rules="[rules.required]" :type="showPassword ? 'text' : 'password'" <v-text-field v-model="form.password" :rules="[rules.required]"
label="Heslo:" variant="outlined" density="comfortable" :type="showPassword ? 'text' : 'password'" label="Heslo:" variant="outlined" density="comfortable"
:append-inner-icon="showPassword ? 'mdi-eye-off-outline' : 'mdi-eye-outline'" :append-inner-icon="showPassword ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
@click:append-inner="showPassword = !showPassword" /> @click:append-inner="showPassword = !showPassword" />
<div class="actions-row"> <div class="actions-row">
<v-spacer /> <v-spacer />
<v-btn type="button" variant="tonal" color="success" size="small" class="forgot-btn" dense <v-btn type="button" variant="tonal" color="success" size="small" class="forgot-btn" dense
to="/reset_psw"> to="/reset_psw">
Zabudnuté heslo... Zabudnuté heslo...
</v-btn>
</div>
<v-btn type="submit" color="success" size="large" block :disabled="!isValid">
Prihlásiť
</v-btn> </v-btn>
</div> </v-form>
</v-card>
<v-btn type="submit" color="success" size="large" block :disabled="!isValid"> </v-container fluid>
Prihlásiť
</v-btn>
</v-form>
</div>
</template> </template>
<script setup> <script setup>
@@ -59,6 +61,10 @@ function onForgot() {
padding-right: 24px; padding-right: 24px;
} }
#page-container-card {
padding: 10px;
}
.form-wrap { .form-wrap {
max-width: 640px; max-width: 640px;
} }