* docs: add Control Center Draft Mode guide
Add a how-to page for the new Draft Mode in Control Center: build a
change on a working copy of the canvas, review the exact API requests,
and deploy everything as one batch. A single running example (giving
DevOps HTTPS access to a not-yet-installed staging server) carries
through entering a draft, the canvas toolbar, node interactions,
placeholder-peer installs, and Review & Deploy.
Along the way:
- Nest Control Center in the sidebar (Overview + Draft Mode) and update
the overview page: Users view in the intro and quick start, an Edit
Nodes section covering live edits vs Draft Mode, permissions notes
including the Network Admin setup-key limitation, and a HashRedirect
for the renamed #editing-policies-from-the-graph anchor.
- Add a shared <Video> component for screen recordings: lazy playback
via IntersectionObserver, visible controls, preload="metadata", and
no autoplay under prefers-reduced-motion.
- Optimize media: re-encode recordings (H.264 CRF 26, 30 fps,
faststart, audio stripped) and losslessly recompress screenshots,
cutting the page's media payload from 6.3 MB to 1.2 MB.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* fix: image zoom overlay flickering on close
The closing fade-out ran without animation-fill-mode: forwards, so when
the 200ms animation finished the overlay snapped back to full opacity
until React's unmount timeout fired, flashing for a frame or two.
Holding the animation end state covers that gap.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: tighten Draft Mode intro
Give the running example its own paragraph and drop the header-chrome
description; the video right below it shows the same thing.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: add Focus Mode section and group-from-selection video
Document Focus Mode on the Control Center overview (right-click a node
and choose Focus, or select it and press F) with two screenshots, and
move the F shortcut prose there from the Draft Mode page. Add a
recording of creating a group from a multi-peer selection to the
Draft Mode page. New media compressed like the rest.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: correct Focus Mode shortcut order
F is pressed first, then the node is selected.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: drop setup-key caveat from Draft Mode permissions note
The Network Admin limitation is already covered where it bites, in the
placeholder install section.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: drop Agent Network disambiguation from Add Nodes
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: reorder Assign Peers to Groups videos
Show the drag-to-group recording right after the text it illustrates,
then the group-from-selection flow.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: remove change-type badge list from review section
The review rows do not carry Add/Modify/Delete/Install badges.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* docs: trim group-membership parenthetical from review example
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
* fix: react to prefers-reduced-motion changes in Video
The reduced-motion check ran once on mount, so toggling the OS setting
while the page was open either kept videos auto-playing or left them
permanently inert. Listen for MediaQueryList changes: pause and drop
the observer when reduced motion turns on, re-observe when it turns
off.
Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
---------
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>