use a few more pf-core components

This commit is contained in:
Jake McDermott
2018-09-26 21:39:04 -04:00
parent d926378cf5
commit b2ebbc6a0a
2 changed files with 26 additions and 24 deletions

2
dist/index.html vendored
View File

@@ -1,7 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<title>AWX</title> <title>AWX</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

View File

@@ -1,7 +1,11 @@
import React, { Component } from 'react'; import React, { Component } from 'react';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import { Button } from '@patternfly/react-core'; import {
Bullseye,
Button,
TextInput
} from '@patternfly/react-core';
import api from '../api'; import api from '../api';
@@ -12,7 +16,9 @@ class Login extends Component {
redirect: false, redirect: false,
}; };
handleChange = event => this.setState({ [event.target.name]: event.target.value }); handleUsernameChange = value => this.setState({ username: value });
handlePasswordChange = value => this.setState({ password: value });
handleSubmit = event => { handleSubmit = event => {
const { username, password } = this.state; const { username, password } = this.state;
@@ -31,35 +37,31 @@ class Login extends Component {
} }
return ( return (
<form onSubmit={this.handleSubmit}> <Bullseye>
<div className="field"> <form onSubmit={this.handleSubmit}>
<label htmlFor="username"> <div>
Username <TextInput
<input aria-label="Username"
id="username"
name="username" name="username"
type="text" type="text"
onChange={this.handleChange} onChange={this.handleUsernameChange}
value={username} value={username}
/> />
</label> </div>
</div> <div>
<div> <TextInput
<label htmlFor="password"> aria-label="Password"
Password
<input
id="password"
name="password" name="password"
type="password" type="password"
onChange={this.handleChange} onChange={this.handlePasswordChange}
value={password} value={password}
/> />
</label> </div>
</div> <Button type="submit">
<Button type="submit"> Login
Login </Button>
</Button> </form>
</form> </Bullseye>
); );
} }
} }