Repository navigation
#177 — design integration PR-1: chassis CSS (tokens, 5 themes, 4 style packs, density) - #187
Conversation
…SS (#177) Land Claude Design Phase-1's chassis CSS — the semantic token layer, the five AA-pinned [data-theme] blocks (Light/Dark/Tokyo/Solarized/Gruvbox), the four html[data-style] direction packs, the density layer and the tokenized component rules — replacing the template's custom <style> block body. <html> gains data-style="soft" data-difflayout="auto". Pure visual; zero payload/JS change. Placement: templates/report.css (first-party, beside the template it styles) embedded via include_str! as asset_embed::REPORT_CSS and interpolated {{ report_css|safe }}. Deliberately OUTSIDE assets/ — the provenance gate walks every file under assets/ and would demand an upstream pin this authored file doesn't have. Banner-pin test (head banner + end-of-file sentinel) fails CI on a truncated copy; a comment-balance test pins the handoff's documented porting bug (a star followed by slash inside a comment body once ate the [hidden] rule). The merged file carries the handoff's per-theme AA contrast table as the "AA pins — do not re-brighten" comment block; no token color altered. Two reconciliations with shipped behavior the handoff forked before: the cute-dbt#157 minmax(0,1fr) stacked-track fix (a 375px headless regression test pins it) and the cute-dbt#165/#166 column-tooltip trigger contract (the handoff's body-appended .col-tooltip bubble waits for the engine DOM in PR-2/PR-3). A clearly-marked PR-1 bridge layer keeps the pre-engine diff-line DOM block-laid (whitespace: pre) and the copy-button clearance until cute-dbt#178 lands the engine. Regenerated the 3 golden examples + 2 insta snapshots; the deltas are the html attr line + the style-block body only (zero payload changes). All 29 headless toggle tests + zero-egress + 787 nextest + 86 BDD scenarios green. Closes #177 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
There was a problem hiding this comment.
Code Review
This pull request integrates the first-party report chassis CSS (report.css) into the template rendering pipeline. It extracts the previously inline report-specific styles into a separate stylesheet, templates/report.css, which is embedded at compile-time via include_str! and injected into the HTML template. The new stylesheet introduces a semantic token layer, multiple themes (Light, Dark, Tokyo, Solarized, Gruvbox), visual style packs (paper, terminal, swiss, soft), and layout layers. Additionally, unit tests are added to verify the integrity of the embedded CSS (checking for truncation and balanced comments). Since there are no review comments, no feedback is provided.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
📄 Rendered report previewAll golden examples regenerated cleanly. 🟡 Golden examplesCommitted to
🐶 Live dogfood previewThis PR doesn't touch ▶ Open ↗ opens the report in your browser in one click — The Pages preview may take ~1 min to update after this comment Alternative: GitHub CLI# gh CLI >= 2.63 extracts into ./report-preview-playground/.
gh run download 27288668706 -R breezy-bays-labs/cute-dbt -n report-preview-playground
open report-preview-playground/playground-report.htmlPosted by |
|
Warning Review limit reached
More reviews will be available in 16 minutes and 15 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: ⛔ Files ignored due to path filters (2)
📒 Files selected for processing (7)
✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
Ready to review this PR? Stage has broken it down into 6 individual chapters for you: Chapters generated by Stage for commit 4a618dc on Jun 10, 2026 3:58pm UTC. |
…ecklist + tiered findings + suppressed-count The render lane of the coverage-intelligence epic (#168): the per-model Coverage checks panel rendering the #186/#191 engine verdicts in-context. - Payload (render.rs): FindingPayload wraps the domain Finding (flattened, wire keys unchanged) with render-resolved pin_node (DAG anchor: bracketed constructs pin the named CTE node, model-level constructs the terminal) and sketches (the union check's 'suggested given' evidence lifted into copyable blocks). ReportPayload gains check_specs — the offline spec catalog (name/tier/instrument/conditions/exclusions/rationale + the click-only book_href), keyed by fired check only, serde-skipped when empty so findings-free payloads stay byte-stable. - Surface (report.html/interaction.js/report.css): a self-contained .model-findings section per model — three-valued checklist (mark + word, never colour-only), labeled tier chips (TOTAL solid / HIGH outlined / advisory muted — never blended, no percentages), covered-by attribution, evidence rows, evidence pinning (select + smooth-scroll + flash), the recommendation with #188-pattern copyable YAML sketches, the inline 'What is this check?' rationale drawer (fully offline; the book link is a plain click-only anchor), and the visible-but-quiet suppressed reveal (collapsed count -> rows with reason + source). Token-native on the #187 chassis; tier-chip tooltips use the #146/#188 bubble contract. - Dogfood: playground fixture gains unique_key on mart_dq_summary (grain UNCOVERED), an inline ignore pragma on dim_payers (suppressed-with-reason), and the synthetic-body-mod idiom on fct_clinical_events (union UNCOVERED with three given-row sketches) — all three goldens now show the panel, jaffle-shop deliberately renders the quiet empty state. - Tests: 7 render.rs payload units, 2 BDD scenarios (check_specs catalog facts), 2 headless guards (panel/checklist/tier distinctness/tooltip/ sketch+copy/rationale/book-link/pin/both-toggle-views/empty-state; suppressed collapsed-count + reason reveal); insta snapshots + goldens regenerated intended-only. Closes #170 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
…+ tiered findings + suppressed-count (#194) * feat(adapters): #170 — report findings surface: per-model coverage checklist + tiered findings + suppressed-count The render lane of the coverage-intelligence epic (#168): the per-model Coverage checks panel rendering the #186/#191 engine verdicts in-context. - Payload (render.rs): FindingPayload wraps the domain Finding (flattened, wire keys unchanged) with render-resolved pin_node (DAG anchor: bracketed constructs pin the named CTE node, model-level constructs the terminal) and sketches (the union check's 'suggested given' evidence lifted into copyable blocks). ReportPayload gains check_specs — the offline spec catalog (name/tier/instrument/conditions/exclusions/rationale + the click-only book_href), keyed by fired check only, serde-skipped when empty so findings-free payloads stay byte-stable. - Surface (report.html/interaction.js/report.css): a self-contained .model-findings section per model — three-valued checklist (mark + word, never colour-only), labeled tier chips (TOTAL solid / HIGH outlined / advisory muted — never blended, no percentages), covered-by attribution, evidence rows, evidence pinning (select + smooth-scroll + flash), the recommendation with #188-pattern copyable YAML sketches, the inline 'What is this check?' rationale drawer (fully offline; the book link is a plain click-only anchor), and the visible-but-quiet suppressed reveal (collapsed count -> rows with reason + source). Token-native on the #187 chassis; tier-chip tooltips use the #146/#188 bubble contract. - Dogfood: playground fixture gains unique_key on mart_dq_summary (grain UNCOVERED), an inline ignore pragma on dim_payers (suppressed-with-reason), and the synthetic-body-mod idiom on fct_clinical_events (union UNCOVERED with three given-row sketches) — all three goldens now show the panel, jaffle-shop deliberately renders the quiet empty state. - Tests: 7 render.rs payload units, 2 BDD scenarios (check_specs catalog facts), 2 headless guards (panel/checklist/tier distinctness/tooltip/ sketch+copy/rationale/book-link/pin/both-toggle-views/empty-state; suppressed collapsed-count + reason reveal); insta snapshots + goldens regenerated intended-only. Closes #170 Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(adapters): #170 review dispositions — in-place Cytoscape pin, flash-timer reset, own-property tally guard - finding-pin under the Cytoscape engine now emits a tap on the live cy node (the exact bound click path: in-place lineage classes + __cuteSelectNode) instead of renderDag() — honoring the #180 no-rebuild-per-click contract (CodeRabbit); headless guard added (same cy instance + .sel class after a pin). - rapid re-pins clear the pending flash timer so an old timeout can't cut the new animation short (gemini). - verdict tally uses an own-property guard (gemini). - goldens + chrome snapshot regenerated. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> * fix(adapters): #170 post-rebase hardening — tag-like payload escaping + qualified-construct pins Rebased onto main with the #173 join check pair (#195), whose spec prose ('WHERE <right>.<key> IS NULL') now rides the payload through the #170 check_specs catalog: - payload_json_for_html_script escapes EVERY tag-opening '<' shape ('</', '<!', '<?', '<letter') to \u003c — inert in browsers either way, but raw '<right>' read as markup to non-HTML5 tag scanners (the tl-based BDD payload extractors choked); bare '< ' / '<digit' (compiled-SQL comparisons) stay raw, preserving the documented contract. - resolve_pin_node understands the #173 qualified construct form (left_join[<consumer>:<right>]) and pins the consumer CTE; unit test added. - the #195 suggested-given BDD steps read the sketch from the finding's 'sketches' array (the #170 lift moved it out of evidence — their sketches get the copy-button affordance for free); the step now also pins that the entry is never duplicated back into evidence. Co-Authored-By: Claude Fable 5 <noreply@anthropic.com> --------- Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com> Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
Summary
PR-1 of the design integration (epic #176): the Claude Design Phase-1 chassis CSS — semantic token layer, 5 AA-pinned themes (Light / Dark / Tokyo Night / Solarized / Gruvbox), 4 style packs (paper / terminal / swiss / soft), and the density layer — replaces the report template's custom
<style>block body.<html>gainsdata-style="soft" data-difflayout="auto". Pure visual: zero payload change, zero JS change, zero DOM restructuring (the static incremental badge anddefined_inrelocations wait for PR-2, #178).Closes #177
Placement decision — first-party asset
The merged CSS lands at
templates/report.css(beside the template it styles), embedded viainclude_str!asasset_embed::REPORT_CSSand interpolated{{ report_css|safe }}.assets/: bothtests/assets_manifest.rsand theassets-manifest-gateCI job walk every file underassets/and demand an upstream pin (version / source URL / SHA-256 / SPDX) — provenance fields a first-party authored file doesn't have.templates/trips no gate.each_embedded_asset_carries_its_pinned_version_banner:cute-dbt report chassis CSS v1) AND an end-of-file sentinel, so a truncated copy fails CI (a head-only check would pass on a file cut off mid-rule);[hidden]{display:none!important}rule must survive comment-stripping.AA pins
The handoff's per-theme diff add/remove contrast table is carried into
templates/report.cssas the comment block headed "AA pins — do not re-brighten". No token color value was altered; every theme keeps its verified ≥ 4.5:1 WCAG-AA ratios on the load-bearing diff add/remove pair (Light 5.02/4.83 · Dark 9.65/7.52 · Tokyo 8.81/6.08 · Solarized 4.62/5.01 · Gruvbox 6.74/4.85).Porting-bug grep result (
*/-inside-comment, handoff §2.1)Mechanical scan of the merged
templates/report.css:The same checks now run on every
cargo testvia the comment-balance test.Intermediate-state verdict (old DOM + new chassis): coherent, no PR-2 absorption needed
The chassis styles some DOM that only arrives with PR-2's engine (settings-panel pickers, code-card headers, split-diff tables, Cytoscape host) — all inert against the current DOM. Two true collisions were reconciled in clearly-marked layers at the bottom of
report.css:#157—.panel-row.is-stackedstaysminmax(0,1fr)(the handoff's1frwould re-introduce the 375px mobile blowout; the existing headless regression test pins it — it passes).#165/#166— the shipped column-tooltip contract (focusable<button>trigger + CSS bubble on:hover/:focus) is kept, tokenized onto the chassis. The handoff's body-appended.col-tooltipfixed bubble reuses the same class name for different DOM and is deferred to PR-2/PR-3 (carrying it verbatim would restyle the live trigger into a broken fixed-position bubble).white-space: pre(the chassis' flex +white-space: normalline rules assume the engine's[gutter][sigil][code]DOM and would collapse SQL/YAML indentation); legacy copy-button clearance on.sql-block;.model-sqlsection rhythm; the ⚙ text-glyph size on the settings cog.Verified affordances under the new chassis (headless + visual): Current/Diff + Updated-only/All toggles, hunk folds (
Show N unchanged linesrows now GitHub-blue), #145/#161 incremental badge + expect-semantics tooltip in their current static positions, #166 column-header tooltips (focus reveals bubble), DataTables sort/render, Mermaid DAG + fixed Okabe-Ito legend.Screenshots (intermediate state)
Rendered from the regenerated synthetic
examples/diff-showcase-report.html. Hosted on thescreenshots-pr-177hosting-only branch (synthetic data; branch can be deleted after review — asking permission per repo rules).Light · soft (the shipped default):
GitHub-grade YAML diff (Light) — full-bleed tints, sigils, word emphasis, blue fold row, indentation preserved:
Dark (set via
data-theme="dark"; the theme picker UI itself arrives with PR-2):Tokyo Night:
Gates (all run directly — lefthook can silently skip in fresh worktrees)
cargo fmt --all --checkcargo clippy --all-targets --locked -- -D warningscargo nextest runcargo test --test bddcargo test --test headless_toggle --locked -- --ignoredcargo test --test headless_zero_egress --locked -- --ignoredRUSTDOCFLAGS="-D warnings" cargo doc --no-deps --document-private-items --lockedcargo deny checkGolden / snapshot churn character
3 golden examples + 2 insta snapshots regenerated. Verified with
git diff --text -U0: every hunk falls on the<html ...>attr line or inside the custom<style>block; zerocute-dbt-data/application/jsonpayload lines touched in any golden; the chrome insta snapshot's last hunk ends at the old style block's final line. Zero-egress intact: 0url(, 0@import, 0 protocol-relative refs in the new CSS; resource-ref lint + headless network-block proof both green; no web fonts (system font stacks only).🤖 Generated with Claude Code