Graphical PDS migrator for AT Protocol
1import Ticket from "../islands/Ticket.tsx";
2import AirportSign from "../components/AirportSign.tsx";
3import SocialLinks from "../islands/SocialLinks.tsx";
4import LoginButton from "../islands/LoginButton.tsx";
5
6export default function Home() {
7 return (
8 <>
9 <div class="px-2 sm:px-4 py-4 sm:py-8 mx-auto">
10 <div class="max-w-screen-lg mx-auto flex flex-col items-center justify-center">
11 <AirportSign />
12
13 <div class="prose dark:prose-invert max-w-none w-full mb-0">
14 <p class="font-mono text-lg sm:text-xl font-bold mb-4 sm:mb-6 mt-0 text-center text-gray-600 dark:text-gray-300">
15 Your terminal for seamless AT Protocol PDS migration and backup.
16 </p>
17
18 <Ticket />
19
20 <LoginButton />
21 <p class="font-mono text-lg sm:text-xl mb-4 mt-4 sm:mb-6 text-center text-gray-600 dark:text-gray-300">
22 Airport is made with love by{" "}
23 <a
24 class="text-blue-500 hover:underline"
25 href="https://bsky.app/profile/knotbin.com"
26 >
27 Roscoe
28 </a>{" "}
29 for{" "}
30 <a class="text-blue-500 hover:underline" href="https://sprk.so">
31 Spark
32 </a>, a new short-video platform for AT Protocol.
33 </p>
34 <div class="text-center mb-4">
35 <a
36 href="/about"
37 class="inline-flex items-center text-blue-500 hover:text-blue-600 transition-colors"
38 >
39 <img
40 src="/icons/info_bold.svg"
41 alt="Info"
42 class="w-5 h-5 mr-2"
43 />
44 <span class="font-mono">Learn more about AT Protocol</span>
45 </a>
46 </div>
47 <SocialLinks />
48 </div>
49 </div>
50 </div>
51 </>
52 );
53}