63 lines
1.3 KiB
JavaScript
63 lines
1.3 KiB
JavaScript
import React from 'react';
|
|
|
|
import { Form, FormGroup, FormControl, ControlLabel, HelpBlock, Button, Panel } from 'rsuite';
|
|
|
|
import NavBar from './../components/Navbar/NavBar';
|
|
import TimezonePicker from '../components/General/TimezonePicker';
|
|
|
|
// TODO Move to a .less file
|
|
const boxStyle = {
|
|
maxWidth: 373,
|
|
margin: '0 auto',
|
|
borderRadius: 7,
|
|
background: 'white',
|
|
marginTop: '10vh',
|
|
marginBottom: '10vh',
|
|
padding: '1rem',
|
|
};
|
|
|
|
export default function Register({ title }) {
|
|
return (
|
|
<>
|
|
<NavBar title={title} />
|
|
<Panel bordered style={boxStyle}>
|
|
<Form>
|
|
<FormGroup>
|
|
<ControlLabel>Username</ControlLabel>
|
|
<FormControl
|
|
name='username'
|
|
type='text'
|
|
/>
|
|
</FormGroup>
|
|
<FormGroup>
|
|
<ControlLabel>Email</ControlLabel>
|
|
<FormControl
|
|
name='email'
|
|
type='email'
|
|
/>
|
|
</FormGroup>
|
|
<ControlLabel>Timezone</ControlLabel>
|
|
<FormGroup>
|
|
<TimezonePicker />
|
|
</FormGroup>
|
|
<ControlLabel>Password</ControlLabel>
|
|
<FormGroup>
|
|
<FormControl
|
|
name='password'
|
|
type='password'
|
|
/>
|
|
<HelpBlock>
|
|
Minimum password length is 8 characters
|
|
</HelpBlock>
|
|
</FormGroup>
|
|
<FormGroup>
|
|
<Button appearance='primary' block size="lg">
|
|
Register
|
|
</Button>
|
|
</FormGroup>
|
|
</Form>
|
|
</Panel>
|
|
</>
|
|
);
|
|
}
|