forked from
joebasser.com/atmosphere-account
this repo has no description
1import { useT } from "../i18n/mod.ts";
2import SvgIconDownloads from "../islands/SvgIconDownloads.tsx";
3
4const PROFILE_SCHEMA_URL =
5 "https://tangled.org/joebasser.com/atmosphere-account/blob/main/lexicons/com/atmosphereaccount/registry/profile.json";
6
7export default function DeveloperResources() {
8 const t = useT();
9 return (
10 <>
11 <section class="section-sm">
12 <div class="container-narrow text-center">
13 <h1 class="text-section">{t.developerResources.heading}</h1>
14 <div class="divider" />
15 <p class="text-body mt-2 mb-4">{t.developerResources.intro}</p>
16 <div class="badge-display">
17 <img
18 src="/sign-in-box.svg"
19 alt={t.developerResources.badgeAlt}
20 />
21 </div>
22 <div class="badge-downloads">
23 <a
24 href="/sign-in-box.svg"
25 download="atmosphere-sign-in-badge.svg"
26 class="badge-download-btn font-mono"
27 >
28 {t.developerResources.downloadBadge}
29 </a>
30 <a
31 href="/union.svg"
32 download="atmosphere-logo.svg"
33 class="badge-download-btn font-mono"
34 >
35 {t.developerResources.downloadLogo}
36 </a>
37 </div>
38 <p class="text-body-sm mt-3">{t.developerResources.badgeFootnote}</p>
39 </div>
40 </section>
41
42 <section class="section-sm" id="project-icons">
43 <div class="container-narrow text-center">
44 <h2 class="text-subsection">{t.developerResources.lottieHeading}</h2>
45 <div class="divider" />
46 <p class="text-body mt-2 mb-3">{t.developerResources.lottieIntro}</p>
47 <div class="badge-downloads">
48 <a
49 href="/atmosphere.json"
50 download="atmosphere-hero.lottie.json"
51 class="badge-download-btn font-mono"
52 >
53 {t.developerResources.downloadLottie}
54 </a>
55 <a
56 href="/lottie-icons.zip"
57 download="atmosphere-lottie-icons.zip"
58 class="badge-download-btn font-mono"
59 >
60 {t.developerResources.downloadIcons}
61 </a>
62 </div>
63 </div>
64 </section>
65
66 <section class="section-sm">
67 <div class="container-narrow text-center">
68 <h2 class="text-subsection">{t.developerResources.icons.heading}</h2>
69 <div class="divider" />
70 <p class="text-body mt-2 mb-3">
71 {t.developerResources.icons.intro}
72 </p>
73 <SvgIconDownloads />
74 </div>
75 </section>
76
77 <section class="section-sm">
78 <div class="container-narrow text-center">
79 <h2 class="text-subsection">{t.developerResources.schemaHeading}</h2>
80 <div class="divider" />
81 <p class="text-body mt-2 mb-3">{t.developerResources.schemaBody}</p>
82 <div class="badge-downloads">
83 <a
84 href={PROFILE_SCHEMA_URL}
85 target="_blank"
86 rel="noopener noreferrer"
87 class="badge-download-btn font-mono"
88 >
89 {t.developerResources.viewSchema}
90 </a>
91 </div>
92 </div>
93 </section>
94 </>
95 );
96}