Scratch space for learning atproto app development
cduck.me
1import { env } from '#/env'
2import { html } from '../lib/view'
3import { shell } from './shell'
4
5type Props = { error?: string }
6
7export function login(props: Props) {
8 return shell({
9 title: 'Log in',
10 content: content(props),
11 })
12}
13
14function content({ error }: Props) {
15 return html`<div id="root">
16 <div id="header">
17 <h1>Statusphere</h1>
18 <p>Set your status on the Atmosphere.</p>
19 </div>
20 <div class="container">
21 <form action="/login" method="post" class="login-form">
22 <input
23 type="text"
24 name="input"
25 placeholder="Enter your handle (eg alice.bsky.social)"
26 required
27 />
28 <button type="submit">Log in</button>
29 </form>
30
31 <a href="/signup" class="button signup-cta">
32 Login or Sign up with a ${env.PDS_OWNER} account
33 </a>
34
35 ${error ? html`<p>Error: <i>${error}</i></p>` : undefined}
36 </div>
37 </div>`
38}