| name | layout-reviewing |
| description | Reviews implemented web layouts for source fidelity, responsive behavior, evidence coverage, and project consistency.
Use when: "проверь вёрстку", "ревью вёрстки", "проверь адаптив", "review layout", "check visual fidelity"
Do NOT use for implementing or changing layouts — use layout-writing instead.
|
Layout Reviewing
Judge the supplied implementation and prepared evidence. Do not redesign the interface or replace
an intentional source value with personal taste.
Review Basis
- Where an exact source exists, it controls defined geometry, spacing, color, typography, crop,
effects, layering, content placement, and responsive states.
- Where no source exists, use repository rules, the same component in other states, neighboring
UI, tokens, and established components as the review standard.
- For a partial source, keep these responsibilities separate. General design conventions do not
override values the source defines intentionally.
Evidence Coverage
- A selected-area review covers the changed block, its nearest positioning context, applicable
states, and every required width.
- A whole-page review requires an ordered source- or DOM-derived inventory and evidence for every
listed block at every required width.
- Required widths include baseline
360, 430, 768, and 1440 coverage, established source
or user-screenshot viewports, and both sides of affected breakpoints.
- Missing evidence is a defect only when the review contract requires it and its absence prevents
a defined block, state, or width from being checked. Identify that missing coverage precisely.
Visual Criteria
Inspect each supplied width, block, and state for:
- alignment, container bounds, spacing, density, sizing, and responsive reflow;
- font family, weight, size, line height, wrapping, truncation, and text clipping;
- colors, opacity, borders, radii, shadows, backgrounds, and layer order;
- image or icon choice, aspect ratio, crop, position, and asset quality;
- horizontal overflow, unusable compression, disappearing content, and broken interaction states;
- consistency with project components and tokens where the source leaves a decision unspecified.
For exact-source comparisons, source and site blocks must have matching native dimensions. A diff
image localizes pixel differences but does not prove a defect by itself. Attribute residual text
differences to rasterization only after typography, wrapping, baselines, and bounds align.
Report only a concrete mismatch or coverage gap with a precise code or image-region location,
observed evidence, violated source or project requirement, applicable width and state, and visible
impact. Raster noise, taste, unsupported inference, and unrelated pre-existing layout issues are
not findings.
