mirror of
https://github.com/discourse/discourse.git
synced 2024-11-22 10:33:51 +08:00
UX: Visual adjustments to login/signup forms (#28680)
This adds several improvements to the signup/login forms. Some of them include: - Added a minimal signup progress bar design for mobile. - Made the signup/login modals full height on mobile. - Improved the activation, account creation, and login-required pages on mobile. - Removed the subheader and emoji from the welcome component. - Removed most input instructions. - Used consistent font size for text below the inputs. - Displayed input instructions only when the field is focused. - Improved the vertical alignment of input labels. - Increased the spacing between inputs. - Fixed label positioning for custom fields. - Moved the "(optional)" text for the name input outside the instructions. - Disabled buttons during login to prevent layout shifts. - Reused the CTA component for modals as well. - Matched the invite CTA styles with the signup form. --------- Co-authored-by: Jan Cernik <jancernik12@gmail.com> Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
This commit is contained in:
chapoi
GitHub
parent
edd114aee2
commit
8ac1f6ad9a
|
|
@ -25,7 +25,6 @@
|
|||
<WelcomeHeader
|
||||
id="create-account-title"
|
||||
@header={{i18n "create_account.header_title"}}
|
||||
@subheader={{i18n "create_account.subheader_title"}}
|
||||
>
|
||||
<PluginOutlet
|
||||
@name="create-account-header-bottom"
|
||||
|
|
@ -55,15 +54,16 @@
|
|||
<label class="alt-placeholder" for="new-account-email">
|
||||
{{i18n "user.email.title"}}
|
||||
</label>
|
||||
<InputTip
|
||||
@validation={{this.emailValidation}}
|
||||
id="account-email-validation"
|
||||
/>
|
||||
{{#unless this.emailValidation.reason}}
|
||||
{{#if this.emailValidation.reason}}
|
||||
<InputTip
|
||||
@validation={{this.emailValidation}}
|
||||
id="account-email-validation"
|
||||
/>
|
||||
{{else}}
|
||||
<span class="more-info" id="account-email-validation-more-info">
|
||||
{{i18n "user.email.instructions"}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="input-group create-account__username">
|
||||
|
|
@ -86,11 +86,6 @@
|
|||
@validation={{this.usernameValidation}}
|
||||
id="username-validation"
|
||||
/>
|
||||
{{#unless this.usernameValidation.reason}}
|
||||
<span class="more-info" id="username-validation-more-info">
|
||||
{{i18n "user.username.instructions"}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
</div>
|
||||
|
||||
<PluginOutlet
|
||||
|
|
@ -126,11 +121,6 @@
|
|||
@validation={{this.passwordValidation}}
|
||||
id="password-validation"
|
||||
/>
|
||||
{{#unless this.passwordValidation.reason}}
|
||||
<span class="more-info" id="password-validation-more-info">
|
||||
{{this.passwordInstructions}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
<div
|
||||
class={{concat-class
|
||||
"caps-lock-warning"
|
||||
|
|
@ -207,18 +197,13 @@
|
|||
class={{value-entered this.model.accountName}}
|
||||
/>
|
||||
<label class="alt-placeholder" for="new-account-name">
|
||||
{{i18n "user.name.title"}}
|
||||
{{this.nameTitle}}
|
||||
</label>
|
||||
|
||||
<InputTip
|
||||
@validation={{this.nameValidation}}
|
||||
id="fullname-validation"
|
||||
/>
|
||||
{{#unless this.nameValidation.reason}}
|
||||
<span class="more-info" id="fullname-validation-more-info">
|
||||
{{this.nameInstructions}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
|
|
@ -250,34 +235,13 @@
|
|||
|
||||
{{#if this.site.desktopView}}
|
||||
<div class="d-modal__footer">
|
||||
{{#if this.disclaimerHtml}}
|
||||
<div class="disclaimer">
|
||||
{{html-safe this.disclaimerHtml}}
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="d-modal__footer-buttons">
|
||||
<DButton
|
||||
@action={{this.createAccount}}
|
||||
@disabled={{this.submitDisabled}}
|
||||
@label="create_account.title"
|
||||
@isLoading={{this.formSubmitted}}
|
||||
class="btn-large btn-primary"
|
||||
/>
|
||||
|
||||
{{#unless this.hasAuthOptions}}
|
||||
<hr />
|
||||
<div class="already-have-account">
|
||||
{{i18n "create_account.already_have_account"}}
|
||||
</div>
|
||||
<DButton
|
||||
@action={{route-action "showLogin"}}
|
||||
@disabled={{this.formSubmitted}}
|
||||
@label="log_in"
|
||||
id="login-link"
|
||||
class="btn-large btn-flat"
|
||||
/>
|
||||
{{/unless}}
|
||||
</div>
|
||||
<SignupPageCta
|
||||
@formSubmitted={{this.formSubmitted}}
|
||||
@hasAuthOptions={{this.hasAuthOptions}}
|
||||
@createAccount={{this.createAccount}}
|
||||
@submitDisabled={{this.submitDisabled}}
|
||||
@disclaimerHtml={{this.disclaimerHtml}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<PluginOutlet
|
||||
|
|
@ -307,34 +271,12 @@
|
|||
|
||||
<:footer>
|
||||
{{#if (and this.showCreateForm this.site.mobileView)}}
|
||||
{{#if this.disclaimerHtml}}
|
||||
<div class="disclaimer">
|
||||
{{html-safe this.disclaimerHtml}}
|
||||
</div>
|
||||
{{/if}}
|
||||
<div class="d-modal__footer-buttons">
|
||||
<DButton
|
||||
@action={{this.createAccount}}
|
||||
@disabled={{this.submitDisabled}}
|
||||
@label="create_account.title"
|
||||
@isLoading={{this.formSubmitted}}
|
||||
class="btn-large btn-primary"
|
||||
/>
|
||||
|
||||
{{#unless this.hasAuthOptions}}
|
||||
<DButton
|
||||
@action={{route-action "showLogin"}}
|
||||
@disabled={{this.formSubmitted}}
|
||||
@label="log_in"
|
||||
id="login-link"
|
||||
class="btn-large btn-flat"
|
||||
/>
|
||||
{{/unless}}
|
||||
</div>
|
||||
|
||||
<PluginOutlet
|
||||
@name="create-account-after-modal-footer"
|
||||
@connectorTagName="div"
|
||||
<SignupPageCta
|
||||
@formSubmitted={{this.formSubmitted}}
|
||||
@hasAuthOptions={{this.hasAuthOptions}}
|
||||
@createAccount={{this.createAccount}}
|
||||
@submitDisabled={{this.submitDisabled}}
|
||||
@disclaimerHtml={{this.disclaimerHtml}}
|
||||
/>
|
||||
{{/if}}
|
||||
</:footer>
|
||||
|
|
|
|||
|
|
@ -27,10 +27,7 @@
|
|||
</div>
|
||||
{{else}}
|
||||
{{#if this.site.mobileView}}
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}}>
|
||||
<PluginOutlet
|
||||
@name="login-header-bottom"
|
||||
@outletArgs={{hash createAccount=this.createAccount}}
|
||||
|
|
@ -48,10 +45,7 @@
|
|||
{{#if this.canLoginLocal}}
|
||||
<div class={{if this.site.desktopView "login-left-side"}}>
|
||||
{{#if this.site.desktopView}}
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}}>
|
||||
<PluginOutlet
|
||||
@name="login-header-bottom"
|
||||
@outletArgs={{hash createAccount=this.createAccount}}
|
||||
|
|
@ -82,7 +76,7 @@
|
|||
/>
|
||||
{{#if this.site.desktopView}}
|
||||
<div class="d-modal__footer">
|
||||
<Modal::Login::Footer
|
||||
<LoginPageCta
|
||||
@canLoginLocal={{this.canLoginLocal}}
|
||||
@showSecurityKey={{this.showSecurityKey}}
|
||||
@login={{this.triggerLogin}}
|
||||
|
|
@ -101,10 +95,7 @@
|
|||
{{#if (and this.showLoginButtons this.site.desktopView)}}
|
||||
{{#unless this.canLoginLocal}}
|
||||
<div class="login-left-side">
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
/>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}} />
|
||||
</div>
|
||||
{{/unless}}
|
||||
{{#if this.hasAtLeastOneLoginButton}}
|
||||
|
|
@ -123,7 +114,7 @@
|
|||
<:footer>
|
||||
{{#if this.site.mobileView}}
|
||||
{{#unless this.hasNoLoginOptions}}
|
||||
<Modal::Login::Footer
|
||||
<LoginPageCta
|
||||
@canLoginLocal={{this.canLoginLocal}}
|
||||
@showSecurityKey={{this.showSecurityKey}}
|
||||
@login={{this.triggerLogin}}
|
||||
|
|
|
|||
|
|
@ -105,9 +105,7 @@ export default class Login extends Component {
|
|||
}
|
||||
|
||||
get showSignupLink() {
|
||||
return (
|
||||
this.args.model.canSignUp && !this.loggingIn && !this.showSecondFactor
|
||||
);
|
||||
return this.args.model.canSignUp && !this.showSecondFactor;
|
||||
}
|
||||
|
||||
get adminLoginPath() {
|
||||
|
|
|
|||
|
|
@ -1,26 +0,0 @@
|
|||
{{#if @canLoginLocal}}
|
||||
{{#unless @showSecurityKey}}
|
||||
<DButton
|
||||
@action={{@login}}
|
||||
id="login-button"
|
||||
form="login-form"
|
||||
@icon="unlock"
|
||||
@label={{@loginButtonLabel}}
|
||||
@disabled={{@loginDisabled}}
|
||||
class="btn btn-large btn-primary"
|
||||
tabindex={{unless @showSecondFactor "2"}}
|
||||
/>
|
||||
{{/unless}}
|
||||
|
||||
{{#if @showSignupLink}}
|
||||
<DButton
|
||||
class="btn-large btn-flat"
|
||||
id="new-account-link"
|
||||
@action={{@createAccount}}
|
||||
@label="create_account.title"
|
||||
tabindex="3"
|
||||
/>
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
<ConditionalLoadingSpinner @condition={{@loggingIn}} @size="small" />
|
||||
<PluginOutlet @name="login-after-modal-footer" @connectorTagName="div" />
|
||||
|
|
@ -10,6 +10,7 @@ import I18n from "discourse-i18n";
|
|||
|
||||
export default class SignupProgressBar extends Component {
|
||||
@service siteSettings;
|
||||
@service site;
|
||||
@tracked steps = [];
|
||||
|
||||
constructor() {
|
||||
|
|
@ -48,25 +49,22 @@ export default class SignupProgressBar extends Component {
|
|||
{{#if @step}}
|
||||
<div class="signup-progress-bar">
|
||||
{{#each this.steps as |step index|}}
|
||||
<div class="signup-progress-bar__segment">
|
||||
<div
|
||||
class={{concatClass
|
||||
"signup-progress-bar__step"
|
||||
(concat "--" (this.getStepState index))
|
||||
}}
|
||||
>
|
||||
<div
|
||||
class={{concatClass
|
||||
"signup-progress-bar__segment"
|
||||
(concat "--" (this.getStepState index))
|
||||
}}
|
||||
>
|
||||
<div class="signup-progress-bar__step">
|
||||
<div class="signup-progress-bar__circle">
|
||||
{{#if (eq (this.getStepState index) "completed")}}
|
||||
{{dIcon "check"}}
|
||||
{{#if this.site.desktopView}}
|
||||
{{#if (eq (this.getStepState index) "completed")}}
|
||||
{{dIcon "check"}}
|
||||
{{/if}}
|
||||
{{/if}}
|
||||
</div>
|
||||
{{#unless (eq index this.lastStepIndex)}}
|
||||
<span
|
||||
class={{concatClass
|
||||
"signup-progress-bar__line"
|
||||
(concat "--" (this.getStepState index))
|
||||
}}
|
||||
></span>
|
||||
<span class="signup-progress-bar__line"></span>
|
||||
{{/unless}}
|
||||
</div>
|
||||
<span class="signup-progress-bar__step-text">
|
||||
|
|
|
|||
|
|
@ -1,12 +1,6 @@
|
|||
import { wavingHandURL } from "discourse/lib/waving-hand-url";
|
||||
|
||||
const WelcomeHeader = <template>
|
||||
<div class="login-welcome-header" ...attributes>
|
||||
<h1 class="login-title">{{@header}}</h1>
|
||||
<img src={{(wavingHandURL)}} alt="" class="waving-hand" />
|
||||
{{#if @subheader}}
|
||||
<p class="login-subheader">{{@subheader}}</p>
|
||||
{{/if}}
|
||||
{{yield}}
|
||||
</div>
|
||||
</template>;
|
||||
|
|
|
|||
|
|
@ -70,15 +70,6 @@ export default class InvitesShowController extends Controller.extend(
|
|||
});
|
||||
}
|
||||
|
||||
@discourseComputed("existingUserId")
|
||||
subheaderMessage(existingUserId) {
|
||||
if (existingUserId) {
|
||||
return I18n.t("invites.existing_user_can_redeem");
|
||||
} else {
|
||||
return I18n.t("create_account.subheader_title");
|
||||
}
|
||||
}
|
||||
|
||||
@discourseComputed("email")
|
||||
yourEmailMessage(email) {
|
||||
return I18n.t("invites.your_email", { email });
|
||||
|
|
|
|||
|
|
@ -6,11 +6,11 @@ import I18n from "discourse-i18n";
|
|||
|
||||
export default Mixin.create({
|
||||
@discourseComputed()
|
||||
nameInstructions() {
|
||||
nameTitle() {
|
||||
return I18n.t(
|
||||
this.siteSettings.full_name_required
|
||||
? "user.name.instructions_required"
|
||||
: "user.name.instructions"
|
||||
? "user.name.title"
|
||||
: "user.name.title_optional"
|
||||
);
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -84,7 +84,7 @@ export default RouteTemplate(
|
|||
|
||||
<template>
|
||||
{{bodyClass "activate-account-page"}}
|
||||
{{hideApplicationHeaderButtons "search" "login" "signup"}}
|
||||
{{hideApplicationHeaderButtons "search" "login" "signup" "menu"}}
|
||||
{{hideApplicationSidebar}}
|
||||
{{#if this.errorMessage}}
|
||||
<div class="alert alert-error">
|
||||
|
|
@ -110,10 +110,9 @@ export default RouteTemplate(
|
|||
{{else}}
|
||||
<p>{{i18n "user.activate_account.please_continue"}}</p>
|
||||
<DButton
|
||||
class="continue-button"
|
||||
class="btn-primary continue-button"
|
||||
@translatedLabel={{i18n
|
||||
"user.activate_account.continue_button"
|
||||
site_name=this.siteSettings.title
|
||||
}}
|
||||
@action={{this.loadHomepage}}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -3,13 +3,10 @@
|
|||
{{hide-application-sidebar}}
|
||||
<section>
|
||||
<div class="container invites-show clearfix">
|
||||
{{#unless this.externalAuthsOnly}}
|
||||
{{#unless (or this.externalAuthsOnly this.existingUserId)}}
|
||||
<SignupProgressBar @step={{if this.successMessage "activate" "signup"}} />
|
||||
{{/unless}}
|
||||
<WelcomeHeader
|
||||
@header={{this.welcomeTitle}}
|
||||
@subheader={{unless this.successMessage this.subheaderMessage}}
|
||||
/>
|
||||
<WelcomeHeader @header={{this.welcomeTitle}} />
|
||||
|
||||
<div class={{if this.successMessage "invite-success" "invite-form"}}>
|
||||
<div class="col-form">
|
||||
|
|
@ -85,9 +82,9 @@
|
|||
id="account-email-validation"
|
||||
/>
|
||||
{{#unless this.emailValidation.reason}}
|
||||
<div class="instructions">{{i18n
|
||||
"user.email.instructions"
|
||||
}}</div>
|
||||
<div class="instructions">
|
||||
{{i18n "user.email.instructions"}}
|
||||
</div>
|
||||
{{/unless}}
|
||||
</div>
|
||||
{{/if}}
|
||||
|
|
@ -108,11 +105,6 @@
|
|||
@validation={{this.usernameValidation}}
|
||||
id="username-validation"
|
||||
/>
|
||||
{{#unless this.usernameValidation.reason}}
|
||||
<div class="instructions">{{i18n
|
||||
"user.username.instructions"
|
||||
}}</div>
|
||||
{{/unless}}
|
||||
</div>
|
||||
|
||||
{{#unless this.externalAuthsOnly}}
|
||||
|
|
@ -134,11 +126,6 @@
|
|||
@validation={{this.passwordValidation}}
|
||||
id="password-validation"
|
||||
/>
|
||||
{{#unless this.passwordValidation.reason}}
|
||||
<span
|
||||
class="more-info"
|
||||
>{{this.passwordInstructions}}</span>
|
||||
{{/unless}}
|
||||
<div
|
||||
class="caps-lock-warning
|
||||
{{unless this.capsLockOn 'hidden'}}"
|
||||
|
|
@ -174,7 +161,10 @@
|
|||
<label class="alt-placeholder" for="new-account-name">
|
||||
{{i18n "invites.name_label"}}
|
||||
</label>
|
||||
<div class="instructions">{{this.nameInstructions}}</div>
|
||||
<InputTip
|
||||
@validation={{this.nameValidation}}
|
||||
id="fullname-validation"
|
||||
/>
|
||||
</div>
|
||||
{{/if}}
|
||||
|
||||
|
|
|
|||
|
|
@ -29,10 +29,7 @@
|
|||
</div>
|
||||
{{else}}
|
||||
{{#if this.site.mobileView}}
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}}>
|
||||
<PluginOutlet
|
||||
@name="login-header-bottom"
|
||||
@outletArgs={{hash createAccount=this.createAccount}}
|
||||
|
|
@ -50,10 +47,7 @@
|
|||
{{#if this.canLoginLocal}}
|
||||
<div class={{if this.site.desktopView "login-left-side"}}>
|
||||
{{#if this.site.desktopView}}
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}}>
|
||||
<PluginOutlet
|
||||
@name="login-header-bottom"
|
||||
@outletArgs={{hash createAccount=this.createAccount}}
|
||||
|
|
@ -101,10 +95,7 @@
|
|||
{{#if (and this.showLoginButtons this.site.desktopView)}}
|
||||
{{#unless this.canLoginLocal}}
|
||||
<div class="login-left-side">
|
||||
<WelcomeHeader
|
||||
@header={{i18n "login.header_title"}}
|
||||
@subheader={{i18n "login.subheader_title"}}
|
||||
/>
|
||||
<WelcomeHeader @header={{i18n "login.header_title"}} />
|
||||
</div>
|
||||
{{/unless}}
|
||||
{{#if this.hasAtLeastOneLoginButton}}
|
||||
|
|
|
|||
|
|
@ -21,7 +21,6 @@
|
|||
<WelcomeHeader
|
||||
id="create-account-title"
|
||||
@header={{i18n "create_account.header_title"}}
|
||||
@subheader={{i18n "create_account.subheader_title"}}
|
||||
>
|
||||
<PluginOutlet
|
||||
@name="create-account-header-bottom"
|
||||
|
|
@ -51,15 +50,16 @@
|
|||
<label class="alt-placeholder" for="new-account-email">
|
||||
{{i18n "user.email.title"}}
|
||||
</label>
|
||||
<InputTip
|
||||
@validation={{this.emailValidation}}
|
||||
id="account-email-validation"
|
||||
/>
|
||||
{{#unless this.emailValidation.reason}}
|
||||
{{#if this.emailValidation.reason}}
|
||||
<InputTip
|
||||
@validation={{this.emailValidation}}
|
||||
id="account-email-validation"
|
||||
/>
|
||||
{{else}}
|
||||
<span class="more-info" id="account-email-validation-more-info">
|
||||
{{i18n "user.email.instructions"}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
<div class="input-group create-account__username">
|
||||
|
|
@ -82,11 +82,6 @@
|
|||
@validation={{this.usernameValidation}}
|
||||
id="username-validation"
|
||||
/>
|
||||
{{#unless this.usernameValidation.reason}}
|
||||
<span class="more-info" id="username-validation-more-info">
|
||||
{{i18n "user.username.instructions"}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
</div>
|
||||
|
||||
<PluginOutlet
|
||||
|
|
@ -122,11 +117,6 @@
|
|||
@validation={{this.passwordValidation}}
|
||||
id="password-validation"
|
||||
/>
|
||||
{{#unless this.passwordValidation.reason}}
|
||||
<span class="more-info" id="password-validation-more-info">
|
||||
{{this.passwordInstructions}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
<div
|
||||
class={{concat-class
|
||||
"caps-lock-warning"
|
||||
|
|
@ -203,18 +193,13 @@
|
|||
class={{value-entered this.accountName}}
|
||||
/>
|
||||
<label class="alt-placeholder" for="new-account-name">
|
||||
{{i18n "user.name.title"}}
|
||||
{{this.nameTitle}}
|
||||
</label>
|
||||
|
||||
<InputTip
|
||||
@validation={{this.nameValidation}}
|
||||
id="fullname-validation"
|
||||
/>
|
||||
{{#unless this.nameValidation.reason}}
|
||||
<span class="more-info" id="fullname-validation-more-info">
|
||||
{{this.nameInstructions}}
|
||||
</span>
|
||||
{{/unless}}
|
||||
{{/if}}
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -65,7 +65,7 @@
|
|||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.8em;
|
||||
margin-bottom: 1em;
|
||||
|
||||
input,
|
||||
.select-kit-header {
|
||||
|
|
@ -101,7 +101,7 @@
|
|||
position: absolute;
|
||||
pointer-events: none;
|
||||
left: 1em;
|
||||
top: 10px;
|
||||
top: 13px;
|
||||
box-shadow: 0 0 0 0px rgba(var(--tertiary-rgb), 0);
|
||||
transition: 0.2s ease all;
|
||||
}
|
||||
|
|
@ -116,7 +116,9 @@
|
|||
padding: 0 0.25em 0 0.25em;
|
||||
font-size: $font-down-1;
|
||||
}
|
||||
|
||||
.user-field.text label.control-label {
|
||||
top: 13px;
|
||||
}
|
||||
.user-field.text:focus-within,
|
||||
.user-field.dropdown:focus-within,
|
||||
.user-field.multiselect:focus-within {
|
||||
|
|
@ -135,6 +137,13 @@
|
|||
input.alt-placeholder:invalid {
|
||||
color: var(--primary);
|
||||
}
|
||||
.user-field.dropdown,
|
||||
.user-field.multiselect {
|
||||
.more-info,
|
||||
.instructions {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#email-login-link {
|
||||
transition: opacity 0.5s;
|
||||
|
|
@ -196,17 +205,32 @@
|
|||
}
|
||||
|
||||
.tip {
|
||||
font-size: var(--font-down-1);
|
||||
min-height: 1.4em;
|
||||
display: block;
|
||||
&.bad {
|
||||
color: var(--danger);
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.toggle-password-mask span {
|
||||
font-size: var(--font-down-1-rem);
|
||||
}
|
||||
|
||||
.more-info,
|
||||
.instructions {
|
||||
font-size: var(--font-down-1);
|
||||
color: var(--primary-medium);
|
||||
min-height: 1.4em;
|
||||
overflow-wrap: anywhere;
|
||||
transition: opacity 0.2s ease;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.input-group input:focus {
|
||||
& ~ .more-info,
|
||||
& ~ .instructions {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.caps-lock-warning {
|
||||
|
|
@ -224,6 +248,29 @@
|
|||
.inline-spinner {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
.invitation-cta {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1rem;
|
||||
&__accept {
|
||||
width: 100%;
|
||||
}
|
||||
&__info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 100%;
|
||||
gap: 0.5rem;
|
||||
line-height: 1rem;
|
||||
color: var(--primary-medium);
|
||||
}
|
||||
&__sign-in {
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Login page
|
||||
|
|
@ -296,9 +343,12 @@
|
|||
}
|
||||
|
||||
.controls .checkbox-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
input[type="checkbox"].ember-checkbox {
|
||||
width: 1em !important;
|
||||
min-width: unset;
|
||||
margin-block: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -36,8 +36,10 @@ body.static-login {
|
|||
padding: 2em;
|
||||
box-shadow: var(--shadow-card);
|
||||
border-radius: 5px;
|
||||
display: grid;
|
||||
place-items: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&__text {
|
||||
order: 4;
|
||||
|
|
|
|||
|
|
@ -5,7 +5,6 @@ $progress-bar-icon-size: 0.8rem;
|
|||
.signup-progress-bar {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
color: var(--primary-low-mid);
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 1.2em;
|
||||
|
||||
|
|
@ -14,6 +13,7 @@ $progress-bar-icon-size: 0.8rem;
|
|||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5rem;
|
||||
color: var(--primary-low-mid);
|
||||
|
||||
&:first-child .signup-progress-bar__circle {
|
||||
transform: translateX(50%);
|
||||
|
|
@ -29,7 +29,12 @@ $progress-bar-icon-size: 0.8rem;
|
|||
}
|
||||
}
|
||||
|
||||
&__step {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
&__step-text {
|
||||
color: var(--primary-high);
|
||||
white-space: nowrap;
|
||||
width: fit-content;
|
||||
transform: translateX(calc(calc($progress-bar-circle-size / 2) - 50%));
|
||||
|
|
@ -43,10 +48,11 @@ $progress-bar-icon-size: 0.8rem;
|
|||
calc(calc($progress-bar-circle-size + $progress-bar-line-width) - 100%)
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
&__step {
|
||||
display: flex;
|
||||
.--active & {
|
||||
font-weight: bold;
|
||||
color: var(--primary);
|
||||
}
|
||||
}
|
||||
|
||||
&__line {
|
||||
|
|
@ -56,6 +62,10 @@ $progress-bar-icon-size: 0.8rem;
|
|||
height: $progress-bar-line-width;
|
||||
width: 100%;
|
||||
background-color: var(--primary-low-mid);
|
||||
|
||||
.--completed & {
|
||||
background-color: var(--success);
|
||||
}
|
||||
}
|
||||
|
||||
&__circle {
|
||||
|
|
@ -70,27 +80,19 @@ $progress-bar-icon-size: 0.8rem;
|
|||
border-radius: 50%;
|
||||
border: $progress-bar-line-width solid var(--primary-low-mid);
|
||||
background-color: var(--secondary);
|
||||
}
|
||||
|
||||
&__step.--completed {
|
||||
color: var(--primary);
|
||||
|
||||
.signup-progress-bar__circle {
|
||||
.--active & {
|
||||
border-color: var(--success);
|
||||
background: var(--success);
|
||||
box-shadow: 0 0 1px 5px var(--success-low);
|
||||
}
|
||||
.--completed & {
|
||||
background-color: var(--success);
|
||||
border: $progress-bar-line-width solid var(--success);
|
||||
border-color: var(--success);
|
||||
}
|
||||
}
|
||||
|
||||
&__line.--completed {
|
||||
background-color: var(--success);
|
||||
}
|
||||
|
||||
&__step.--active {
|
||||
.signup-progress-bar__circle {
|
||||
border: $progress-bar-line-width solid var(--success);
|
||||
}
|
||||
+ .signup-progress-bar__step-text {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,6 +11,7 @@
|
|||
&__container {
|
||||
position: relative;
|
||||
width: max-content;
|
||||
width: 100%;
|
||||
}
|
||||
&__header {
|
||||
border-bottom: none;
|
||||
|
|
@ -63,7 +64,7 @@
|
|||
}
|
||||
|
||||
#login-form {
|
||||
margin: 3em 0 1.2em 0;
|
||||
margin: 2em 0 1em 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
|
@ -80,17 +81,32 @@
|
|||
}
|
||||
|
||||
.tip {
|
||||
font-size: var(--font-down-1);
|
||||
min-height: 1.4em;
|
||||
display: block;
|
||||
&.bad {
|
||||
color: var(--danger);
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
.toggle-password-mask span {
|
||||
font-size: var(--font-down-1-rem);
|
||||
}
|
||||
|
||||
.more-info,
|
||||
.instructions {
|
||||
font-size: var(--font-down-1);
|
||||
color: var(--primary-medium);
|
||||
min-height: 1.4em;
|
||||
overflow-wrap: anywhere;
|
||||
transition: opacity 0.2s ease;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.input-group input:focus {
|
||||
& ~ .more-info,
|
||||
& ~ .instructions {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.caps-lock-warning {
|
||||
|
|
@ -118,6 +134,46 @@
|
|||
}
|
||||
}
|
||||
|
||||
.login-page-cta,
|
||||
.signup-page-cta {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
&__disclaimer {
|
||||
color: var(--primary-medium);
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
|
||||
button {
|
||||
font-size: var(--font-0) !important;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&__existing-account,
|
||||
&__no-account-yet {
|
||||
color: var(--primary-medium);
|
||||
font-size: var(--font-down);
|
||||
margin-bottom: 0.5rem;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
&::before {
|
||||
content: " ";
|
||||
display: block;
|
||||
height: 1px;
|
||||
width: 100%;
|
||||
background-color: var(--primary-low);
|
||||
margin-block: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.desktop-view & {
|
||||
@media screen and (max-width: 767px) {
|
||||
// important to maintain narrow desktop widths
|
||||
|
|
@ -129,8 +185,9 @@
|
|||
.has-alt-auth {
|
||||
flex-direction: column;
|
||||
overflow: auto;
|
||||
gap: 1em;
|
||||
.d-modal__footer {
|
||||
gap: 0;
|
||||
.d-modal__footer,
|
||||
.btn-social {
|
||||
font-size: var(--font-down-1);
|
||||
}
|
||||
.login-left-side {
|
||||
|
|
@ -151,6 +208,13 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
.invites-show {
|
||||
#account-email-validation:not(:has(*)) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* end shared styles */
|
||||
|
||||
.d-modal.create-account {
|
||||
|
|
@ -205,7 +269,7 @@
|
|||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-bottom: 0.8em;
|
||||
margin-bottom: 1em;
|
||||
input,
|
||||
.select-kit-header {
|
||||
padding: 0.75em 0.77em;
|
||||
|
|
@ -236,7 +300,7 @@
|
|||
position: absolute;
|
||||
pointer-events: none;
|
||||
left: 1em;
|
||||
top: 10px;
|
||||
top: 13px;
|
||||
box-shadow: 0 0 0 0px rgba(var(--tertiary-rgb), 0);
|
||||
transition: 0.2s ease all;
|
||||
}
|
||||
|
|
@ -250,6 +314,9 @@
|
|||
padding: 0 0.25em 0 0.25em;
|
||||
font-size: $font-down-1;
|
||||
}
|
||||
.user-field.text label.control-label {
|
||||
top: 13px;
|
||||
}
|
||||
.user-field.text:focus-within,
|
||||
.user-field.dropdown:focus-within,
|
||||
.user-field.multiselect:focus-within {
|
||||
|
|
@ -266,6 +333,13 @@
|
|||
input.alt-placeholder:invalid {
|
||||
color: var(--primary);
|
||||
}
|
||||
.user-field.dropdown,
|
||||
.user-field.multiselect {
|
||||
.more-info,
|
||||
.instructions {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
#email-login-link {
|
||||
transition: opacity 0.5s;
|
||||
|
|
@ -321,7 +395,6 @@
|
|||
font-size: 16px;
|
||||
position: absolute;
|
||||
pointer-events: none;
|
||||
top: 12px;
|
||||
transition: 0.2s ease all;
|
||||
max-width: calc(100% - 2em);
|
||||
white-space: nowrap;
|
||||
|
|
@ -343,9 +416,12 @@
|
|||
box-shadow: 0 0 0 2px rgba(var(--tertiary-rgb), 0.25);
|
||||
}
|
||||
.controls .checkbox-label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
input[type="checkbox"].ember-checkbox {
|
||||
width: 1em !important;
|
||||
min-width: unset;
|
||||
margin-block: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -45,7 +45,8 @@
|
|||
overflow: auto;
|
||||
gap: 0;
|
||||
.login-page-cta,
|
||||
.signup-page-cta {
|
||||
.signup-page-cta,
|
||||
.btn-social {
|
||||
font-size: var(--font-down-1);
|
||||
}
|
||||
.login-left-side {
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@
|
|||
@import "push-notifications-mobile";
|
||||
@import "reviewables";
|
||||
@import "sidebar";
|
||||
@import "signup-progress-bar";
|
||||
@import "topic-list";
|
||||
@import "topic-post";
|
||||
@import "topic";
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
.login-welcome-header {
|
||||
box-sizing: border-box;
|
||||
|
||||
.login-title {
|
||||
font-size: var(--font-up-5);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,19 +1,57 @@
|
|||
.static-login {
|
||||
#main-outlet-wrapper,
|
||||
#main-outlet {
|
||||
padding: 0;
|
||||
}
|
||||
.contents.body-page {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
.login-welcome {
|
||||
gap: 2em;
|
||||
height: 100svh;
|
||||
width: 100svw;
|
||||
box-sizing: border-box;
|
||||
|
||||
.body-page-button-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 1em;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.d-modal.login-modal .d-modal__body {
|
||||
margin-top: 3.75rem;
|
||||
}
|
||||
|
||||
.d-modal.login-modal,
|
||||
.d-modal.create-account {
|
||||
padding-bottom: var(--safe-area-inset-bottom);
|
||||
.d-modal {
|
||||
&__container {
|
||||
height: 100svh;
|
||||
max-height: unset;
|
||||
width: 100%;
|
||||
}
|
||||
&__body {
|
||||
flex-direction: column;
|
||||
gap: unset;
|
||||
padding-inline: 0.5rem;
|
||||
padding-bottom: 1em;
|
||||
outline: none;
|
||||
}
|
||||
&__footer {
|
||||
padding: 1em 1.5rem;
|
||||
border-top: 1px solid var(--primary-low);
|
||||
padding: 1rem;
|
||||
font-size: var(--font-down-1);
|
||||
}
|
||||
&__footer-buttons {
|
||||
gap: 0.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.login-title {
|
||||
font-size: var(--font-up-4);
|
||||
}
|
||||
|
||||
.close {
|
||||
|
|
@ -33,7 +71,7 @@
|
|||
.login-or-separator {
|
||||
border-top: 1px solid var(--primary-low);
|
||||
position: relative;
|
||||
margin-block: 1rem;
|
||||
margin-block: 0.75rem;
|
||||
|
||||
span {
|
||||
transform: translate(-50%, -50%);
|
||||
|
|
@ -51,36 +89,85 @@
|
|||
#login-buttons {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
padding: 0 1rem;
|
||||
gap: 0.25em;
|
||||
margin-bottom: 1rem;
|
||||
height: unset;
|
||||
|
||||
.btn {
|
||||
margin: 0;
|
||||
padding-block: 0.65rem;
|
||||
border: 1px solid var(--primary-low);
|
||||
flex: 1 1 calc(50% - 0.25em);
|
||||
flex-grow: 1;
|
||||
font-size: var(--font-down-1);
|
||||
white-space: nowrap;
|
||||
&:last-child {
|
||||
margin-right: auto;
|
||||
min-width: calc(50% - 0.25em);
|
||||
}
|
||||
}
|
||||
|
||||
.login-page-cta {
|
||||
&__buttons {
|
||||
.login-page-cta__login {
|
||||
width: 100%;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
&__signup {
|
||||
background: none !important;
|
||||
font-size: var(--font-down);
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.signup-page-cta {
|
||||
&__buttons {
|
||||
.signup-page-cta__signup {
|
||||
width: 100%;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
&__login {
|
||||
background: none !important;
|
||||
font-size: var(--font-down);
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.login-page-cta,
|
||||
.signup-page-cta {
|
||||
&__existing-account,
|
||||
&__no-account-yet {
|
||||
width: unset;
|
||||
margin-bottom: 0;
|
||||
|
||||
&::before {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
&__buttons {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
gap: 0.5rem;
|
||||
}
|
||||
|
||||
button {
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
|
||||
#login-form,
|
||||
.login-form {
|
||||
margin: 0;
|
||||
padding: 1rem;
|
||||
padding: 1rem 1rem 0;
|
||||
|
||||
.input-group {
|
||||
input {
|
||||
height: 2.5em;
|
||||
margin-bottom: 0.25em;
|
||||
}
|
||||
margin-bottom: 1em;
|
||||
.user-field:not(.dropdown) label.alt-placeholder {
|
||||
top: 8px;
|
||||
&:not(:last-child) {
|
||||
margin-bottom: 0.75em;
|
||||
}
|
||||
input:focus + label,
|
||||
input.value-entered + label.alt-placeholder {
|
||||
|
|
@ -92,6 +179,15 @@
|
|||
label.more-info {
|
||||
color: var(--primary-medium);
|
||||
}
|
||||
.more-info,
|
||||
.tip,
|
||||
.instructions {
|
||||
font-size: var(--font-down-1-rem);
|
||||
}
|
||||
}
|
||||
|
||||
.user-fields {
|
||||
display: contents;
|
||||
}
|
||||
}
|
||||
.caps-lock-warning {
|
||||
|
|
@ -99,20 +195,82 @@
|
|||
}
|
||||
}
|
||||
|
||||
.d-modal.create-account {
|
||||
.d-modal__footer-buttons {
|
||||
flex-direction: row;
|
||||
gap: 8px;
|
||||
.login-modal,
|
||||
.create-account,
|
||||
.invites-show {
|
||||
#login-form,
|
||||
.login-form,
|
||||
.invite-form {
|
||||
.input-group {
|
||||
label.alt-placeholder,
|
||||
.user-field.text label.control-label {
|
||||
top: 11px;
|
||||
}
|
||||
div.user-field:not(.dropdown)
|
||||
.controls
|
||||
input:focus
|
||||
+ label.alt-placeholder.control-label,
|
||||
div.user-field.value-entered:not(.dropdown)
|
||||
.controls
|
||||
label.alt-placeholder.control-label {
|
||||
top: -10px;
|
||||
}
|
||||
.user-field.dropdown label.control-label,
|
||||
.user-field.multiselect label.control-label {
|
||||
top: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.account-created,
|
||||
.activate-account {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
max-width: unset;
|
||||
margin: 0;
|
||||
padding: 0.75em 1rem;
|
||||
box-shadow: none;
|
||||
|
||||
.activate-new-email {
|
||||
width: 100%;
|
||||
height: 2.5em;
|
||||
}
|
||||
|
||||
.activation-controls {
|
||||
flex-direction: column;
|
||||
gap: 1em;
|
||||
margin-top: auto;
|
||||
margin-bottom: 0.75em;
|
||||
|
||||
button {
|
||||
width: auto;
|
||||
height: 2.5em;
|
||||
}
|
||||
}
|
||||
|
||||
.login-welcome-header {
|
||||
padding-bottom: 0.25rem;
|
||||
.activate-account-button {
|
||||
margin-top: auto;
|
||||
margin-bottom: 0.75em;
|
||||
width: 100%;
|
||||
height: 2.5em;
|
||||
}
|
||||
|
||||
.signup-progress-bar {
|
||||
display: none;
|
||||
.account-activated {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
flex-grow: 1;
|
||||
align-items: center;
|
||||
.tada-image {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.continue-button {
|
||||
margin-top: auto;
|
||||
margin-bottom: 0.75em;
|
||||
width: 100%;
|
||||
height: 2.5em;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,6 +26,7 @@
|
|||
}
|
||||
|
||||
button {
|
||||
padding-block: 0.65rem;
|
||||
width: fit-content;
|
||||
}
|
||||
}
|
||||
|
|
@ -43,10 +44,6 @@
|
|||
|
||||
margin-bottom: 1em;
|
||||
|
||||
.user-field:not(.dropdown) label.alt-placeholder {
|
||||
top: 8px;
|
||||
}
|
||||
|
||||
input:focus + label,
|
||||
input.value-entered + label.alt-placeholder {
|
||||
top: -10px;
|
||||
|
|
@ -62,6 +59,30 @@
|
|||
}
|
||||
}
|
||||
|
||||
#login-form,
|
||||
.login-form,
|
||||
.invite-form {
|
||||
.input-group {
|
||||
label.alt-placeholder,
|
||||
.user-field.text label.control-label {
|
||||
top: 11px;
|
||||
}
|
||||
div.user-field:not(.dropdown)
|
||||
.controls
|
||||
input:focus
|
||||
+ label.alt-placeholder.control-label,
|
||||
div.user-field.value-entered:not(.dropdown)
|
||||
.controls
|
||||
label.alt-placeholder.control-label {
|
||||
top: -10px;
|
||||
}
|
||||
.user-field.dropdown label.control-label,
|
||||
.user-field.multiselect label.control-label {
|
||||
top: -10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#login-buttons {
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
|
|
@ -116,6 +137,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
.invites-show {
|
||||
.login-welcome-header {
|
||||
padding-inline: 0;
|
||||
}
|
||||
.signup-progress-bar {
|
||||
margin-inline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
// Login page
|
||||
|
||||
.login-fullpage .login-body {
|
||||
|
|
@ -160,10 +190,6 @@
|
|||
padding-top: 0;
|
||||
}
|
||||
|
||||
.signup-progress-bar {
|
||||
padding-inline: 1em;
|
||||
}
|
||||
|
||||
#login-form {
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
|
|
|||
30
app/assets/stylesheets/mobile/signup-progress-bar.scss
Normal file
30
app/assets/stylesheets/mobile/signup-progress-bar.scss
Normal file
|
|
@ -0,0 +1,30 @@
|
|||
$progress-bar-circle-size: 0.5rem;
|
||||
|
||||
.signup-progress-bar {
|
||||
width: auto;
|
||||
margin: 1.5rem 1.2rem;
|
||||
gap: 1rem;
|
||||
|
||||
.account-created &,
|
||||
.activate-account & {
|
||||
margin-inline: 0;
|
||||
}
|
||||
|
||||
&__segment {
|
||||
width: auto;
|
||||
}
|
||||
&__circle {
|
||||
height: $progress-bar-circle-size;
|
||||
width: $progress-bar-circle-size;
|
||||
transform: none !important;
|
||||
.--active & {
|
||||
background: var(--success);
|
||||
box-shadow: 0 0 1px 5px var(--success-low);
|
||||
}
|
||||
}
|
||||
|
||||
&__step-text,
|
||||
&__line {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
|
@ -1771,12 +1771,13 @@ en:
|
|||
action: "Click here to activate your account"
|
||||
already_done: "Sorry, this account confirmation link is no longer valid. Perhaps your account is already active?"
|
||||
please_continue: "Your new account is confirmed; you will be redirected to the home page."
|
||||
continue_button: "Continue to %{site_name}"
|
||||
continue_button: "Finish!"
|
||||
welcome_to: "Welcome to %{site_name}!"
|
||||
approval_required: "A moderator must manually approve your new account before you can access this forum. You'll get an email when your account is approved!"
|
||||
|
||||
name:
|
||||
title: "Name"
|
||||
title_optional: "Name (optional)"
|
||||
instructions: "Your full name (optional)"
|
||||
instructions_required: "Your full name"
|
||||
required: "Please enter a name"
|
||||
|
|
@ -2348,7 +2349,6 @@ en:
|
|||
|
||||
create_account:
|
||||
header_title: "Welcome!"
|
||||
subheader_title: "Let's create your account"
|
||||
disclaimer: "By registering, you agree to the <a href='%{privacy_link}' target='blank'>privacy policy</a> and <a href='%{tos_link}' target='blank'>terms of service</a>."
|
||||
title: "Sign Up"
|
||||
failed: "Something went wrong, perhaps this email is already registered, try the forgot password link"
|
||||
|
|
@ -2396,7 +2396,6 @@ en:
|
|||
|
||||
login:
|
||||
header_title: "Welcome back"
|
||||
subheader_title: "Log in to your account"
|
||||
title: "Log In"
|
||||
username: "User"
|
||||
password: "Password"
|
||||
|
|
@ -2498,7 +2497,6 @@ en:
|
|||
success: "Your account has been created and you're now logged in."
|
||||
name_label: "Name"
|
||||
password_label: "Password"
|
||||
existing_user_can_redeem: "Redeem your invitation to a topic or group."
|
||||
|
||||
password_reset:
|
||||
continue: "Continue to %{site_name}"
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user