templates/includes/dialog.html.twig line 1

Open in your IDE?
  1. {% set attributes = [] %}
  2. {% set classes = ['dialog'] %}
  3. {% if class is defined and class != '' %}
  4.     {% set classes = classes|merge([class]) %}
  5. {% endif %}
  6. {% set bg = background|default('') %}
  7. {% if bg == 'blur' %}
  8.     {% set classes = classes|merge(['dialog--blur-background']) %}
  9. {% elseif bg == 'hide' %}
  10.     {% set classes = classes|merge(['dialog--hide-background']) %}
  11. {% endif %}
  13. {% set attributes = attributes|merge(['class="' ~ classes|join(' ') ~ '"']) %}
  14. {% if id is defined and id != '' %}
  15.     {% set attributes = attributes|merge(['id="' ~ id ~ '"']) %}
  16. {% endif %}
  17. {% if style is defined and style != '' %}
  18.     {% set styleString = '' %}
  19.     {% for rule, property in style %}
  20.         {% set styleString = styleString ~ rule ~ ': ' ~ property ~ ';' %}
  21.     {% endfor %}
  22.     {% set attributes = attributes|merge(['style="' ~ styleString ~ '"']) %}
  23. {% endif %}
  25. {% set hide = [] %}
  26. {% if hideClickBackground is not defined or hideClickBackground == true %}
  27.     {% set hide = hide|merge(['backdrop']) %}
  28. {% endif %}
  29. {% if hideClick is defined and hideClick == true %}
  30.     {% set hide = hide|merge(['click']) %}
  31. {% endif %}
  32. {% set attributes = attributes|merge(['data-dialog-hide-on="' ~ hide|join(' ') ~ '"']) %}
  34. {% if includeHeader is not defined or includeHeader != false %}
  35.     {% set headerId = 'header-' ~ random() %}
  36.     {% set attributes = attributes|merge(['aria-described-by="' ~ headerId ~ '"', 'tabindex="-1"']) %}
  37. {% endif %}
  39. <dialog {{ attributes|join(' ')|raw }}>
  40.     <div class="dialog__content">
  41.         {% if includeHeader is not defined or includeHeader != false %}
  42.         <div class="dialog__header">
  43.             <h2 id="{{ headerId }}" class="dialog__title">{% block title %}{{ title|default('') }}{% endblock %}</h2>
  44.             {% if hideXButton is not defined or hideXButton == false %}
  45.             <div class="dialog__hide-wrapper">
  46.                 <button class="dialog__hide" type="button" aria-label="{{ 'dialog.close'|trans }}"{% if confirmXButton is defined %} data-confirm="{{ confirmXButton }}"{% endif %} data-dialog-hide>&times;</button>
  47.             </div>
  48.             {% endif %}
  49.         </div>
  50.         {% endif %}
  51.         <div class="dialog__body">{% block body %}{% endblock %}</div>
  52.     </div>
  53. </dialog>