|
|
|
|
@ -26,23 +26,29 @@ export function Login() {
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className="login-wrap">
|
|
|
|
|
<div className="login-card">
|
|
|
|
|
<h2 style={{ marginTop: 0 }}>SiMS HQ</h2>
|
|
|
|
|
<Field label="Email">
|
|
|
|
|
<input
|
|
|
|
|
className="wf" type="email" value={email} autoFocus
|
|
|
|
|
onChange={(e) => setEmail(e.target.value)}
|
|
|
|
|
/>
|
|
|
|
|
</Field>
|
|
|
|
|
<Field label="Password">
|
|
|
|
|
<input
|
|
|
|
|
className="wf" type="password" value={pw}
|
|
|
|
|
onChange={(e) => setPw(e.target.value)}
|
|
|
|
|
onKeyDown={(e) => e.key === 'Enter' && void submit()}
|
|
|
|
|
/>
|
|
|
|
|
</Field>
|
|
|
|
|
<Button tone="primary" onClick={() => void submit()}>{busy ? 'Signing in…' : 'Sign in'}</Button>
|
|
|
|
|
{error !== undefined && <Notice tone="err">{error}</Notice>}
|
|
|
|
|
<div className="login-brand">
|
|
|
|
|
<h1>SiMS HQ</h1>
|
|
|
|
|
<p>The ops console — clients, documents, payments, AMC and reminders in one place.</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="login-form">
|
|
|
|
|
<div className="login-card">
|
|
|
|
|
<h2 style={{ marginTop: 0 }}>Sign in</h2>
|
|
|
|
|
<Field label="Email">
|
|
|
|
|
<input
|
|
|
|
|
className="wf" type="email" value={email} autoFocus
|
|
|
|
|
onChange={(e) => setEmail(e.target.value)}
|
|
|
|
|
/>
|
|
|
|
|
</Field>
|
|
|
|
|
<Field label="Password">
|
|
|
|
|
<input
|
|
|
|
|
className="wf" type="password" value={pw}
|
|
|
|
|
onChange={(e) => setPw(e.target.value)}
|
|
|
|
|
onKeyDown={(e) => e.key === 'Enter' && void submit()}
|
|
|
|
|
/>
|
|
|
|
|
</Field>
|
|
|
|
|
<Button tone="primary" onClick={() => void submit()}>{busy ? 'Signing in…' : 'Sign in'}</Button>
|
|
|
|
|
{error !== undefined && <Notice tone="err">{error}</Notice>}
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
)
|
|
|
|
|
|