scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 00:21:20 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

birthdate month and year layout

Browse source
This commit is contained in:
Ben Wheeler 2019-07-17 11:47:32 -04:00
parent 39fd6b07ea
commit 71baf3e802
3 changed files with 30 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
src/components/formik-forms/formik-select.jsx
View file

@ -24,10 +24,9 @@ const FormikSelect = ({
</option>
));
return (
<div className="col-sm-9 row">
<div className="select">
<Field
className={classNames(
'select',
className
)}
component="select"

22
src/components/join-flow/join-flow-steps.jsx
View file

@ -273,12 +273,19 @@ class BirthDateStep extends React.Component {
waiting={isSubmitting}
onSubmit={handleSubmit}
>
<div>
<div className="join-flow-input-title">
{this.props.intl.formatMessage({id: 'general.birthMonth'})}
</div>
<div
className={classNames(
'col-sm-9',
'row',
'birthdate-select-row'
)}
>
<FormikSelect
className={errors.birth_month ? 'fail' : ''}
className={classNames(
'join-flow-select',
'join-flow-select-month',
{fail: errors.birth_month}
)}
error={errors.birth_month}
id="birth_month"
name="birth_month"
@ -287,7 +294,10 @@ class BirthDateStep extends React.Component {
validationClassName="validation-full-width-input"
/>
<FormikSelect
className={errors.birth_year ? 'fail' : ''}
className={classNames(
'join-flow-select',
{fail: errors.birth_year}
)}
error={errors.birth_year}
id="birth_year"
name="birth_year"

13
src/components/join-flow/join-flow-steps.scss
View file

@ -22,6 +22,19 @@
transform: translate(21.5625rem, 0);
}
select.join-flow-select {
width: 9.125rem;
}
.join-flow-select-month {
margin-right: .5rem;
}
.join-flow-password-section {
margin-top: 1.125rem;
}
.birthdate-select-row {
display: flex;
margin: 0 auto;
}