fun-hero-modal

A hero modal is used to show extra information as well as the actual content, for instance a preview or a flashy animation.

This component is for the actual dialog. It is designed to work together with the fun-modal-controller component.

See the Modals page for more details of using modals with further examples.

Examples

Specifications

Properties

PropertyAttributeRequiredDescriptionTypeDefault
closeButtonclose-buttonfalseShould the modal have a close buttonbooleantrue
heroColorhero-colorfalseSet the colour of the hero background"brand" | "info" | "neutral"'neutral'

Events

NameDescription
funModalCloseOccurs when the close button is clicked.

Slots

NameDescription
contentmain content
herohero content

Parts

NameDescription
contentAllows styling the content panel
heroAllows styling the hero panel

Dependencies

Depends on

This documentation page generated from the source at fun-hero-modal.tsx

Search Gunnel

Powered byAlgolia