AIAIAI Design System

Portal shell

Locked, accessibility-by-construction site chrome for the citizen portal (GOV.UK / Designers Italia patterns). AppFrame · SiteHeader · SiteFooter · SkipLink · ServiceNavigation · Link · Hero · ContentBlock. Structure is frozen and conformance-checkable; only brand tokens vary per tenant via data-theme.

Link

Inline (in prose): read our privacy policy before submitting.

Standalone link External link ↗ Current page (no href → non-interactive span)

A Link with no href renders a non-interactive <span aria-current="page"> — never a keyboard-trap empty anchor.

ServiceNavigation

Data-driven; the current item gets aria-current="page". Resize below 768px for the disclosure toggle.

Empty items renders nothing (no empty nav landmark) — an empty ServiceNavigation follows this line:

SiteHeader (composed)

Hero

Report a problem in Valongo

Potholes, lighting, waste — in two minutes.

Hero with background image

An image renders cover/center under the --hero-scrim overlay — a surface-tinted (theme-following) scrim, so the text tokens keep their contrast on any photo. Raise the scrim mix for busier imagery.

Report a problem in Valongo

The scrim keeps this readable over the photo.

ContentBlock + SiteFooter

Privacy Policy

We respect your data and process reports per RGPD.

What we collect

Only what's needed to act on your report.

StatusTimeline

Ordered <ol> progress timeline for the tracker page. The current step gets aria-current="step"; each step announces a visually-hidden state label (localizable for the portal's i18n).

  1. Completed: Submitted 12 May 2026
  2. Completed: Under review 13 May 2026
  3. Current step: In progress

    A crew has been assigned to your street.

  4. Upcoming: Resolved

WidgetGrid

Dashboard layout for landing / information-portal pages. Children opt into width with widget-span-2 / widget-span-full. Resize to see it fold to two columns, then one.

Participate in Valongo

Open consultations, reports, and local budget voting.

Reports resolved 1 284
Open consultations 7
Votes this week 312
Recent activity

A full-width widget — e.g. a map or an activity feed spanning the whole row.

VotingWidget

Valongo V10 participation primitive. A <fieldset> radio group; the portal wires onsubmit to the BFF voting placement and renders the bot challenge into the captcha slot.

Which project should Valongo fund first?
Results so far

Thanks — your vote is counted.

Receipt: vlg-7f3a-9c21
Should the market move to Saturdays?

Voting closed on 30 May 2026.