Project
Check empty input, ragged rows and disconnected names, returning exclusive bounds only when every named area fills its rectangle.
AI coding workspace
Rectangular CSS grid areas
Arevia is a Windows AI coding workspace for reviewing layout rules alongside project files. Open a grid validator, discuss the rectangle invariant with a compatible model, and inspect the proposed changes before trying the resulting CSS.
● ● ●Arevia●
A concrete starting point · Rectangular CSS grid areas ×
import re
def grid_areas(rows):
if type(rows) is not list or any(type(r) is not str for r in rows):
raise ValueError("grid.rows")
if not rows:
return {}
cells = [r.split() for r in rows]
width = len(cells[0])
if not width or any(len(r) != width for r in cells):
raise ValueError("grid.width")
groups = {}
for y, row in enumerate(cells):
for x, name in enumerate(row):
if name == ".":
continue
if not re.fullmatch(r"[A-Za-z_][A-Za-z0-9_-]*", name):
raise ValueError("grid.name")
groups.setdefault(name, []).append((y, x))
result = {}
for name, points in groups.items():
top, bottom = min(y for y,x in points), max(y for y,x in points)+1
left, right = min(x for y,x in points), max(x for y,x in points)+1
if len(points) != (bottom-top)*(right-left):
raise ValueError("grid.rectangle")
result[name] = (top, bottom, left, right)
return result✳Rectangular CSS grid areas
✓ ChangesReview before applying ↗
Illustrative workspace
Review before applying
Compare actual behavior with the expected result. If a check fails, investigate it before applying more changes.
Connection
Base URL, credentials and a reachable server.
A concrete starting point
import re
def grid_areas(rows):
if type(rows) is not list or any(type(r) is not str for r in rows):
raise ValueError("grid.rows")
if not rows:
return {}
cells = [r.split() for r in rows]
width = len(cells[0])
if not width or any(len(r) != width for r in cells):
raise ValueError("grid.width")
groups = {}
for y, row in enumerate(cells):
for x, name in enumerate(row):
if name == ".":
continue
if not re.fullmatch(r"[A-Za-z_][A-Za-z0-9_-]*", name):
raise ValueError("grid.name")
groups.setdefault(name, []).append((y, x))
result = {}
for name, points in groups.items():
top, bottom = min(y for y,x in points), max(y for y,x in points)+1
left, right = min(x for y,x in points), max(x for y,x in points)+1
if len(points) != (bottom-top)*(right-left):
raise ValueError("grid.rectangle")
result[name] = (top, bottom, left, right)
return resultCarry the layout rule through to a useful interface response
Arevia is a Windows AI coding workspace for developing the code that connects layout input with visible behavior. Open the relevant project files and describe what the person editing the layout should be allowed to express. Ask the model to inspect the validator and its caller before changing either side of that interaction.
You choose the assisting model through a supported OpenAI-compatible or Anthropic endpoint and supply credentials when required. An uncensored AI model can be selected if your endpoint offers one. Its restrictions, tool support and context capacity remain properties of that setup, rather than guarantees attached to the layout task.
A rectangular CSS grid-area check is one example request. Bring a valid grid, a disconnected named region and an uneven row into the conversation. Ask how the current implementation accepts or rejects each, then review a proposed change that preserves valid layouts while explaining an invalid one to the user.
Keep the validator result and the interface response in the same review. A correct rejection still needs a useful message, and an accepted layout should reach the intended rendering path. Run project tests, inspect the changed source and try representative layouts in your own interface before deciding that the feature behaves as specified.
Working from layout input to feedback
- What distinguishes a grid-rule error from a rendering problem?
Check whether the submitted structure passes the intended validation first. If it does, follow the accepted output into rendering. Ask the model to inspect both paths, using the same fixture, rather than changing CSS before identifying the failing stage.
- Should an invalid region be automatically repaired?
Only if that is an explicit product requirement. Repair can alter the layout someone intended. Define whether the interface should reject, explain or transform the input, and review the resulting code against that chosen behavior.
- Which grid examples should accompany a change request?
Include a valid rectangle, a named region with a gap and rows of different widths. State the expected result for each. Add the smallest fixture that reproduces your own issue so review stays tied to the reported behavior.
- How do I keep a layout preview task appropriately scoped?
Name the files and acceptance cases before requesting work. Review any proposed tool actions, since local model inference requires a separate server and does not make all tools local. Verify the resulting interface in the environment you actually use.
Arevia · Updated 2026-10-25