self-hosted/focalboard
1
0
Fork 0
mirror of https://github.com/mattermost/focalboard.git synced 2024-12-24 13:43:12 +02:00
Code Issues Releases Activity

Some improvements in the login page

Browse Source
This commit is contained in:
Jesús Espino 2020-10-15 20:43:51 +02:00
parent a43ea02616
commit c905673317
2 changed files with 49 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
src/client/pages/loginPage.scss Normal file
View File

@ -0,0 +1,27 @@
.LoginPage {
border: 1px solid #cccccc;
border-radius: 15px;
width: 450px;
height: 400px;
margin: auto;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
.username, .password {
margin-bottom: 5px;
label {
display: inline-block;
width: 140px;
}
input {
display: inline-block;
width: 250px;
border: 1px solid #cccccc;
border-radius: 4px;
}
}
.Button {
margin-top: 10px;
}
}

33
src/client/pages/loginPage.tsx
View File

@ -1,5 +1,9 @@
import React from "react"
import Button from '../components/button'
import './loginPage.scss'
type Props = {}
type State = {
@ -20,17 +24,24 @@ export default class LoginPage extends React.Component<Props, State> {
public render(): React.ReactNode {
return (
<div className='LoginPage'>
<label htmlFor='login-username'>Username</label>
<input
id='login-username'
value={this.state.username}
onChange={(e) => this.setState({username: e.target.value})}
/>
<label htmlFor='login-username'>Password</label>
<input
id='login-password'
/>
<button onClick={this.handleLogin}>Login</button>
<div className='username'>
<label htmlFor='login-username'>Username</label>
<input
id='login-username'
value={this.state.username}
onChange={(e) => this.setState({username: e.target.value})}
/>
</div>
<div className='password'>
<label htmlFor='login-username'>Password</label>
<input
id='login-password'
type='password'
value={this.state.password}
onChange={(e) => this.setState({password: e.target.value})}
/>
</div>
<Button onClick={this.handleLogin}>Login</Button>
</div>
)
}