4 * Default theme implementation to display a Bootstrap Modal component.
7 * - attributes: Attributes for the outer modal div.
8 * - body: The body of the modal.
9 * - body_attributes: Attributes for the modal body div.
10 * - close_button: Flag indicating whether or not to show the close button in
12 * - content_attributes: Attributes for the modal content div.
13 * - description: (optional) A list of description properties containing:
14 * - content: (optional) A description of the modal, may not be set.
15 * - attributes: (optional) A list of HTML attributes to apply to the
16 * modal description div. Will only be set when description is set.
17 * - position: (optional) A display setting that can have these values:
18 * - before: The description is displayed before the body. This is the
20 * - after: The description is display after the body.
21 * - invisible: The description is displayed after the element, hidden
22 * visually but available to screen readers.
23 * - dialog_attributes: Attributes for the inner modal div.
24 * - footer: The footer of the modal.
25 * - footer_attributes: Attributes for the modal footer div.
26 * - header_attributes: Attributes for the modal header div.
27 * - size: The size of the modal. Can be empty, "modal-sm" or "modal-lg".
28 * - title: The title for the modal.
29 * - title_attributes: Attributes for the modal title.
34 {% if theme.settings.modal_enabled %}
35 {{ attach_library('bootstrap/modal') }}
39 theme.settings.modal_animation ? 'fade',
42 <div{{ attributes.addClass(classes) }} tabindex="-1" role="dialog">
44 set dialog_classes = [
46 size ? size|clean_class,
49 <div{{ dialog_attributes.addClass(dialog_classes) }} role="document">
50 {% set content_classes = ['modal-content'] -%}
51 <div{{ content_attributes.addClass(content_classes) }}>
54 {% set header_classes = ['modal-header'] -%}
55 {% set title_classes = ['modal-title'] -%}
56 <div{{ header_attributes.addClass(header_classes) }}>
57 {% if close_button -%}
58 <button type="button" class="close" data-dismiss="modal" aria-label="{{ 'Close'|t }}"><span aria-hidden="true">×</span></button>
60 <h4{{ title_attributes.addClass(title_classes) }}>{{ title }}</h4>
66 {% set body_classes = ['modal-body'] -%}
68 set description_classes = [
70 description and description.position == 'invisible' ? 'sr-only',
73 <div{{ body_attributes.addClass(body_classes) }}>
74 {% if description and description.position == 'before' %}
75 <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
78 {% if description and description.position == 'after' or description.position == 'invisible' %}
79 <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
84 {% if footer is not empty -%}
86 {% set footer_classes = ['modal-footer'] -%}
87 <div{{ footer_attributes.addClass(footer_classes) }}>