Skip to content

fix(docs): theme the docs UI and split the install guide into steps - #422

Open
simonvanlierde wants to merge 13 commits into
mainfrom
fix/docs-ui-review
Open

simonvanlierde wants to merge 13 commits into
mainfrom
fix/docs-ui-review

Conversation

@simonvanlierde

Copy link
Copy Markdown
Contributor

The docs site now uses the brand tokens throughout, including the API reference, and the long install page is now five short pages in the order you set up a host. Please merge this before the app PR: the backend fix below regenerates the app's API types.

  • The API reference listed every auth operation twice, because the auth tag was set at more than one router level and FastAPI keeps the repeats. Each tag is now set once, and the bearer and session variants of refresh and logout have their own summaries. The OpenAPI files and app/src/types/api.generated.ts are regenerated.
  • Scalar picks up the brand fonts and colours and opens in the reader's Starlight theme. The switcher bar stays on one row on phones.
  • Diagrams scale to fit the column, with a "View full size" link under each, and the system design diagram is now two: deployment topology and request flow.
  • The install guide is now Prerequisites, Install, Configure, Deploy, and Upgrade and backup. Links in the READMEs and deploy runbooks point at the new pages.
  • Smaller fixes: overview pages in the sidebar, a flat danger aside, a themed dark menu button, 9R headings that name the tiers, and a line in the accessibility statement on the API viewer's two known barriers.

- Size small text with Starlight's --sl-text-sm/xs/2xs steps and document
  them in DESIGN.md as the small, label and caption roles
- NineRLadder tier names become figure labels in role="group" wrappers, so
  the page outline no longer jumps from the H1 to an h3; rungs use the
  divider token directly
- Active sidebar link and the mermaid frame mix from the brand tokens in
  both themes instead of hand-picked rgb values
- Mermaid background and edge-label tones copy the page ground and frame
- Diagram break-out stays inside the content padding instead of sliding
  under the sidebar and TOC column
- Prev/next cards drop their drop shadow (inline surfaces stay flat)
- Header wordmark keeps its alt text in dark mode, so the home link has a
  name on phones where the "Docs" cue is hidden
- API reference switcher is one scrolling row on phones, and its radius
  comes from the token file
- Drop the "Open app" shrink rule that only ever hit the menu footer
Scalar's font, background, text and accent variables now point at the
brand tokens, secondary text and light-mode method colours clear 4.5:1,
small toggles meet the 24px target size, and the page opens in the
reader's stored theme.
Also give the guide entries for the API and the camera distinct labels
from their architecture pages.
- Mermaid diagrams now scale down to the frame width instead of
  scrolling sideways at their natural size
- A "View full size" link under each diagram opens the rendered SVG
  unscaled in a new tab
- Drop the width pinning, resize observer and focusable scroll frame
  that only served the scrolling layout
- Danger asides draw a red hairline and red text on the page ground
  instead of a filled red panel
- The dark-theme menu button uses the surface token with a hairline,
  not a white disc with a drop shadow
- Prerequisites, Install, Configure, Deploy, and Upgrade and backup
  replace the single install page, in that sidebar order
- Cross-references between numbered steps now link to the page that
  holds the step
- The one-time backup-init and timer-installer warnings move out of
  shell comments into caution asides
- Links from the READMEs, runbooks, contributing guide, and docs
  pages point at the new pages
- The ladder drops its visible tier labels; each tier's list carries
  the name as its accessible label instead
- The page intro reads "most circular to last resort", matching the
  figure's end labels
- Set the auth and rpi-cam-device tags once per router tree. FastAPI
  appends tags from every include level without deduplicating, so the
  login, refresh, logout, register and MFA operations carried "auth"
  two or three times and the reference listed each of them repeatedly
- Give the bearer and session refresh and logout routes summaries that
  name their transport, matching the login pair
- Title the API with an en dash and spell out the Institute of
  Environmental Sciences (CML), Leiden University
- Regenerate the docs and app OpenAPI schemas and the app API types
- read the previous full-size blob URL off the link instead of a separate map
- remove the grid and gap on ladder tiers, which now hold a single list
- stop describing NineRLadder tier labels in DESIGN.md: the figure no longer shows them
- name the Configure page's section for what it does and point the upgrade section at Deploy
- link the OpenTofu plan and apply procedure to step 1 of Configure
- split the accessibility statement's API reference bullet into short sentences
- rewrap lines the split left over 100 columns
@codecov

codecov Bot commented Oct 11, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ All tests successful. No failed tests found.

📢 Thoughts on this report? Let us know!

This branch has not been deployed

No deployments
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant