"Vis detaljer"-boks

Boks med mulighet for å åpne/kollapse visning.

"Vis detaljer"

Komponenten kan brukes til å gjemme unna lengre avsnitt med tekst og innhold, slik at visningen blir mer kompakt. Dette er spesielt nyttig på mindre skjermer.

Barnehage / SFO Betalling frist: 12/07/2019 2990,55-

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

Informasjon Betalling frist: 12/07/2019

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

Faktura / Kvittering Faktura frist: 12/07/2019 3001,-

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

Yo!
Det er jammen lite her.

<lk-show-details background="#F0F5FC">
    <span slot="title">Barnehage / SFO</span>
    <span slot="description">Betalling frist: 12/07/2019</span>
    <span slot="tag">2990,55-</span>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
</lk-show-details>

<lk-show-details background="#B4E5D0"  open-text="Les mer" close-text="Les mindre">
    <span slot="title">Informasjon</span>
    <span slot="description">Betalling frist: 12/07/2019</span>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
</lk-show-details>


<lk-show-details background="white" open-text="Se faktura" close-text="Ikke se faktura">
    <span slot="title">Faktura / Kvittering</span>
    <span slot="description">Faktura frist: 12/07/2019</span>
    <span slot="tag">3001,-</span>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
    <p>Yo!<br>Det er jammen lite her.</p>
</lk-show-details>