Roadmap

A design systemet agilis módszertan alapján, iteratívan tervezzük. A roadmap ennek megfelelően változhat.

1.2.1 kiadás

A design system aktuális (Figma UI Kit) kiadása: 1.2.1

A design system kódbeli implementációja saját verziózást követ, és itt érhető el: DÁP Design System komponensek.

1.2 → 1.2.1 változások (2025.09.30.)
  • Bekerült egy új iD logo komponens
1.1 → 1.2 változások (2025.06.30.)
  • Header
    • Variánsok: 1 és 2 soros verzió
    • Navigációs lehetőségek: egyszerű és mega menü
    • Mobil verzió
    • Támogatott tartalom: kereső, avatár, gombok
  • Footer section
    • Támogatott tartalom: logók, linkek, közösségi média ikonok, copyright megjelenítése
  • Hero section
    • Variánsok: landing page, különböző aloldalak
    • Támogatott tartalom: címsor, alcím, gombok, kereső, illusztráció
  • Timeline
    • Card és bleed verzió
  • Full screen loading
  • Digitális Állampolgár mobilalkalmazás splash screen (no code)
  • Digitális Állampolgárság Program badge
  • Hivatalos weboldal banner
  • Data table
  • A korábban nehezen módosítható, nyers CSS-struktúrát átalakítottuk egy könnyen karbantartható rendszerre, így a színek és egyéb stíluselemek mostantól központilag, egyszerűen kezelhetők.
1.0 → 1.1 változások (2025.03.05.)
  • Hozzáadtuk a brand border-t a háttérrel rendelkező checkbox-okhoz, hogy konzisztens legyen a radio button-okkal.
  • Hozzáadtunk click handler-eket a radio button-okhoz.
  • A Card komponensen belüli Avatar mostantól small, medium és large méretben is elérhető.
  • Javítottuk az Icon only Quiet variáns háttérszínét.
  • Módosítottuk az összes háttérszín token dark mode értékeit.
  • Az alábbi komponensek új extra small méretvariánst kaptak:
    • Checkbox
    • Checkbox group
    • Date picker base component
    • Date picker field
    • Dropdown
    • File upload
    • Number field
    • Password field
    • Radio button
    • Switch
    • Text field
    • Textarea
  • A typography komponensben a Size tulajdonságokat átneveztük: xLarge, Large, Medium, Small → 1, 2, 3, 4.
  • Hozzáadtuk az Inverted variánst a Divider komponenshez.
  • 88 illusztrációt adtunk a UI Kit-hez.
  • A Card komponens új neve: Media card és kapott egy új Video variánst.
  • Az Avatar komponens most már publikus, és kapott egy notification badge-et.
  • Az Avatar komponens mostantól xSmall és 2xSmall méretben is elérhető.
  • A Background komponens új Border:Divider variánst kapott.
  • Új Help center pattern került hozzáadásra.
  • Kisebb hibajavítások történtek a Loading spinner komponensben.
  • A Table of Contents komponensben a Title mostantól opcionális. A Table of Contents komponens betűméretét 14-ről 16-ra növeltük.
  • Eltávolítottuk az oldalsó paddinget a List item komponensekből.
  • A Top Nav komponenst újraépítettük:
    • Az action bar mostantól 2 elemet fogad el bal oldalon és 3-at jobb oldalon.
    • Az avatar elem title és subtitle opciót is kapott.
    • Az avatar elem és az értesítési gomb notification badge opcióval rendelkezik.
    • A title elem mostantól subtitle opcióval is bővült.
    • A korábbi Top Nav verziók deprecated státuszba kerültek.
0.9 → 1.0 változások (2024.12.04.)
  • Csökkentettük a mező link komponens szövegméretét:
    • A _Field link (small) méretét „base”-ről „sm”-re változtattuk
    • A _Field link (large) méretét „lg”-ről „base”-re változtattuk
  • Eltávolítottuk a _Field fade komponenseket, és az input mező körvonalait kívülről belülre helyeztük át az alábbi komponenseknél:
    • Date picker field
    • Dropdown
    • Number field
    • Password field
    • Search field
    • Text field
  • Javítottuk a gomb ikon tokeneket.
  • Komponenseket módosítottunk a magas-kontrasztú mód támogatása érdekében:
    • Hozzáadtuk a magas-kontrasztú módot az összes komponenshez és a dokumentációhoz.
    • Hozzáadtunk egy 1 pixel alsó szegélyt a Banner komponenshez
    • Létrehoztunk egy belső magas-kontrasztú mód szegély komponenst.
  • Módosítottuk a Divider komponenst, hogy a Vertical változat 1px magasságú, a Horizontal változat pedig 1px szélességű legyen (a korábbi 0px helyett).
  • Hozzáadtuk a kiválasztott állapotot a Menu item (small) és Menu item (large) komponensek "Not inset" változataihoz.
  • Hozzáadtunk egy border/neutral/divider-inverted tokent.
  • Eltávolítottuk a Hibás állapotot a switch group-ból.
  • Frissítettük a szöveg tokeneket, hogy a subtle-button-text tokeneket használják a Table of Contents komponensben.
Tervezett elemek és módosítások
NévKategóriaStátusz
Hang és tónusÚtmutató

Tervezett

MéretekÚtmutató

Folyamatban

Formák és effektekÚtmutató

Tervezett

AnimációkÚtmutató

Tervezett

ElevációÚtmutató

Tervezett

TöréspontokÚtmutató

Folyamatba

IkonokÚtmutató

Tervezett

KontribúcióÚtmutató

Folyamatban

Inkluzív design v2Útmutató

Tervezett

Date pickerKomponens

Publikálva

TagKomponens

Folyamatban

TrayKomponens

Publikálva

TypographyKomponens

Publikálva

ChipKomponens

Folyamatban

MultiselectKomponens

Folyamatban

ImageKomponens

Publikálva

TooltipKomponens

Folyamatban

Cookie popupKomponens

Folyamatban

Form summaryKomponens

Megfontolás alatt

Credit card inputKomponens

Megfontolás alatt

User feedbackKomponens

Folyamatban

Accessibility statement pageTemplate

Folyamatban

Privacy policy pageTemplate

Folyamatban

Help centerTemplate

Publikálva

Multi-step formTemplate

Megfontolás alatt

App settingsTemplate

Megfontolás alatt