Clean all sizes, fonts and colors into style.js

This commit is contained in:
John Lyon-Smith
2018-03-07 11:01:55 -08:00
parent c06669873f
commit 9adca547f7
48 changed files with 152 additions and 3179 deletions

View File

@@ -113,9 +113,9 @@ export class UserForm extends React.Component {
return (
<form style={{ width: '100%', height: '100%', overflow: 'scroll' }} id='userForm' onSubmit={this.handleSubmit}>
<Column>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Row>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item grow>
<Column.Item>
<Column>
@@ -124,7 +124,7 @@ export class UserForm extends React.Component {
<Row.Item grow>
<BoundInput label='First Name' name='firstName' message='Must not be empty' binder={binder} />
</Row.Item>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item grow>
<BoundInput label='Last Name' name='lastName' binder={binder} />
</Row.Item>
@@ -135,27 +135,27 @@ export class UserForm extends React.Component {
<Row.Item grow>
<BoundInput label='Email' name='email' message='Must be a valid email address. Required.' binder={binder} />
</Row.Item>
<Row.Item width={10} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item>
<BoundEmailIcon name='emailValidated' binder={binder} />
</Row.Item>
</Row>
</Column.Item>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item minHeight={sizeInfo.buttonHeight}>
<Row>
<Row.Item>
<BoundButton text='Change Email' name='changeEmail' binder={binder}
width={220} onClick={this.handleChangeEmail} />
width={sizeInfo.formButtonLarge} onClick={this.handleChangeEmail} />
</Row.Item>
<Row.Item grow />
<Row.Item>
<BoundButton text='Resend Confirmation Email' name='resendEmail' binder={binder}
width={220} onClick={this.handleResendEmail} />
width={sizeInfo.formButtonLarge} onClick={this.handleResendEmail} />
</Row.Item>
</Row>
</Column.Item>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item>
<Row>
<Row.Item>
@@ -164,7 +164,7 @@ export class UserForm extends React.Component {
<Row.Item grow />
</Row>
</Column.Item>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item minHeight={sizeInfo.buttonHeight}>
<Row>
<Row.Item>
@@ -174,7 +174,7 @@ export class UserForm extends React.Component {
<Row.Item>
<BoundButton text='Remove' name='remove' binder={binder} onClick={this.props.onRemove} />
</Row.Item>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item>
<BoundButton submit='userForm' text={binder._id ? 'Save' : 'Add'} name='submit' binder={binder} />
</Row.Item>
@@ -183,9 +183,9 @@ export class UserForm extends React.Component {
</Column>
</Column.Item>
</Row.Item>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
</Row>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
</Column>
</form>
)