DescriptionList
DescriptionList viser nøkkel-verdi-par strukturert som en HTML description list (dl/dt/dd).
- Navn
- Ola Nordmann
- Adresse
- Storgata 1, 0001 Oslo
- Forsikringsnummer
- NO-1234567
Props
Prop | Type | Påkrevd | Standard | Beskrivelse |
|---|---|---|---|---|
childrenReact | React.ReactNode | Ja | — | DescriptionTerm og DescriptionDetail-elementer. |
separatorsReact | boolean | Nei | false | Viser skillelinjer mellom par. |
alignmentEgendefinert | "horizontal" | "vertical" | "justified" | Nei | "vertical" | Layoutretning for nøkkel-verdi-par. |
Eksempler
Nøkkelverdi-par
Enkelt nøkkelverdi-par.
- Forsikringstype
- Kasko
Kontaktinformasjon
Typisk bruk for å vise detaljer om en entitet.
- Navn
- Ola Nordmann
- E-post
- ola@nordmann.no
- Telefon
- +47 900 00 000
Horisontal layout
alignment="horizontal" plasserer nøkkel og verdi side om side på samme rad.
- Forsikringsnummer
- FO-2024-12345
- Produkt
- Innboforsikring
- Forsikringstaker
- Kari Nordmann
- Startdato
- 01.01.2024
Justified layout
alignment="justified" skyver nøkkel til venstre og verdi til høyre – nyttig i oppsummeringer og kvitteringer.
- Dekning
- Kasko
- Egenandel
- 4 000 kr
- Årspremie
- 8 400 kr
Flere detaljer per term
En term kan ha flere DescriptionDetail-elementer, f.eks. for en adresse med flere linjer.
- Faktureringsadresse
- Storgata 1
- 0155 Oslo
- Norge
- Kontaktperson
- Ola Nordmann
Med skillelinjer
Bruk separators for å skille par visuelt.
- Avtalenummer
- FO-2024-98765
- Status
- Aktiv