78 lines
2.7 KiB
JavaScript
Executable File
78 lines
2.7 KiB
JavaScript
Executable File
// eslint-disable-next-line
|
|
const preact = require('preact');
|
|
|
|
function renderLogin({ account, submitLogin, submitRegister }) {
|
|
if (account) return (
|
|
<div>
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" className="ping-svg">
|
|
<path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
|
|
<path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
|
|
</svg>
|
|
<h3 className="header-username">{account.name}</h3>
|
|
</div>
|
|
);
|
|
|
|
const details = {
|
|
name: '',
|
|
password: '',
|
|
};
|
|
|
|
return (
|
|
<div className="login" >
|
|
<div className="field">
|
|
<p className="control has-icons-left has-icons-right">
|
|
<input
|
|
className="input"
|
|
type="email"
|
|
placeholder="Email"
|
|
onChange={e => (details.name = e.target.value)}
|
|
/>
|
|
<span className="icon is-small is-left">
|
|
<i className="fas fa-user" />
|
|
</span>
|
|
<span className="icon is-small is-right">
|
|
<i className="fas fa-check" />
|
|
</span>
|
|
</p>
|
|
</div>
|
|
<div className="field">
|
|
<p className="control has-icons-left">
|
|
<input
|
|
className="input"
|
|
type="password"
|
|
placeholder="Password"
|
|
onChange={e => (details.password = e.target.value)}
|
|
/>
|
|
<span className="icon is-small is-left">
|
|
<i className="fas fa-lock" />
|
|
</span>
|
|
</p>
|
|
</div>
|
|
<div className="field">
|
|
<p className="control">
|
|
<button
|
|
className="button inverted"
|
|
type="submit"
|
|
onClick={() => submitLogin('ntr', 'grepgrepgrep')}>
|
|
Default
|
|
</button>
|
|
<button
|
|
className="button inverted"
|
|
type="submit"
|
|
onClick={() => submitLogin(details.name, details.password)}>
|
|
Login
|
|
</button>
|
|
<button
|
|
className="button inverted"
|
|
type="submit"
|
|
onClick={() => submitRegister(details.name, details.password)}>
|
|
Register
|
|
</button>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
module.exports = renderLogin;
|