john/deighton-ar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Clean all sizes, fonts and colors into style.js

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

24
website/src/Users/UserForm.js
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>
)

6
website/src/Users/UserList.js
View File

@@ -37,18 +37,18 @@ export class UserList extends React.Component {
? this.state.users.map((user, index) =>
(<List.Item key={user._id || '0'} onClick={(e) => (this.props.onUserListClick(e, index))}
active={user === this.props.selectedUser}>
<List.Icon name={user.administrator ? 'admin' : 'profile'} size={25} />
<List.Icon name={user.administrator ? 'admin' : 'profile'} size={sizeInfo.listIcon} />
<List.Text>
{ user._id ? user.firstName + ' ' + user.lastName : '[New User]' }
</List.Text>
{ user === selectedUser && selectionModified ? <List.Icon name='edit' size={25} /> : null }
{ user === selectedUser && selectionModified ? <List.Icon name='edit' size={sizeInfo.listIcon} /> : null }
</List.Item>)
)
: null
}
</List>
</Column.Item>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item height={sizeInfo.buttonHeight}>
<Button width='100%' color='inverse' onClick={this.props.onAddNewUser} text='Add New User' />
</Column.Item>

10
website/src/Users/Users.js
View File

@@ -253,16 +253,16 @@ export class Users extends Component {
return (
<Fragment>
<Column.Item height={20} />
<Column.Item height={sizeInfo.formColumnSpacing} />
<Column.Item grow>
<Row fillParent>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item width='25vw'>
<UserList users={this.state.users} selectedUser={this.state.selectedUser}
selectionModified={this.state.modified} onUserListClick={this.handleUserListClick}
onAddNewUser={this.handleAddNewUser} />
</Row.Item>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
<Row.Item grow>
<Box border={{ width: sizeInfo.headerBorderWidth, color: colorInfo.headerBorder }} radius={sizeInfo.formBoxRadius}>
{
@@ -274,10 +274,10 @@ export class Users extends Component {
}
</Box>
</Row.Item>
<Row.Item width={20} />
<Row.Item width={sizeInfo.formRowSpacing} />
</Row>
</Column.Item>
<Column.Item height={20}>
<Column.Item height={sizeInfo.formColumnSpacing}>
<ChangeEmailModal open={!!changeEmailModal}
oldEmail={changeEmailModal && changeEmailModal.oldEmail}
onDismiss={this.handleChangeEmailDismiss} />