Compare commits
2 Commits
a31c8aed39
...
38e31a9e3d
Author | SHA1 | Date | |
---|---|---|---|
|
38e31a9e3d | ||
|
9d3ad0d9a7 |
|
@ -23,6 +23,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
.min-width-btn {
|
||||
min-width: 1px!important;
|
||||
}
|
||||
|
||||
.nav-link:link {
|
||||
color: #4FDBFEFF!important;
|
||||
}
|
||||
|
|
|
@ -7,6 +7,9 @@ export default {
|
|||
username: 'guest'
|
||||
};
|
||||
},
|
||||
props: {
|
||||
isWide: Boolean
|
||||
},
|
||||
computed: {
|
||||
user() {
|
||||
const authStore = useAuthStore();
|
||||
|
@ -25,9 +28,24 @@ export default {
|
|||
</script>
|
||||
|
||||
<template>
|
||||
<v-label class="text-h3">Welcome {{ user != null ? user.name : 'guest' }}!</v-label><br>
|
||||
<div v-if="user == null" class="d-flex justify-center align-center h-100 flex-column w-100">
|
||||
<v-label class="text-h3 d-flex justify-center align-center" :class="isWide ? 'w-100' : 'w-10'">Welcome guest!</v-label><br>
|
||||
<div class="d-flex justify-center align-center ma-5 w-100">
|
||||
<router-link to="/register" class="ma-3 text-decoration-none link-no-color flex-grow-0 min-width-btn" :class="isWide ? 'w-10' : 'w-100'">
|
||||
<v-btn color="#F0A068FF" class="pa-3" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Регистрация</v-btn>
|
||||
</router-link>
|
||||
<router-link to="/login" class="ma-3 text-decoration-none link-no-color flex-grow-0 min-width-btn" :class="isWide ? 'w-10' : 'w-100'">
|
||||
<v-btn color="#F0A068FF" class="pa-3" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Вход</v-btn>
|
||||
</router-link>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="d-flex justify-center align-center h-100 flex-column w-100">
|
||||
<v-label class="text-h3 d-flex justify-center align-center" :class="isWide ? 'w-100' : 'w-10'">Welcome {{ user.name }}!</v-label>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.w-10 {
|
||||
width: 10%;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
<template>
|
||||
<div class="w-100 h-100 d-flex justify-center">
|
||||
<div class="d-flex flex-column justify-center h-100" :class="isWide ? 'w-50' : 'w-75'">
|
||||
<v-form @submit.prevent="login">
|
||||
<v-label>Логин:</v-label>
|
||||
<div class="d-flex flex-column align-center justify-center h-100 w-75">
|
||||
<v-form class="d-flex flex-column justify-center h-100 flex-grow-1" :class="isWide ? 'w-50' : 'w-75'" @submit.prevent="login">
|
||||
<v-label>Email:</v-label>
|
||||
<v-text-field type="email" v-model="email" label="E-mail" class="flex-grow-0" required></v-text-field>
|
||||
<v-label>Пароль:</v-label>
|
||||
<v-text-field type="password" v-model="password" label="Пароль" class="flex-grow-0" required></v-text-field>
|
||||
<div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'">
|
||||
<v-btn type="submit" color="#F0A068FF" class="ma-5 flex-grow-0" :class="isWide ? 'w-25' : 'w-100 text-body-1'" block>Войти</v-btn>
|
||||
<router-link to="/register" class="text-decoration-none link-no-color ma-5" :class="isWide ? 'w-25' : 'w-100'">
|
||||
<div class="d-flex justify-center align-center" :class="isWide ? '' : 'flex-column align-center'">
|
||||
<v-btn type="submit" color="#F0A068FF" class="ma-5 min-width-btn flex-grow-0" :class="isWide ? 'w-25' : 'w-100 text-body-1'" block>Войти</v-btn>
|
||||
<router-link to="/register" class="text-decoration-none link-no-color ma-5 flex-grow-0" :class="isWide ? 'w-25' : 'w-100'">
|
||||
<v-btn color="#F0A068FF" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Регистрация</v-btn>
|
||||
</router-link>
|
||||
</div>
|
||||
|
|
|
@ -37,8 +37,8 @@ export default {
|
|||
<v-label>Пароль:</v-label>
|
||||
<v-text-field type="password" v-model="password" label="Пароль" class="flex-grow-0" required></v-text-field>
|
||||
<div class="d-flex justify-center" :class="isWide ? '' : 'flex-column align-center'">
|
||||
<v-btn type="submit" color="#F0A068FF" class="ma-5" :class="isWide ? 'w-25' : 'w-100 text-body-1'" block>Зарегистрироваться</v-btn>
|
||||
<router-link to="/login" class="text-decoration-none link-no-color ma-5" :class="isWide ? 'w-25' : 'w-100'">
|
||||
<v-btn type="submit" color="#F0A068FF" class="ma-5 min-width-btn flex-grow-0" :class="isWide ? 'w-25' : 'w-100 text-body-1'" block>Зарегистрироваться</v-btn>
|
||||
<router-link to="/login" class="text-decoration-none link-no-color ma-5 flex-grow-0" :class="isWide ? 'w-25' : 'w-100'">
|
||||
<v-btn color="#F0A068FF" :class="isWide ? 'w-100' : 'w-100 text-body-1'">Вход</v-btn>
|
||||
</router-link>
|
||||
</div>
|
||||
|
|
Loading…
Reference in New Issue