extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2024-11-22 16:23:18 +01:00
Code Issues Packages Projects Releases Wiki Activity

Refine UI and translations

Browse Source
This commit is contained in:
Bubka 2022-04-15 16:20:34 +02:00
parent 2ba66f5c96
commit 63fafed6a9
5 changed files with 25 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
resources/js/components/FormWrapper.vue
View File

@ -1,7 +1,7 @@
<template>
<div class="columns is-centered">
<div class="form-column column is-two-thirds-tablet is-half-desktop is-one-third-widescreen is-one-third-fullhd">
<h1 class="title" v-html="title" v-if="title"></h1>
<h1 class="title has-text-grey-dark" v-html="title" v-if="title"></h1>
<div v-if="punchline" class="block" v-html="punchline"></div>
<slot />
</div>

24
resources/js/views/auth/Login.vue
View File

@ -1,15 +1,17 @@
<template>
<div v-if="username">
<!-- webauthn authentication -->
<form-wrapper v-if="showWebauthn" :title="$t('auth.forms.login')" :punchline="punchline">
<form-wrapper v-if="showWebauthn" :title="$t('auth.forms.webauthn_login')" :punchline="punchline">
<div class="field">
{{ $t('auth.webauthn.use_security_device_to_sign_in') }}
</div>
<div class="control">
<button type="button" class="button is-link" @click="webauthnLogin">{{ $t('auth.sign_in') }}</button>
<button type="button" class="button is-link" @click="webauthnLogin">{{ $t('commons.continue') }}</button>
</div>
<div class="nav-links">
<p>{{ $t('auth.webauthn.lost_your_device') }}&nbsp;<router-link :to="{ name: 'webauthn.lost' }" class="is-link">{{ $t('auth.webauthn.recover_your_account') }}</router-link></p>
<p v-if="!this.$root.appSettings.useWebauthnOnly">{{ $t('auth.sign_in_using') }}&nbsp;<a class="is-link" @click="showWebauthn = false">{{ $t('auth.login_and_password') }}</a></p>
</div>
<p>{{ $t('auth.webauthn.lost_your_device') }}&nbsp;<router-link :to="{ name: 'webauthn.lost' }" class="is-link">{{ $t('auth.webauthn.recover_your_account') }}</router-link></p>
<p v-if="!this.$root.appSettings.useWebauthnOnly">{{ $t('auth.sign_in_using') }}&nbsp;<a class="is-link" @click="showWebauthn = false">{{ $t('auth.login_and_password') }}</a></p>
</form-wrapper>
<!-- login/password legacy form -->
<form-wrapper v-else :title="$t('auth.forms.login')" :punchline="punchline">
@ -19,12 +21,14 @@
<form-field :form="form" fieldName="password" inputType="password" :label="$t('auth.forms.password')" />
<form-buttons :isBusy="form.isBusy" :caption="$t('auth.sign_in')" />
</form>
<div v-if="!username">
<p>{{ $t('auth.forms.dont_have_account_yet') }}&nbsp;<router-link :to="{ name: 'register' }" class="is-link">{{ $t('auth.register') }}</router-link></p>
</div>
<div v-else>
<p>{{ $t('auth.forms.forgot_your_password') }}&nbsp;<router-link :to="{ name: 'password.request' }" class="is-link">{{ $t('auth.forms.request_password_reset') }}</router-link></p>
<p >{{ $t('auth.sign_in_using') }}&nbsp;<a class="is-link" @click="showWebauthn = true">{{ $t('auth.webauthn.security_device') }}</a></p>
<div class="nav-links">
<div v-if="!username">
<p>{{ $t('auth.forms.dont_have_account_yet') }}&nbsp;<router-link :to="{ name: 'register' }" class="is-link">{{ $t('auth.register') }}</router-link></p>
</div>
<div v-else>
<p>{{ $t('auth.forms.forgot_your_password') }}&nbsp;<router-link :to="{ name: 'password.request' }" class="is-link">{{ $t('auth.forms.request_password_reset') }}</router-link></p>
<p >{{ $t('auth.sign_in_using') }}&nbsp;<a class="is-link" @click="showWebauthn = true">{{ $t('auth.webauthn.security_device') }}</a></p>
</div>
</div>
</form-wrapper>
</div>

4
resources/js/views/auth/Register.vue
View File

@ -29,7 +29,9 @@
<form-field :form="registerForm" fieldName="password_confirmation" inputType="password" :label="$t('auth.forms.confirm_password')" />
<form-buttons :isBusy="registerForm.isBusy" :isDisabled="registerForm.isDisabled" :caption="$t('auth.register')" />
</form>
<p>{{ $t('auth.forms.already_register') }}&nbsp;<router-link :to="{ name: 'login' }" class="is-link">{{ $t('auth.sign_in') }}</router-link></p>
<div class="nav-links">
<p>{{ $t('auth.forms.already_register') }}&nbsp;<router-link :to="{ name: 'login' }" class="is-link">{{ $t('auth.sign_in') }}</router-link></p>
</div>
</form-wrapper>
</div>
</template>

3
resources/lang/en/auth.php
View File

@ -41,7 +41,7 @@
'security_devices_legend' => 'Authentication devices you can use to sign in 2FAuth, like security keys (i.e Yubikey) or smartphones with biometric capabilities (i.e. Apple FaceId/TouchId)',
'enhance_security_using_webauthn' => 'You can enhance the security of your 2FAuth account by enabling WebAuthn authentication.<br /><br />
WebAuthn allows you to use trusted devices (like Yubikeys or smartphones with biometric capabilities) to sign in quickly and more securely.',
'use_security_device_to_sign_in' => 'Get ready to authenticate yourself using (one of) your security devices. Plug your key in, remove face mask or gloves, etc.',
'use_security_device_to_sign_in' => 'Get ready to authenticate using (one of) your security devices. Plug your key in, remove face mask or gloves, etc.',
'lost_your_device' => 'Lost your device?',
'recover_your_account' => 'Recover your account',
'account_recovery' => 'Account recovery',
@ -73,6 +73,7 @@
'forms' => [
'name' => 'Name',
'login' => 'Login',
'webauthn_login' => 'WebAuthn login',
'email' => 'Email',
'password' => 'Password',
'confirm_password' => 'Confirm password',

10
resources/sass/app.scss vendored
View File

@ -98,13 +98,13 @@ a:hover {
padding-top: 3rem;
}
.form-column > p {
margin-bottom: 0.75rem;
padding-top: 0.75rem;
.form-column > div.nav-links {
padding-top: 1.5rem;
}
.form-column > p:first-of-type {
padding-top: 1.5rem !important;
.form-column > div.nav-links p {
margin-bottom: 0.25rem;
padding-top: 0.25rem;
}
.modal-background {