Modal

processed with Commons Bootstrap 5 + Tabler 1.0
Documentation / Modal

Modal

Modal Title

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. 
    <@button style='modal' buttonTargetId='#modalId' title='Launch Modal' />
    <@modal id='modalId'>
        <@modalHeader modalTitle='Modal Title' />
        <@modalBody>
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
                Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam.
        </@modalBody>
        <@modalFooter>
                <@button params='data-dismiss="modal"' title='Close' color='secondary' />
                <@button title='Save changes' />
        </@modalFooter>
    </@modal>

# Parameters documentation


Modal

The container for the header, body and footer elements of the modal.

Parameter Value Default
id* string none
params string none
bgColor string none

Modal Header

The modal header contains the close button and the title of the modal. It has no nested content.

Parameter Value Default
titleLevel string h4
modalTitle string none
id string none
params string none

Modal Footer

The modal footer can have nested content (for the action buttons, for example).

Parameter Value Default
id string none
params string none