## Description Modal panels, also known as modal dialogs or popups, can be created using standard links or buttons with the `pat-modal` class. A modal panel is a panel that requires users to interact with it before they can return to the application behind it. ## Documentation Case 1: Any ``
Hello.
For more examples, see the [demo page](./index.html). ### Options reference You can customise the behaviour of modals through options in the `data-pat-modal` attribute. | Property | Default value | Values | Description | Type | | ---------------------- | ----------------------- | ---------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------ | | `class` | | | A class name to be applied to the modal. | String. | | `closing` | "close-button" | ["close-button", "outside"] | Show a "close" button for closing the modal, or let it be closed by clicking outside of the modal area. | One of the mutually exclusive available string values. | | `close-text` | "Close" | | Specify a custom string for the close button. | String. | | `panel-header-content` | `:first:not(.header)` | CSS selector or "none" | Specify a CSS selector which is used for the modal header. If set to "none" no header will be added automatically and you can provide your own. | String. | | `source` | | CSS selector | CSS selector for the injection source. If not given, the URL fragment of the ``href`` attribute from the modal trigger is used. | String. | | `target` | `#pat-modal` | CSS selector | CSS selector for the injection target. | String. |