← All Visual Examples
draft · proof-control-range-demonstration
Proof and Comparison Control Range
Make Before and After, Stats Band, Comparison Table, and Case Studies visually discoverable through distinct declared layouts, realistic content, responsive behavior, and copyable typed Hugo source.
- Evidence
- demonstration
- Release binding
- unbound
- Core source
dde7da9a7964
Full-size artifacts
Rendered evidence
2 declared viewports. Select an image to inspect it at source resolution.
Intent
Exact declaration
Subjects
Best fit
- evaluating proof and decision controls
- choosing between bounded and editorial compositions
- copying responsive source-first examples
Avoid when
- the content has no supportable evidence
- a generic feature list would communicate the information more honestly
Readiness
Checks and limitations
- accessibility
- partial
- artifact freshness
- partial
- desktop responsive
- pass
- keyboard
- partial
- mobile responsive
- pass
- no essential javascript
- partial
- performance
- not-run
- reduced motion
- pass
- rendered route
- pass
- source portability
- pass
- visual acceptance
- not-run
Limitations
- These captures are source-linked development evidence, not an exact Distribution release binding.
- Chromium desktop and 390px containment, shared-grid geometry, responsive table-card transformation, semantic table anatomy, and visible static content pass. Formal axe-core recording, JavaScript-disabled capture, performance budgets, Safari, exact artifact binding, and independent owner acceptance remain promotion gates.
Invalidated by
- proof-control source or renderer change
- block option or editor contract change
- Core or Distribution release change
- evidence artifact change
Portable source
Routes and source ownership
Paths resolve inside exact Core commit dde7da9a7964f8011ecac5cb311f6d5ae2872b46. Private repository links stay private; the mapping remains explicit.
Rendered routes
| Route | Role | Source |
|---|---|---|
/proof-controls/ | variant discovery and responsive proof | fixtures/compatibility/cinematic-campaign-theme-proof/content/proof-controls/_index.md |
Source mapping
| Role | Path | Use |
|---|---|---|
| copyable proof-control Hugo source | fixtures/compatibility/cinematic-campaign-theme-proof/content/proof-controls/_index.md | Copyable source |
| Customer Brand System presentation variables | fixtures/compatibility/cinematic-campaign-theme-proof/assets/css/foundry-reference-proof.css | Copyable source |
| portable Before and After renderer | layouts/partials/blocks/before-after.html | Framework or evidence source |
| portable Stats Band renderer | layouts/partials/blocks/stats-band.html | Framework or evidence source |
| portable Comparison Table renderer | layouts/partials/blocks/comparison-table.html | Framework or evidence source |
| portable Case Studies renderer | layouts/partials/blocks/case-studies.html | Framework or evidence source |
| render and browser assertions | fixtures/compatibility/cinematic-campaign-theme-proof/fixture.config.json | Framework or evidence source |

