{% extends "@bulma/system/page.html.twig" %}

{#
  Limit the main content column to a max of 10 units at widescreen and above.
  @see system/page.html.twig in the Bulma theme.
#}
{% if not page.content_attributes %}
  {%
    set page = page|merge({
      'content_attributes': create_attribute().addClass([
        'main-content',
        'column',
        'is-10-widescreen',
      ]),
    })
  %}
{% endif %}
{% block navbar %}
{# Add a new region #}
{% if page.header_user %}
<div class="container">
  <div class="columns">
    <div class="column"></div>
    {{ page.header_user }}
  </div>
</div>
{% endif %}
{{ parent() }}
{% endblock navbar %}
{% block header %}
<section class="hero">
  {% block header_and_search %}
  {% if page.header or page.header_search %}
  {# Header hero region + search #}
  <div class="hero-body">
    <div class="container">
      <div class="columns is-vcentered">
        <div class="column">
          {{ page.header }}
          <h1 class="title">{{ site_slogan }}</h1>
        </div>
        <div class="column is-narrow">
          {{ page.header_search }}
        </div>
      </div>
    </div>
  </div>
  {% endif %}
  {% endblock header_and_search %}
  {% block tabs %}
  {# Drupal tabs #}
  {% if page.header_tabs %}
    <div class="hero-footer">
      <div class="container">
        {{ page.header_tabs }}
      </div>
    </div>
  {% endif %}
  {% endblock tabs %}
</section>
{% endblock header %}
{% block main %}
{# Main section #}
<section class="section">
  <main role="main" class="container">
    <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}

    {{ page.highlighted }}
    {{ page.help }}

    <div class="columns is-centered">
      {% block main_content %}
      {# Set attributes for content. #}
      {% if not page.content_attributes %}
      {%
        set page = page|merge({
          'content_attributes': create_attribute().addClass([
            'main-content',
            'column',
          ]),
        })
      %}
      {% endif %}
      {# Main content #}
      <div{{page.content_attributes}}>
        {{ page.content }}
      </div>
      {% endblock main_content %}
      {% block sidebar_first %}
      {# Sidebar first #}
      {% if page.sidebar_first %}
      {# Set attributes for content. #}
        {% if not page.sidebar_first_attributes %}
        {%
          set page = page|merge({
            'sidebar_first_attributes': create_attribute().addClass([
              'sidebar-first',
              'column',
              'is-2',
            ]),
          })
        %}
        {% endif %}
        <aside{{page.sidebar_first_attributes|without('role')}} role="complimentary">
          {{ page.sidebar_first }}
        </aside>
      {% endif %}
      {% endblock sidebar_first %}
    </div>
    {{ page.content_bottom }}
  </main>
</section>
{% endblock main %}
{% block footer %}
{% if page.footer or page.footer_menus or page.footer_info or page.footer_notice%}
  <footer role="contentinfo" class="footer">
    <div class="container">
      {{ page.footer }}
      <div class="columns">
        {% if page.footer_menus %}
          {{ page.footer_menus }}
        {% endif %}
        {% if page.footer_info %}
          <div class="column"></div>
          {{ page.footer_info }}
        {% endif %}
      </div>
      {% if page.footer_notice %}
        {{ page.footer_notice }}
      {% endif %}
    </div>
  </footer>
{% endif %}
{% endblock footer %}