Repository navigation
fix: pretty-print + visible palette + single-file data browser - #9
Merged
Merged
Conversation
Two visual fixes to the minimal data browser shipped in 0.0.11:
1. JSON-LD is now pretty-printed with 2-space indent before being
handed to the URI-linking regex. The previous version just dumped
the raw single-line JSON; white-space:pre-wrap made it wrap but
the result was a wall of text with no visible structure. The PR
description that introduced this file used the word "pretty-print"
but the code that landed didn't actually parse+stringify.
2. CSS palette tuned so the styling is actually visible:
- Body background #fafaf8 -> #f3eee5 (warm cream that's clearly
distinguishable from white at normal monitor calibration; the
old value was 5 RGB units off from #fff so the card vanished)
- Card border-radius 8 -> 12px, padding 1 -> 1.5em, shadow opacity
6% -> 8% with a softer larger blur for a visible lift
- Link color #0366d6 -> #0a66c2 (more saturated, reads better
against the cream)
The CSS rules in 0.0.11 were applying correctly — verified by
inspecting computed styles. The bug was that I picked colors too
close to each other for the difference to be perceivable, not that
the rules weren't taking effect.
Bumps jspod to 0.0.12.
Refs #1
CSS now lives inside data-browser.js as a <style> tag injected on load. data-browser.css becomes an intentionally-empty stub so JSS's auto-fetch of the .css sibling (mashlib/index.js:307) still 200s — no console warning, no two-file version-skew risk, one file owns the experience. A future JSS PR can drop the sibling fetch and the stub goes away entirely. Refs #1
29 tasks
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.
Summary
Three small edits to the data browser shipped in 0.0.11. Bumps to 0.0.12.
white-space:pre-wrapmade it wrap into a wall of text with no visible structure.#fafaf8→#f3eee5(warm cream that's clearly off-white), card border-radius 8 → 12, padding 1 → 1.5em, shadow opacity 6% → 8% with a softer larger blur, link color#0366d6→#0a66c2. The CSS rules in 0.0.11 were applying correctly (verified via computed-style readout) — the bug was that I picked colors too close to each other to be perceivable.data-browser.jsas a<style>injected on first run.data-browser.cssbecomes an intentionally-empty stub so JSS's auto-fetch of the.csssibling URL (mashlib/index.js:307) still returns 200 — no console warning, no two-file version-skew risk, one file owns the experience. A future JSS PR can drop the sibling fetch entirely and the stub goes away.Test plan
<a>.npx jspod@0.0.12from a clean dir, navigate to a Solid resource, confirm the new look.Why this is bigger than I said
The original spike target was ~200 bytes for the renderer. With the CSS-in-JS collapse + pretty-print + minimal styling, the runtime is ~800 bytes. Bigger than promised. It's still well under any reasonable threshold for a "data browser," and it removes a whole file from the contract, but it's worth flagging that the budget creep happened: pretty-print (+~30 bytes), inline
<style>boilerplate (+~50 bytes), CSS itself (~400 bytes), comments (~250 bytes).What's next
Open a JSS PR to make the
.csssibling fetch optional when--mashlib-moduleis set. That unlocks deleting the stub.cssand positioning this implementation as a baseline JSS mashlib.Refs #1