Improve Registration / Login UI

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2019-10-10 14:20:09 +02:00
parent e56854f13b
commit 8d88aa1450
5 changed files with 157 additions and 138 deletions

View File

@@ -1,24 +1,28 @@
<template>
<section class="container">
<div class="column">
<h1 class="title">
{{ $t('Resend confirmation email') }}
</h1>
<form v-if="!validationSent" @submit="resendConfirmationAction">
<b-field label="Email">
<b-input aria-required="true" required type="email" v-model="credentials.email"/>
</b-field>
<button class="button is-primary">
{{ $t('Send confirmation email again') }}
</button>
</form>
<div v-else>
<b-message type="is-success" :closable="false" title="Success">
{{ $t('If an account with this email exists, we just sent another confirmation email to {email}', {email: credentials.email}) }}
</b-message>
<b-message type="is-info">
{{ $t("Please check your spam folder if you didn't receive the email.") }}
</b-message>
<div class="columns is-mobile is-centered">
<div class="column is-half-desktop">
<h1 class="title">
{{ $t('Resend confirmation email') }}
</h1>
<form v-if="!validationSent" @submit="resendConfirmationAction">
<b-field label="Email">
<b-input aria-required="true" required type="email" v-model="credentials.email"/>
</b-field>
<p class="control has-text-centered">
<b-button type="is-primary">
{{ $t('Send me the confirmation email once again') }}
</b-button>
</p>
</form>
<div v-else>
<b-message type="is-success" :closable="false" title="Success">
{{ $t('If an account with this email exists, we just sent another confirmation email to {email}', {email: credentials.email}) }}
</b-message>
<b-message type="is-info">
{{ $t("Please check your spam folder if you didn't receive the email.") }}
</b-message>
</div>
</div>
</div>
</section>
@@ -73,3 +77,9 @@ export default class ResendConfirmation extends Vue {
}
}
</script>
<style lang="scss" scoped>
.container .columns {
margin: 1rem auto 3rem;
}
</style>