aleph1.co.uk Git - yaffs-website/blob - web/themes/contrib/bootstrap/templates/bootstrap/bootstrap-modal.html.twig

   1 {#
   2 /**
   3  * @file
   4  * Default theme implementation to display a Bootstrap Modal component.
   5  *
   6  * Available variables:
   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
  11  *   the header.
  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
  19  *        default value.
  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.
  30  *
  31  * @ingroup templates
  32  */
  33 #}
  34 {% if theme.settings.modal_enabled %}
  35   {{ attach_library('bootstrap/modal') }}
  36   {%
  37     set classes = [
  38       'modal',
  39       theme.settings.modal_animation ? 'fade',
  40     ]
  41   %}
  42   <div{{ attributes.addClass(classes) }} tabindex="-1" role="dialog">
  43     {%
  44       set dialog_classes = [
  45         'modal-dialog',
  46         size ? size|clean_class,
  47       ]
  48     -%}
  49     <div{{ dialog_attributes.addClass(dialog_classes) }} role="document">
  50       {% set content_classes = ['modal-content'] -%}
  51       <div{{ content_attributes.addClass(content_classes) }}>
  52         {% if title -%}
  53           {% block title -%}
  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">&times;</span></button>
  59               {% endif -%}
  60               <h4{{ title_attributes.addClass(title_classes) }}>{{ title }}</h4>
  61             </div>
  62           {% endblock -%}
  63         {% endif -%}
  64
  65         {% block body -%}
  66           {% set body_classes = ['modal-body'] -%}
  67           {%
  68             set description_classes = [
  69               'help-block',
  70               description and description.position == 'invisible' ? 'sr-only',
  71             ]
  72           %}
  73           <div{{ body_attributes.addClass(body_classes) }}>
  74             {% if description and description.position == 'before' %}
  75               <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
  76             {% endif %}
  77             {{ body }}
  78             {% if description and description.position == 'after' or description.position == 'invisible' %}
  79               <p{{ description.attributes.addClass(description_classes) }}>{{ description.content }}</p>
  80             {% endif %}
  81           </div>
  82         {% endblock -%}
  83
  84         {% if footer is not empty -%}
  85           {% block footer -%}
  86             {% set footer_classes = ['modal-footer'] -%}
  87             <div{{ footer_attributes.addClass(footer_classes) }}>
  88               {{ footer }}
  89             </div>
  90           {% endblock -%}
  91         {% endif -%}
  92       </div>
  93     </div>
  94   </div>
  95 {% endif %}