Hopp til innhold

Summary­Table

Oppsummeringstabeller brukes for eksempel til å vise produkter som ligger i en handlekurv med informasjon om navn og pris.

Live demo

SummaryTable
Visning
Tema
Tetthet
<SummaryTable
caption="Informasjon om produkter og pris i handlekurven"
header={["Produkt", "Pris"]}
body={
<>
<SummaryTableRow header={`Uførepensjon`} content="340,00 kr/mnd" />
<SummaryTableRow
className="summary-table-example__custom-row"
header={`Livsforsikring`}
content="Tatt ut av tilbudet"
/>
<SummaryTableRow header={`Innboforsikring`} content="122,00 kr/mnd" />
<SummaryTableRow header={`Reiseforsikring`} content="249,00 kr/mnd" />
<SummaryTableRow
className="summary-table-example__custom-row"
header="Rabatt"
content="- 17,50 kr/mnd"
/>
</>
}
footer={
<>
<SummaryTableRow header="Total sum" content="693,50 kr/mnd" />
<SummaryTableRow
header={<span className="jkl-sr-only">Total sum per år</span>}
content="8322,50 kr/år"
/>
</>
}
/>

React API

Her finner du en oversikt over props på komponentene i pakken.