Fix sign up modal

This commit is contained in:
Toby Zerner
2015-07-23 14:30:55 +09:30
parent b699bbadbc
commit 497b65289e
4 changed files with 39 additions and 34 deletions

View File

@ -38,7 +38,7 @@ export default class ChangeEmailModal extends Modal {
return ( return (
<div className="Modal-body"> <div className="Modal-body">
<div class="Form Form--centered"> <div class="Form Form--centered">
<p class="helpText">{m.trust(app.trans('core.confirmation_email_sent', {email: this.email()}))}</p> <p class="helpText">{m.trust(app.trans('core.confirmation_email_sent', {email: <strong>{this.email()}</strong>}))}</p>
<div class="Form-group"> <div class="Form-group">
<a href={'http://' + emailProviderName} className="Button Button--primary Button--block"> <a href={'http://' + emailProviderName} className="Button Button--primary Button--block">
{app.trans('core.go_to', {location: emailProviderName})} {app.trans('core.go_to', {location: emailProviderName})}

View File

@ -69,7 +69,7 @@ export default class SignUpModal extends Modal {
<div className="Form-group"> <div className="Form-group">
<input className="FormControl" name="username" placeholder={app.trans('core.username')} <input className="FormControl" name="username" placeholder={app.trans('core.username')}
value={this.username()} value={this.username()}
onchange={m.withAttr('value', this.email)} onchange={m.withAttr('value', this.username)}
disabled={this.loading} /> disabled={this.loading} />
</div> </div>
@ -108,13 +108,13 @@ export default class SignUpModal extends Modal {
body.push( body.push(
<div className="SignUpModal-welcome" style={{background: user.color()}} config={fadeIn}> <div className="SignUpModal-welcome" style={{background: user.color()}} config={fadeIn}>
<div className="darkenBackground"/> <div className="darkenBackground">
<div className="container"> <div className="container">
{avatar(user)} {avatar(user)}
<h3>{app.trans('core.welcome_user', {user})}</h3> <h3>{app.trans('core.welcome_user', {user})}</h3>
{user.isConfirmed() ? [ {!user.isConfirmed() ? [
<p>{app.trans('core.confirmation_email_sent', {email: user.email()})}</p>, <p>{app.trans('core.confirmation_email_sent', {email: <strong>{user.email()}</strong>})}</p>,
<p> <p>
<a href={`http://${emailProviderName}`} className="Button Button--primary"> <a href={`http://${emailProviderName}`} className="Button Button--primary">
{app.trans('core.go_to', {location: emailProviderName})} {app.trans('core.go_to', {location: emailProviderName})}
@ -129,6 +129,7 @@ export default class SignUpModal extends Modal {
)} )}
</div> </div>
</div> </div>
</div>
); );
} }

View File

@ -1,44 +1,48 @@
.signup-welcome { .SignUpModal-welcome {
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
bottom: 0; bottom: 0;
border-radius: @border-radius; border-radius: @border-radius;
padding: 50px 30px;
text-align: center; text-align: center;
color: #fff; color: #fff;
font-size: 14px; font-size: 14px;
.light-contents(); .light-contents();
& .avatar { .Avatar {
.Avatar--size(96px); .Avatar--size(96px);
border: 4px solid @body-bg; border: 4px solid @body-bg;
.box-shadow(0 2px 6px @shadow-color); .box-shadow(0 2px 6px @shadow-color);
} }
& h3, & p { h3, p {
margin-bottom: 25px; margin-bottom: 25px;
} }
& .btn-default { .Button {
font-size: 15px; font-size: 15px;
height: 50px; height: 50px;
padding: 15px 20px; padding: 15px 20px;
} }
& .container { .darkenBackground {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
}
.container {
width: auto !important; width: auto !important;
padding: 0 !important; padding: 50px 30px !important;
position: relative; position: relative;
} }
} }
.signup-modal-success { .SignUpModal--success .Modal-close .Button {
& .close {
color: #fff; color: #fff;
} }
}
@media @phone { @media @phone {
.signup-welcome { .SignUpModal-welcome .container {
padding-top: 56px + 60px; padding-top: 56px + 60px;
} }
} }

View File

@ -17,7 +17,7 @@ core:
confirm_discard_discussion: You have not posted your discussion. Do you wish to discard it? confirm_discard_discussion: You have not posted your discussion. Do you wish to discard it?
confirm_discard_edit: You have not saved your changes. Do you wish to discard them? confirm_discard_edit: You have not saved your changes. Do you wish to discard them?
confirm_discard_reply: You have not posted your reply. Do you wish to discard it? confirm_discard_reply: You have not posted your reply. Do you wish to discard it?
confirmation_email_sent: "We've sent a confirmation email to <strong>{email}</strong>. If it doesn't arrive soon, check your spam folder." confirmation_email_sent: "We've sent a confirmation email to {email}. If it doesn't arrive soon, check your spam folder."
controls: Controls controls: Controls
delete: Delete delete: Delete
delete_account: Delete Account delete_account: Delete Account
@ -35,7 +35,7 @@ core:
edit: Edit edit: Edit
editing_post: "Post #{number} in {discussion}" editing_post: "Post #{number} in {discussion}"
email: Email email: Email
email_confirmation_required: "You need to confirm your email before you can log in. We've sent a confirmation email to <strong>{email}</strong>. If it doesn't arrive soon, check your spam folder." email_confirmation_required: "You need to confirm your email before you can log in. We've sent a confirmation email to {email}. If it doesn't arrive soon, check your spam folder."
exit_full_screen: Exit Full Screen exit_full_screen: Exit Full Screen
forgot_password: Forgot Password forgot_password: Forgot Password
forgot_password_help: Enter your email address and we will send you a link to reset your password. forgot_password_help: Enter your email address and we will send you a link to reset your password.