67 lines
2.6 KiB
JavaScript
67 lines
2.6 KiB
JavaScript
import React, { Component } from 'react';
|
|
import { Button, Card, CardBody, CardFooter, Col, Container, Input, InputGroup, InputGroupAddon, InputGroupText, Row } from 'reactstrap';
|
|
|
|
class Register extends Component {
|
|
render() {
|
|
return (
|
|
<div className="app flex-row align-items-center">
|
|
<Container>
|
|
<Row className="justify-content-center">
|
|
<Col md="6">
|
|
<Card className="mx-4">
|
|
<CardBody className="p-4">
|
|
<h1>Register</h1>
|
|
<p className="text-muted">Create your account</p>
|
|
<InputGroup className="mb-3">
|
|
<InputGroupAddon addonType="prepend">
|
|
<InputGroupText>
|
|
<i className="icon-user"></i>
|
|
</InputGroupText>
|
|
</InputGroupAddon>
|
|
<Input type="text" placeholder="Username" />
|
|
</InputGroup>
|
|
<InputGroup className="mb-3">
|
|
<InputGroupAddon addonType="prepend">
|
|
<InputGroupText>@</InputGroupText>
|
|
</InputGroupAddon>
|
|
<Input type="text" placeholder="Email" />
|
|
</InputGroup>
|
|
<InputGroup className="mb-3">
|
|
<InputGroupAddon addonType="prepend">
|
|
<InputGroupText>
|
|
<i className="icon-lock"></i>
|
|
</InputGroupText>
|
|
</InputGroupAddon>
|
|
<Input type="password" placeholder="Password" />
|
|
</InputGroup>
|
|
<InputGroup className="mb-4">
|
|
<InputGroupAddon addonType="prepend">
|
|
<InputGroupText>
|
|
<i className="icon-lock"></i>
|
|
</InputGroupText>
|
|
</InputGroupAddon>
|
|
<Input type="password" placeholder="Repeat password" />
|
|
</InputGroup>
|
|
<Button color="success" block>Create Account</Button>
|
|
</CardBody>
|
|
<CardFooter className="p-4">
|
|
<Row>
|
|
<Col xs="12" sm="6">
|
|
<Button className="btn-facebook" block><span>facebook</span></Button>
|
|
</Col>
|
|
<Col xs="12" sm="6">
|
|
<Button className="btn-twitter" block><span>twitter</span></Button>
|
|
</Col>
|
|
</Row>
|
|
</CardFooter>
|
|
</Card>
|
|
</Col>
|
|
</Row>
|
|
</Container>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Register;
|