KOMPONENTER

MediaCard

npmv2.3.19

MediaCard er en skyggefull boks som gir et kort sammendrag av innnhold og som støtter video, bilde eller grafikk for å forsterke innholdet.

npm install @entur/layout

@import '@entur/layout/dist/styles.css';

Komponenter

MediaCard

import { MediaCard } from '@entur/layout';

Navn	Type	Default-verdi	Beskrivelse
`as?`	`string \| React.ElementType`	`'a'`	HTML-elementet eller React-komponenten som lager bunnen (under media) av MediaCard An override of the default HTML tag. Can also be another React component.
`title`	`string`		Tittelen/teksten som står i CardBox
`description?`	`ReactNode`		Teksten under tittelen i MediaCard
`category?`	`string`		Kategori (eller lignende) som vises over tittelen
`className?`	`string`		Ekstra klassenavn
`children?`	`ReactNode`		Det du skulle ønske som media (f.eks. bilder eller video)
`style?`	`CSSProperties`		Styling som sendes til komponenten
`headingLevel?`	`"h2" \| "h3" \| "h4" \| "h5" \| "h6"`	`'h2'`	Hvilken heading som brukes for tittelen. Blir kun satt hvis description også er satt.
`hideArrow?`	`boolean`	`false`	Skjul pil-ikonet nederst til høyre
`wrapperProps?`	`HTMLAttributes<HTMLElement>`		Props som sendes til wrapper-elementet i stedet for lenke-elementet
`wholeCardAsElement?`	`boolean`		@deprecated Denne prop-en har ikke lenger en funksjon. Hvis du trenger å legge til props på wrapper-elementet, bruk ‘wrapperProps’-prop-en

Retningslinjer for bruk

Card Media er en skyggefull boks som viser innhold og handling om et emne. I motsetnings til et vanlig Card, kan Card Media inneholde video, bilde og grafikk for å forsterke innholdet. Card Media gir et kort sammendrag av innholdet, og lenker videre til en ny side med ytterligere detaljer. Den skal være enkel å skanne etter relevant informasjon.

Card Media kan for eksempel brukes som navigasjon til en artikkel eller bloggpost. Komponenten skal ha en beskrivende tekst under tittelen. Teksten bør være kort og konsis, på max 3 linjer.

Komponenter

MediaCard

Props

Retningslinjer for bruk