feat(visimer): dedicated /playground page with shareable code URLs (#2868) - #7
Merged
Conversation
…2868) * feat(visimer): dedicated /playground page with shareable code URLs Expanding the inline demo now navigates to a real /playground route instead of a fullscreen overlay, so a refresh keeps your work and there is no Exit mode to escape. The current source rides along in the URL hash (base64url), and every edit updates the hash debounced, which makes the address bar a share link at all times; a Share button copies it. Pasting a new share link into an open tab adopts the incoming code via hashchange. On the dedicated page the diagram-type tabs become a Samples menu that resets the source to the chosen sample. The hero CTA links straight to /playground, vercel.json gains SPA fallback rewrites for the route, and the shared playground chrome (presets, themes, CodeMirror pane, codec) moves to playground-shared.tsx used by both pages. The View Transitions overlay machinery is removed. * refactor(visimer): playground menu drops active state, generic file label The playground's code is user-owned, so a highlighted sample in the menu and a type-derived file name both drift from reality the moment someone edits. Menu items render uniformly, the label is a static diagram.mmd, and the Reset button is gone since loading a sample is the reset. * fix(visimer): equalize pane header heights so the divider aligns The source pane header (with its Copy button) rendered taller than the preview header, breaking the border line where the panes meet. Both headers are pinned to 44px on the inline demo and /playground. * feat(visimer): replace mermaid theme picker with light and dark palettes The Paper/Neutral/Forest/Dark theme pills are gone; the light/dark toggle now drives one tuned mermaid palette per mode. Light keeps the site's paper tones (cream surfaces, teal primaries, gold accents). Dark follows Open Knowledge's mermaid treatment, transposed into the site's warm dark tones: node fills with no visible outline, muted connector strokes instead of mermaid's harsh near-white lines, clusters as darker tiers, gold note callouts. * fix(visimer): keep class compartment dividers visible in dark mode nodeBorder was set to the node fill for the borderless flowchart look, but class diagrams draw their compartment dividers with that same stroke, so the title/attribute/method separators vanished. A faint visible border restores them while staying imperceptible on flowchart nodes. GitOrigin-RevId: 3ae8ee41e661e7c5cbda1fc63c717254d33850f2
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
1 participant
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.
Copybara-translated 1 Inkeep OSS change. Rebase-merge this PR so the prepared commit lands directly on public main.