fix welcome vertical spacing, make it flexible

This commit is contained in:
Ben Wheeler 2019-09-16 21:49:06 -04:00
parent 303481b61d
commit 8f45c12b89
2 changed files with 12 additions and 8 deletions

View file

@ -132,20 +132,14 @@
} }
.join-flow-inner-welcome-step { .join-flow-inner-welcome-step {
padding-top: 3rem; padding-top: 0;
padding-bottom: 1rem;
} }
.join-flow-birthdate-title { .join-flow-birthdate-title {
margin-bottom: 2.875rem; margin-bottom: 2.875rem;
} }
.join-flow-birthdate-description {
margin-top: 1.25rem;
margin-right: -.5rem;
margin-bottom: 2rem;
margin-left: -.5rem;
}
.join-flow-email-title { .join-flow-email-title {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
@ -172,6 +166,14 @@
margin-bottom: 1.75rem; margin-bottom: 1.75rem;
} }
.join-flow-welcome-title {
margin-bottom: .25rem;
}
.join-flow-welcome-description {
margin-bottom: 1.25rem;
}
.gender-radio-row { .gender-radio-row {
transition: all .125s ease; transition: all .125s ease;
width: 20.875rem; width: 20.875rem;

View file

@ -42,6 +42,7 @@ class WelcomeStep extends React.Component {
description={this.props.intl.formatMessage({ description={this.props.intl.formatMessage({
id: 'registration.welcomeStepDescriptionNonEducator' id: 'registration.welcomeStepDescriptionNonEducator'
})} })}
descriptionClassName="join-flow-welcome-description"
headerImgSrc="/images/join-flow/welcome-header.png" headerImgSrc="/images/join-flow/welcome-header.png"
innerClassName="join-flow-inner-welcome-step" innerClassName="join-flow-inner-welcome-step"
nextButton={ nextButton={
@ -57,6 +58,7 @@ class WelcomeStep extends React.Component {
{id: 'registration.welcomeStepTitleNonEducator'}, {id: 'registration.welcomeStepTitleNonEducator'},
{username: this.props.username} {username: this.props.username}
)}`} )}`}
titleClassName="join-flow-welcome-title"
waiting={isSubmitting} waiting={isSubmitting}
onSubmit={handleSubmit} onSubmit={handleSubmit}
> >