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