Mirrors_Framework/awesome-python
1
0
Fork 0
mirror of https://github.com/vinta/awesome-python.git synced 2026-05-09 11:13:01 +08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

docs(.impeccable): add placestoread reference, no-green rule, type size guidance, consistency checks, and narrow-screen behavior

Browse Source 
- Primary visual model: placestoread.xyz (table, expand row, sorting, footer)
- Color aversion: no green; warm brown-red/ivory/earthy palette only
- Type sizing: default one step larger than impeccable scale; never reduce unprompted
- Row numbers: left-align, no leading zeros
- Visual consistency checklist: hover/focus, tag variants, typography tiers, gutters, color tokens
- Narrow-screen: < 960px and < 680px must stay functional; run playwright-cli after layout changes

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Vinta Chen
2026-04-20 01:19:26 +08:00
parent f65a2aa9c0
commit ebeff71525
1 changed files with 24 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.impeccable.md
+24
View File
@@ -41,10 +41,15 @@ Stay close to the current direction. It works.
References (what to stay close to):
- **https://www.placestoread.xyz** is the primary visual model for the table, expand row, sorting, and footer. "Like placestoread" means dense single-page list, inline click-to-expand rows that indent under the Name column, sortable headers, minimum decoration. When in doubt about a table or row treatment, check placestoread first.
- Magazine reference pages (The Economist, FT Weekend, Monocle).
- Field-guide books. Curated, functional, hand-made.
- Library card catalogs. Dense tabular information, excellent typography, no decoration for decoration's sake.
Color aversions:
- No green. The user rejected it when picking the palette. Warm brown-red, ivory, and dark earthy tones are the established system. Do not introduce green even for success states or ancillary accents.
Anti-references (avoid strictly):
- Generic dark developer-tool look. No cyan on near-black, neon gradients, VSCode-palette dashboards, terminal-green monospace branding.
@@ -70,6 +75,8 @@ Layout and sizing:
- The impeccable skill reference rule "cap line length at ~65-75ch" does NOT apply here. Ignore it. Readability at wide widths is carried by vertical rhythm, leading, and the modular type scale instead.
- If you believe a width cap is actually necessary for some specific element, ask first with a concrete reason before adding it.
- Body type floor is 16px (`--text-base: 1rem`). Content-heavy passages may go to 1.125rem.
- When in doubt about any type size, pick one step larger than what the impeccable skill's scale references suggest. The user has repeatedly corrected sizes upward (11+ separate requests across 8 sessions). Never reduce an existing size unprompted. Footer, meta rows, expand content, labels, headings all trend too small by default.
- Row numbers in the table: left-align, no leading zeros. The user tried zero-padding and rejected it.
- Adjacent heading levels differ by at least 0.25rem of rendered size.
Color:
@@ -88,6 +95,23 @@ CSS hygiene:
- Never `text-transform`. Write the casing in the markup.
- Sibling components (card lists, grid items) share identical spacing.
Visual consistency check:
Before shipping any visual change, check peer elements. The user catches inconsistencies repeatedly.
- Hover and focus states: if one link type gets a hover treatment, peer links (hero topbar, footer, project names, sponsor names, expand-meta) share it.
- Tag variants (group, subcat, source, built-in) inherit the base `.tag` style and differ only where a real difference is needed.
- Typography tiers: labels that play the same role share size, weight, and letter-spacing.
- Symmetric gutters: logo left-gap equals logo right-gap, column paddings match across header and body.
- Role-based color tokens: same role uses the same token everywhere. No one-off inline `color: oklch(...)` buried in a rule.
Narrow-screen behavior:
The user actively tests `< 960px` and `< 680px`. Narrow screens must stay functional.
- Do not drop features that the user might want (sort affordance, filter chips, sticky header where reasonable). Hiding is a last resort and requires justification.
- Always run the `playwright-cli` skill at a narrow viewport after any layout change.
Absolute bans (from the impeccable skill):
- No `border-left` or `border-right` greater than 1px as a colored accent stripe on cards, list items, callouts, or alerts. Use a different structure.