material_base-8.x-2.x-dev/templates/layout/region--overlay.html.twig

{#
/**
 * @file
 * Theme override to display a region.
 *
 * Available variables:
 * - content: The content for this region, typically blocks.
 * - attributes: HTML attributes for the region <div>.
 * - region: The name of the region variable as defined in the theme's
 *   .info.yml file.
 *
 * @see template_preprocess_region()
 */
#}
{% set classes = [
    'region',
    'region-' ~ region|clean_class,
    'page-overlay',
    'overlay',
] %}

{% if content %}
  <div{{ attributes.addClass(classes) }}>
    <div class="overay__bg"></div>
    <div class="overay__container">
      <div class="overlay__header">
        {# Logo or title #}

        <div class="overlay-close">
          <div class="overlay-close__button">
            {% include "@material_base/components/01_atoms/icon.twig" with {
              data: {
                value: 'close',
              },
              settings: {
                type: 'svg-sprite',
              }
            } %}
          </div>
        </div>
      </div>
      <div class="overlay__content">
        {{ content }}

        {# Bottom action #}
      </div>
    </div>
  </div>
{% endif %}