scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2024-11-27 01:25:52 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 4

Move other input to be the label for the button

Browse source 
thanks @rschamp! Never would’ve thought label would accept html.
This commit is contained in:
Matthew Taylor 2016-12-05 14:05:27 -05:00
parent cc0496619d
commit afa25dc1c2
2 changed files with 25 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/components/registration/steps.jsx
View file

@ -360,24 +360,24 @@ module.exports = {
options={[
{value: 'female', label: formatMessage({id: 'general.female'})},
{value: 'male', label: formatMessage({id: 'general.male'})},
{value: 'other', label: ''}
{value: 'other', label: <Input
className="demographics-step-input-other"
name="user.genderOther"
type="text"
validations={{
maxLength: 25
}}
validationErrors={{
maxLength: formatMessage({
id: 'registration.validationMaxLength'
})
}}
disabled={this.state.otherDisabled}
required={!this.state.otherDisabled}
help={null}
/>}
]}
required />
<div className="gender-input">
<Input name="user.genderOther"
type="text"
validations={{
maxLength: 25
}}
validationErrors={{
maxLength: formatMessage({
id: 'registration.validationMaxLength'
})
}}
disabled={this.state.otherDisabled}
required={!this.state.otherDisabled}
help={null} />
</div>
<Select label={formatMessage({id: 'general.country'})}
name="user.country"
options={getCountryOptions(this.props.intl, DEFAULT_COUNTRY)}

17
src/components/registration/steps.scss
View file

@ -13,7 +13,6 @@
border-radius: 8px;
}
.gender-input,
.other-input {
float: right;
width: 90%;
@ -61,19 +60,21 @@
}
&.demographics-step {
.gender-input {
margin-top: -5.5rem;
}
.radio {
width: 50%;
line-height: 3rem;
white-space: nowrap;
margin: 1.5rem 1.5rem 0 0;
input {
margin-right: 1rem;
}
}
.demographics-step-input-other {
display: inline-block;
.col-sm-9 {
display: inline-block;
}
}
}
&.phone-step {