feat: Site chrome: section nav, interim logo, branch chip, AI trigger, minimal docs - #269
Draft
Yona-Appletree wants to merge 13 commits into
Draft
feat: Site chrome: section nav, interim logo, branch chip, AI trigger, minimal docs#269Yona-Appletree wants to merge 13 commits into
Yona-Appletree wants to merge 13 commits into
Conversation
…es, branch chip, AI trigger Explores the top bar as real site navigation (Studio / Boards / Docs in-app, one shared chrome), with the brand lockup inert — home is the Studio nav item, the logo is reserved for a future landing page. Sections: logo marks (play-in-circuit A-E + inverted play-contains F-H knockouts), bar concepts (0=today baseline, tabs, pills, breadcrumb, mark-menu), one-chrome-across-sections minis (incl. the interactive-docs vision with a live clock node), version/branch chip states, AI-settings trigger variants. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
… bot AI pill Gate feedback applied: E's WS2812 pixel moves inside the play triangle (I = package+lens, J = +corner pads); bar concept A (section tabs) is the keeper with a 390px narrow demo; the AI trigger becomes the labeled pill with the bot icon. Losing marks and structures shrink to rejected strips with reasons. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…hout label E ships as the interim mark until the human-designed logo (in progress) lands; I/J join the rejected strip. The AI trigger drops its label — bot icon in the violet chip is enough at every width. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…logo, tools menu Studio/Boards/Docs nav tabs replace the wordmark-as-home-link; the brand lockup (new LogoMark, the interim WS2812-pixel mark) is inert by design — home is the Studio tab, which inherits ShellLogo's detach-dispatch behavior. Mapping/board editors move to an overflow menu. Plan: 2026-08-01-2219-top-bar-site-chrome (P1) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
One chip replaces the 'dev build' text + separate info button; the chip itself opens the build-info popover. build.rs bakes branch/sha/dirty in (best-effort, never fails the build); a fetched version.json still wins, so deploys keep showing the version tag. Long branch names ellipsize from the left; dirty trees get the warning family and a ± marker. Plan: 2026-08-01-2219-top-bar-site-chrome (P2) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The gear promised app-wide settings but only held agent config. New StudioIconName::AgentSettings (Bot) in the status-bound violet family; label/title 'AI settings'. The gear stays in the registry, reserved for a future real studio-settings surface. Plan: 2026-08-01-2219-top-bar-site-chrome (P3) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Captured in the pinned CI environment by run: https://github.com/light-player/lightplayer/actions/runs/30739033652
Contributor
CI refreshed the story baselines on this branchThe Review every PNG in the PR's Files changed view (swipe / onion-skin). 25 more file(s)
|
StudioRoute::Docs + a standalone docs page (compiled-in manifest, sidebar + article). MarkdownText grows a docs mode: heading levels now survive parsing and MarkdownDocs renders them as real h1-h3 styles — same parser and untrusted-input hardening, chat rendering unchanged. In-section article switches ride a hashchange listener (no reload); leaving the section hard-reloads like every standalone page. Plan: 2026-08-01-2219-top-bar-site-chrome (P4) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
The chrome wraps both standalone early-returns at the web_app route boundary (lpa-boards stays chrome-free and platform-blind). Standalone chrome installs a leave-section hashchange reload — those pages have no studio route listener — via addEventListener so the docs page's own in-section listener coexists; installs are route-guarded so story-book mounts never capture the book's navigation. Boards drops its top padding (rhythm now comes from the chrome). ADR: docs/adr/2026-08-02-site-chrome-in-app-sections.md Plan: 2026-08-01-2219-top-bar-site-chrome (P5) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
Captured in the pinned CI environment by run: https://github.com/light-player/lightplayer/actions/runs/30740364052
site_chrome_stories cover the three sections, a 390px narrow frame, and the logo mark sizes; a pure VersionChipPreview makes the four chip states capturable (the live chip's state is fetch/compile-time-driven). The interim mark ships as favicon.svg (index.html link + deploy entry). user-guide README now points authors at the in-app #/docs render target. Plan: 2026-08-01-2219-top-bar-site-chrome (P6) Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
# Conflicts: # lp-app/lpa-studio-web/story-images/studio__board-diagram__catalog-page-macos__lg.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__catalog-page-macos__md.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__catalog-page-macos__sm.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__detail-page-dom-z-102__lg.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__detail-page-dom-z-102__md.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__detail-page-dom-z-102__sm.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-exact-fit__lg.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-exact-fit__md.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-exact-fit__sm.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-headroom-and-gaps__lg.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-headroom-and-gaps__md.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-headroom-and-gaps__sm.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-no-build__lg.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-no-build__md.png # lp-app/lpa-studio-web/story-images/studio__board-diagram__firmware-detail-no-build__sm.png
Captured in the pinned CI environment by run: https://github.com/light-player/lightplayer/actions/runs/30742845977
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
















Plan: lp2025/2026-08-01-2219-top-bar-site-chrome
Path: ~/.photomancer/planning/lp2025/2026-08-01-2219-top-bar-site-chrome/plan.md
Production implementation of the converged top-bar UX spike (the spike itself is the first three commits —
spikes/top-bar/index.html, the design record).One shared chrome across the app: Studio / Boards / Docs section tabs, inert brand lockup (interim WS2812-pixel LogoMark; home = the Studio tab), version chip showing the git branch on dev builds, violet Bot AI-settings trigger, tools overflow menu, and a minimal in-app docs page over
docs/user-guide/.Status: P1 (SiteChrome) ✅ · P2 (version chip + build.rs) ✅ · P3 (AI trigger) ✅ · P4 docs page ⏳ · P5 standalone pages under chrome · P6 stories/favicon/cleanup → FINAL visual gate
Resume notes: read plan.md + phase files;
_DONE.mddoesn't exist yet. PR stays draft until the final visual gate passes.🤖 Generated with Claude Code