From 9a7830c62d25d83754bd58d0e705501f71656c69 Mon Sep 17 00:00:00 2001
From: Gabriel Schneider <gbrls@0x4200.cafe>
Date: Thu, 1 Oct 2026 12:28:20 -0300
Subject: The landing shows the four recordings, pardes is ISC-licensed, and
 the install lines fit a phone

clips.toml names the recordings (text-is-the-interface,
terminals-are-panes, scripting-over-9p, diff-review), each ready, its
caption checked against what the clip shows. The first ready clip
plays at the top, full width and on its own (autoplay, muted, looping),
and the grid below shows the others, three across. Videos and posters keep the recordings' 960x700 shape. The footer
links the source at git.0x4200.cafe/pardes and names the ISC license,
from `project` in style.typ. LICENSE holds the ISC text, and the README
names it and says the libraries keep their own (MuPDF, on by default, is
AGPL). The install lines put their comments on lines of their own, and
on a phone a shell line wraps rather than scroll its end away.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
---
 docs/site/site.typ | 27 +++++++++++++++------------
 1 file changed, 15 insertions(+), 12 deletions(-)

(limited to 'docs/site/site.typ')

diff --git a/docs/site/site.typ b/docs/site/site.typ
index 03d9a15d..068b5b9c 100644
--- a/docs/site/site.typ
+++ b/docs/site/site.typ
@@ -70,7 +70,7 @@
       #el("footer", (class: "colophon"))[
         pardes ·
         #if project.source != none [#el("a", (href: project.source))[source] · ]
-        #if project.license != none [#project.license · ]
+        #if project.license != none [#project.license license · ]
         built from `docs/typ` with Typst ·
         #el("a", (href: "fonts/LICENSE-DepartureMono.txt"))[fonts] (OFL)
       ]
@@ -94,7 +94,13 @@
 
 #doc-links.update(true)
 
-#let ready = clips.filter(c => c.ready)
+// The first ready clip plays at the top; the grid shows the rest.
+#let hero = clips.find(c => c.ready)
+#let video(c, extra) = el("video", (poster: "media/" + c.name + ".png", muted: "", loop: "", playsinline: "",
+    controls: "") + extra)[
+  #el("source", (src: "media/" + c.name + ".webm", type: "video/webm"))[]
+  #el("source", (src: "media/" + c.name + ".mp4", type: "video/mp4"))[]
+]
 #let start = (
   (id: "guide", label: [Start: the guide], note: [about 15 min]),
   (id: "tutor", label: [Hands on: the tutor], note: none),
@@ -108,8 +114,11 @@
   #el("p", (class: "pitch"))[#tagline.]
   #el("p", (class: "runs"))[It runs in a terminal or in its own window (SDL), on Linux;
     macOS and browser builds are in the tree.]
-  #if ready.len() > 0 {
-    el("img", (class: "hero", src: "media/" + ready.first().name + ".png", alt: ready.first().caption))[]
+  #if hero != none {
+    el("figure", (class: "clip hero"))[
+      #video(hero, (autoplay: ""))
+      #el("figcaption")[#hero.caption]
+    ]
   }
   #el("div", (class: "start"))[
     #for s in start {
@@ -122,15 +131,9 @@
     }
   ]
   #el("div", (class: "clips"))[
-    #for c in clips {
+    #for c in clips.filter(c => c != hero) {
       el("figure", (class: "clip"))[
-        #if c.ready {
-          el("video", (poster: "media/" + c.name + ".png", muted: "", loop: "", playsinline: "",
-            controls: "", preload: "none"))[
-            #el("source", (src: "media/" + c.name + ".webm", type: "video/webm"))[]
-            #el("source", (src: "media/" + c.name + ".mp4", type: "video/mp4"))[]
-          ]
-        } else {
+        #if c.ready { video(c, (preload: "none")) } else {
           el("img", (src: "media/placeholder.svg", alt: "", width: "640", height: "400"))[]
         }
         #el("figcaption")[#c.caption]
-- 
cgit v1.3