TeamPiped-mirror/Piped
1
0
Fork 0
mirror of https://github.com/TeamPiped/Piped.git synced 2024-08-14 23:57:27 +00:00
Code Issues Projects Releases Packages Wiki Activity

register page: add password visibility toggles

Browse source
This commit is contained in:
Bnyro 2023-08-14 10:21:22 +02:00
parent 00fad8c943
commit 9f0ce4a189
1 changed files with 18 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
src/components/RegisterPage.vue
View file

@ -1,12 +1,12 @@
<template> <template>
<h1 v-t="'titles.register'" class="my-4 text-center font-bold" /> <h1 v-t="'titles.register'" class="my-4 text-center font-bold" />
<hr /> <hr />
<div class="text-center"> <div class="flex justify-center text-center">
<form class="children:pb-3"> <form class="items-center px-3 children:pb-3">
<div> <div>
<input <input
v-model="username" v-model="username"
class="input" class="input w-full"
type="text" type="text"
autocomplete="username" autocomplete="username"
:placeholder="$t('login.username')" :placeholder="$t('login.username')"
@ -14,27 +14,33 @@
@keyup.enter="register" @keyup.enter="register"
/> />
</div> </div>
<div> <div class="flex justify-center">
<input <input
v-model="password" v-model="password"
class="input" class="input w-full"
type="password" :type="showPassword ? 'text' : 'password'"
autocomplete="password" autocomplete="password"
:placeholder="$t('login.password')" :placeholder="$t('login.password')"
:aria-label="$t('login.password')" :aria-label="$t('login.password')"
@keyup.enter="register" @keyup.enter="register"
/> />
<button type="button" class="btn ml-2" @click="showPassword = !showPassword">
<div class="i-fa6-solid:eye" />
</button>
</div> </div>
<div> <div class="flex justify-center">
<input <input
v-model="passwordConfirm" v-model="passwordConfirm"
class="input" class="input w-full"
type="password" :type="showConfirmPassword ? 'text' : 'password'"
autocomplete="password" autocomplete="password"
:placeholder="$t('login.password_confirm')" :placeholder="$t('login.password_confirm')"
:aria-label="$t('login.password_confirm')" :aria-label="$t('login.password_confirm')"
@keyup.enter="register" @keyup.enter="register"
/> />
<button type="button" class="btn ml-2" @click="showConfirmPassword = !showConfirmPassword">
<div class="i-fa6-solid:eye" />
</button>
</div> </div>
<div> <div>
<a v-t="'titles.register'" class="btn w-auto" @click="register" /> <a v-t="'titles.register'" class="btn w-auto" @click="register" />
@ -63,6 +69,9 @@ export default {
return { return {
username: null, username: null,
password: null, password: null,
passwordConfirm: null,
showPassword: false,
showConfirmPassword: false,
showUnsecureRegisterDialog: false, showUnsecureRegisterDialog: false,
forceUnsecureRegister: false, forceUnsecureRegister: false,
}; };