g1t/apps/web/app/components/trust-page.tsx
Pick any line to see why it is the way it is: the commit, the pull request and issue it came from, and what the agent was thinking.
| Invite-only launch: sign in with GitHub, repository access and lifecycle, many emails, a new look | 1 | import type { ReactNode } from "react"; |
| 2 | ||
| 3 | /** | |
| 4 | * The frame of a trust page (policies, security, support, status): an | |
| 5 | * eyebrow, a title, a lede, and the page. Apart from the policies' | |
| 6 | * Markdown renderer (legal-doc.tsx), so pages without a policy on them do | |
| 7 | * not load it. | |
| 8 | */ | |
| 9 | export function TrustPage({ | |
| 10 | eyebrow, | |
| 11 | title, | |
| 12 | lede, | |
| 13 | aside, | |
| 14 | children, | |
| 15 | }: { | |
| 16 | eyebrow: ReactNode; | |
| 17 | title: string; | |
| 18 | lede?: ReactNode; | |
| 19 | aside?: ReactNode; | |
| 20 | children: ReactNode; | |
| 21 | }) { | |
| 22 | return ( | |
| 23 | <main className="mx-auto max-w-5xl px-4 py-12 sm:py-16"> | |
| 24 | <p className="text-sm font-medium text-accent">{eyebrow}</p> | |
| 25 | <h1 className="mt-2 text-3xl font-semibold tracking-tight text-balance sm:text-4xl">{title}</h1> | |
| 26 | {lede && <div className="mt-3 max-w-2xl text-muted">{lede}</div>} | |
| 27 | <div className={aside ? "mt-10 grid gap-10 lg:grid-cols-[minmax(0,1fr)_14rem]" : "mt-10"}> | |
| 28 | <div className="min-w-0">{children}</div> | |
| 29 | {/* On a phone the page is read top to bottom; its contents would only push it down. */} | |
| 30 | {aside && <aside className="hidden lg:block">{aside}</aside>} | |
| 31 | </div> | |
| 32 | </main> | |
| 33 | ); | |
| 34 | } |