anton.galiglobal.com
Firefox WebExtension (Desktop and Mobile) that lets you share the current tab to Margit.at, frontpage.fyi, etc. with minimal effort.
1<!doctype html>
2<html lang="en">
3 <head>
4 <meta charset="utf-8" />
5 <title>ATProto Social Options</title>
6 <link rel="stylesheet" href="styles.css" />
7 </head>
8 <body>
9 <main class="options">
10 <h1>ATProto Social</h1>
11 <section>
12 <h2>Account</h2>
13 <p class="help">
14 Sign in with your Frontpage / ATProto handle and an app password. You can manage app
15 passwords in the
16 <a href="https://bsky.app/settings/app-passwords" target="_blank" rel="noreferrer">Bluesky settings</a>
17 or on your self-hosted PDS.
18 </p>
19 <form id="login-form">
20 <label for="handle">Handle</label>
21 <input id="handle" name="handle" type="text" placeholder="you.example.com" required />
22
23 <label for="password">App password</label>
24 <input id="password" name="password" type="password" autocomplete="current-password" required />
25
26 <label for="pds">PDS URL (optional override)</label>
27 <input
28 id="pds"
29 name="pds"
30 type="url"
31 placeholder="https://pds.example.com"
32 autocomplete="url"
33 />
34
35 <button type="submit" id="login-btn">Save credentials</button>
36 </form>
37 <button type="button" id="logout-btn" class="secondary">Log out</button>
38 <p id="auth-status" role="status" aria-live="polite"></p>
39 </section>
40
41 <section>
42 <h2>How it works</h2>
43 <ul class="tips">
44 <li>The add-on stores your tokens locally using Firefox storage.</li>
45 <li>Links are published as <code>fyi.frontpage.feed.post</code> records on your ATProto account.</li>
46 <li>Your PDS is discovered from your handle automatically unless you provide a custom URL.</li>
47 </ul>
48 </section>
49 </main>
50 <script type="module" src="options.js"></script>
51 </body>
52</html>