Foundations
Shape, borders and surfaces
Native Townwell geometry is preserved in app specimens; the portfolio documentation retains its own square-cornered style.
On this page
Source radius roles
| Role | Public | Admin |
|---|---|---|
| control | .35rem | .45rem |
| badge | .25rem | 999px |
| panel | .7rem | .65rem |
| large-panel | .9rem | .8rem |
Surface hierarchy
- Use line borders to separate quiet panels and lists. Reserve scrims for modal isolation.
- A source badge or switch can have rounded geometry. That geometry belongs inside the actual product screenshot, not to newly invented portfolio cards.
- Do not add decorative drop shadows, pills or additional corner radii to the documentation UI.
- Do not treat an AdminPanel as an arbitrary clickable card; its child determines the interaction.
Source references
| File | Responsibility |
|---|---|
| app/globals.css | Audited Townwell implementation; use this file when extending this interface. |
| components/admin-ui.tsx | Audited Townwell implementation; use this file when extending this interface. |
| components/admin/admin-publication-control.tsx | Audited Townwell implementation; use this file when extending this interface. |
Examples from the app
Actual Boise Today and Townwell UI with synthetic editorial, business, review, media metadata and analytics. Existing Boise imagery; no live data changes. Captured at 2× resolution or higher. Select an image to inspect it full size.
Related topics
Source audit: 2026-10-07 · Revision ce8bc72b96da · Documentation v0.1