-
- {value.title}
-{value.body}
-
+ {/* Desktop: the aligned three-column table. */}
+
+
);
}
diff --git a/website/src/components/footer.tsx b/website/src/components/footer.tsx
index 53eb820c..1fbef1a6 100644
--- a/website/src/components/footer.tsx
+++ b/website/src/components/footer.tsx
@@ -1,9 +1,10 @@
import { site } from "../data/site";
-import { GitHubLogo, Logo } from "./ui/icon";
+import { DiscordLogo, GitHubLogo, Logo } from "./ui/icon";
import { MetaStrip } from "./ui/meta-strip";
export function Footer() {
const repoPath = site.repo.replace("https://", "");
+ const hasDiscord = site.community.discord !== "#";
return (
-
-
);
diff --git a/website/src/components/gallery.tsx b/website/src/components/gallery.tsx
new file mode 100644
index 00000000..215871ab
--- /dev/null
+++ b/website/src/components/gallery.tsx
@@ -0,0 +1,99 @@
+import { Play } from "lucide-react";
+import { useState } from "react";
+import Lightbox, { type Slide } from "yet-another-react-lightbox";
+import Captions from "yet-another-react-lightbox/plugins/captions";
+import Video from "yet-another-react-lightbox/plugins/video";
+import Zoom from "yet-another-react-lightbox/plugins/zoom";
+import "yet-another-react-lightbox/styles.css";
+import "yet-another-react-lightbox/plugins/captions.css";
+import { galleryItems, type GalleryItem } from "../data/gallery";
+import { Reveal } from "./ui/reveal";
+import { Section } from "./ui/section";
+
+// Everything in `public/` is served under the Vite base path.
+const asset = (name: string) => `${import.meta.env.BASE_URL}${name}`;
+
+// The grid thumbnail: an explicit thumb, else a video's poster, else the image.
+const tileImage = (item: GalleryItem) =>
+ asset(item.thumb ?? (item.type === "video" ? (item.poster ?? item.src) : item.src));
+
+// One gallery item → one lightbox slide. Images carry title/description for the
+// Captions plugin; videos use the Video plugin's `sources` shape.
+function toSlide(item: GalleryItem): Slide {
+ if (item.type === "video") {
+ return {
+ type: "video",
+ poster: item.poster ? asset(item.poster) : undefined,
+ width: item.width,
+ height: item.height,
+ title: item.title,
+ description: item.caption,
+ sources: [{ src: asset(item.src), type: "video/mp4" }],
+ };
+ }
+ return {
+ src: asset(item.src),
+ title: item.title,
+ description: item.caption,
+ width: item.width,
+ height: item.height,
+ };
+}
+
+export function Gallery() {
+ const [index, setIndex] = useState(-1);
+ const slides = galleryItems.map(toSlide);
+
+ return (
+
{/* The "winner column" — one continuous panel behind Tinycast. */}
+ {/* Mobile: one card per row, so nothing scrolls sideways. */}
+
-
+ {compareRows.map((row) => (
+
+
{/* The one external claim, cited so it holds up. */}
+
+ ))}
+
+ {row.label}
+ {row.sourced && (
+ †
+ )}
+
+
+
+
+
+
+
+
+
+
† Stack and memory figures
diff --git a/website/src/components/ethos.tsx b/website/src/components/ethos.tsx
index cec7684a..1826ce55 100644
--- a/website/src/components/ethos.tsx
+++ b/website/src/components/ethos.tsx
@@ -10,7 +10,7 @@ export function Ethos() {
id="why"
eyebrow="Why it's tiny"
title="Built like a Mac app should be."
- intro="SwiftUI and AppKit, zero dependencies, no Electron runtime hiding underneath. It's fast because there's barely anything to it."
+ intro="Native SwiftUI and AppKit. No Electron, no bloat — fast because there's barely anything to it."
>
{/* Stat strip — the one place numbers get loud. */}
- {values.map((value, i) => (
-
-
-
-
-
- ))}
-
+ -
+ {values.map((value) => (
+
-
+
+ {value} +
+ ))}
+
+ {galleryItems.map((item, i) => (
+
+
+
+ ))}
+
+
+
- Your shortcut to
-
everything on your Mac.
+ {hero.headline}
- {site.name} is a tiny, fully native launcher — fuzzy app search, a - calculator, clipboard history, and global hotkeys. A few megabytes on - disk, and it brings your Raycast setup along. No Electron, no account, - no telemetry. + {hero.sub}
-