Foundations

Färg, typografi och spacing från Aleris designsystem — grunden alla skärmar i detta projekt är byggda på.

Färg

{{ c.name }} {{ c.value }}

Typografi

{{ t.size }} Aa Bb Cc — sentence case

Spacing & radius

{{ sp.px }}

Button

Primary Secondary Outline Ghost Unavailable
Primary onDark Outline onDark

Badge & Tag

Neutral Info Confirm Warning Error Accent

Card & Lead

Vitt kort på sandgrund

27px lead-stycke, en gång per sektion.

Card med padding="16px" — används i StatCard-mönstret i läkarkonsolen.

Formulär

Feedback

Neutral information till användaren. Uppkopplingen bröts. Dina svar finns kvar — försök igen om en stund.

Data

TrendLine

Interaction patterns

Mönster som upptäcktes när kärnprodukten byggdes — dokumenterade här så nästa skärm ärver dem.

{{ p.title }}

{{ p.desc }}

Onboarding — Bli patient

Kommunikativ ström: entry (pris överst) → hälsodeklaration (4 exempelfrågor) → resultat (tre utfall) → BankID → samtycken → klar. Fullt interaktiv nedan.

Patientapp — mobil

Mobilanpassad patientyta: hem, incheckning, chatt och konto i en bottentabb.

Läkarkonsol

Instrumentell yta: köhantering, avvikelser och patientdetalj — den enda ytan på 24px-golvet.