Skip to content

docs(README): add hero video — theme-aware cover linking to the 90-second overview - #11941

Merged
os-zhuang merged 2 commits into
mainfrom
claude/issue-11534-readme-hero-video
Aug 25, 2026
Merged

docs(README): add hero video — theme-aware cover linking to the 90-second overview#11941
os-zhuang merged 2 commits into
mainfrom
claude/issue-11534-readme-hero-video

Conversation

@os-zhuang

@os-zhuangos-zhuang commented Aug 25, 2026

Copy link
Copy Markdown
Contributor

Fixes#11534

Summary

Adds a hero cover to the README, immediately after the chips line
(README.md:22), linking to the official 90-second overview on YouTube
(https://youtu.be/CX_FlOoOtr0).

Revised from the original two-cover plan after maintainer review found
both covers rendering stacked on github.com. Current shape:

  • One cover image, dark onlydocs/screenshots/hero-cover-dark.png,
    no #gh- fragment on its src. GitHub's rendered HTML (see Verification)
    emits <img> tags with #gh-dark-mode-only / #gh-light-mode-only
    fragments intact but applies no theme CSS to hide either one — so a
    themed pair always showed both, on every renderer, not just mobile.
    hero-cover-light.png is removed (git rm); confirmed via git grep
    that nothing else in the repo referenced it.
  • A caption link below the image
    ▶ Watch: ObjectStack in 90 Seconds — because nothing in a bare <img>
    signals "this is a clickable video" to a reader scrolling past on mobile
    web, desktop, npm's README render, or a plain-text reader; none of those
    surfaces draw a play-button overlay for you.

Assets

docs/screenshots/hero-cover-dark.png was copied from the private
steedos-labs/video-studio repo,
projects/2026-08-objectstack-hero-overview/covers/cover-en-dark.png, and
renamed under docs/screenshots/. Verified byte-for-byte against the
source repo's contents API and by PNG magic-byte inspection before
committing:

filebytesmagic
docs/screenshots/hero-cover-dark.png406,703valid PNG, 2400×1200, 8-bit RGB

hero-cover-light.png (400,524 bytes, same provenance) was added in the
original round and is no longer shipped — removed in this revision as
dead weight once the block stopped referencing it.

Diff shape

README.md diff vs origin/main is a pure 8-line insertion at the
verified anchor (line 22, the chips line) — no pre-existing line touched,
no deletions. docs/screenshots/hero-cover-dark.png is the sole new file
(the light cover, added and then removed within this PR's history, is not
part of the final tree).

Verification

Done:

  • docs/screenshots/hero-cover-dark.png present with the byte count above,
    valid PNG magic bytes.
  • README diff vs origin/main is a pure insertion — git diff origin/main -- README.md shows 8 insertions(+), 0 deletions(-).
  • git grep -n "hero-cover" returns exactly one hit, in README.md,
    pointing at the dark cover with no #gh- fragment.
  • Re-rendered via GitHub's own HTML (Accept: application/vnd.github.html on the readme endpoint, ref= this branch)
    after pushing — exactly one hero-cover<img> in the output, src
    carries no #gh- fragment:
    <palign="center" dir="auto"><ahref="https://youtu.be/CX_FlOoOtr0" rel="nofollow"><imgsrc="docs/screenshots/hero-cover-dark.png" width="900" alt="ObjectStack in 90 Seconds — watch the overview on YouTube" style="max-width: 100%;"></a><br><ahref="https://youtu.be/CX_FlOoOtr0" rel="nofollow"><b>▶ Watch: ObjectStack in 90 Seconds</b></a></p>
  • Link and <img>/caption markup are well-formed HTML inside the
    <p align="center"> block.
  • grep -naP '[\x00-\x08\x0b\x0c\x0e-\x1f\x7f]' README.md — clean, no raw
    control bytes introduced (the caption glyph is U+25B6, not a control
    character).

Not done, and not claimed: how the single cover looks to a themed human
viewer (GitHub's rendered visual chrome) — only the structural HTML above
was checked. Left for maintainer eyeball on the rendered PR page.

Gates run

Declared narrowing — verification ran UNLOCKED.scripts/pm/os-verify-lock.sh
could not take the shared verify lock on this host: no usable flock. The shared
verify lock is declared Linux-only (flock is util-linux, and a stock macOS does
not ship it), so the commands below were run directly, without the lock —
a declared narrowing, not a silent one. No serialization guarantee held for
these runs, nor for any sibling agent in this container while they ran.

Gate family re-derived via node scripts/pm/dispatch-gates.mjs against the
actual changed paths (README.md, docs/screenshots/hero-cover-dark.png,
docs/screenshots/hero-cover-light.png) at commit 618c58a56 — same three
as the original round:

gateverdict
pnpm check:nul-bytes✅ PASS — "OK (scanned 6650 text file(s) ... no raw ASCII control bytes)"
pnpm check:doc-authoring✅ PASS — "389 files clean — no bare metadata literals"
pnpm check:doc-anchors⚠️ NOT MEASURED — exits with "PREREQUISITE NOT MET: github-slugger is not installed" (no node_modules in this docs-only worktree). The gate's own output: "Nothing was measured... NOT a finding." CI will run this on the real farm.
pnpm --filter @objectstack/lint run check:doc-formula-expressions⚠️ NOT MEASURED — same cause, missing typescript in node_modules. Same caveat as above.

No changeset added (docs-only card; content/docs/releases/ untouched).


Generated by Claude Code

…cond overview
Insert a theme-aware cover (dark/light via #gh-dark-mode-only /
#gh-light-mode-only) immediately after the chips line, linking to the
official 90-second overview on YouTube (https://youtu.be/CX_FlOoOtr0).
Covers copied from the private steedos-labs/video-studio repo at
projects/2026-08-objectstack-hero-overview/covers/cover-en-{dark,light}.png,
renamed to hero-cover-{dark,light}.png. Docs-only; no changeset.
@os-zhuangos-zhuang added the skip-changeset PR has no user-facing published change; bypasses the changeset gate label Aug 25, 2026
@github-actionsgithub-actionsBot added size/xs documentation Improvements or additions to documentation labels Aug 25, 2026
…cover
Maintainer viewed the rendered README on github.com and saw both covers
stacked — GitHub's own rendered HTML (Accept: application/vnd.github.html)
emits both <img> tags with the #gh-dark-mode-only / #gh-light-mode-only
fragments intact and applies no theme CSS, so both render unconditionally.
- Keep the dark cover only; drop the #gh-fragment from its src (a single
image left fragmented would hide it from any renderer that DOES honour
the mechanism).
- Add a caption link below the image ("▶ Watch: ObjectStack in 90 Seconds")
so mobile web, desktop, npm's README render, and plain-text readers all
get a signal that the image is a clickable video, not a decorative
banner — none of those surfaces render a play button over a plain <img>.
- git rm docs/screenshots/hero-cover-light.png: no longer referenced
anywhere in the repo (verified via git grep before removal).
README.md diff vs main is still a pure insertion — no pre-existing line
touched.
@os-zhuang
os-zhuang marked this pull request as ready for review August 25, 2026 02:42
@os-zhuang
os-zhuang enabled auto-merge August 25, 2026 02:42
@os-zhuang
os-zhuang added this pull request to the merge queueAug 25, 2026
Merged via the queue into main with commit 0cbe79aAug 25, 2026
27 checks passed
@os-zhuang
os-zhuang deleted the claude/issue-11534-readme-hero-video branch August 25, 2026 03:01
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentationImprovements or additions to documentationsize/xsskip-changesetPR has no user-facing published change; bypasses the changeset gate

Projects

None yet

Development

Successfully merging this pull request may close these issues.

docs(README): add hero video — theme-aware cover linking to the 90-second overview on YouTube

1 participant

@os-zhuang