NJIT Logo YWCC Capstone Sponsors

Variant 1 — Grid

Grid variant delegates rendering to the shared <ArticleCard> component (1280x720 srcset, 6-width responsive ladder). With 2 published articles, this renders as a 2-card row via SectionGrid auto-fit.

Variant 2 — Split Featured

Featured article uses ArticleCard (1280x720 srcset). Sidebar row uses inline markup with a DPR-calibrated srcset [128, 256, 384, 512] at sizes="128px" for retina displays.

Variant 3 — List

Variant 4 — Brutalist

Inline markup: border-brutal frames, h-1 bg-primary accent bars, label-caps category spans, font-mono headlines + tabular-nums dates. Sizes hint calibrated to SectionGrid auto-fit: 2 cols @ 640-900px, 3 cols @ 900-1180px, 4 cols @ 1180-1440px, 5 cols @ 1440+px.

Diagram of a shared web platform powering three independent YWCC program websites
Program News

Building the YWCC Capstone and RWC Web Platform

How we built three independent program websites from a single shared codebase using Astro, Sanity, and Cloudflare — at just $15/month combined operating cost.

by Jay Singh

Variant 5 — Magazine

Editorial hero (1600x900, eager + fetchpriority=high, 5-width srcset for LCP budget). Remaining articles tier by count: 1 remaining → max-w-3xl contained single card (THIS case with 2 total articles), 2 remaining → md:grid-cols-2, 3+ remaining → md:grid-cols-2 lg:grid-cols-3.