{# -*- coding: utf-8 -*-

  This file is part of Invenio.
  Copyright (C) 2015-2018 CERN.
  Copyright (C) 2021 New York University.
  Copyright (C) 2022 TU Wien.

  Invenio is free software; you can redistribute it and/or modify it
  under the terms of the MIT License; see LICENSE file for more details.
#}

{%- extends config.THEME_BASE_TEMPLATE %}

{%- block page_body scoped %}

<div class="ui container fluid page-subheader-outer compact ml-0-mobile mr-0-mobile">
  <div class="ui container page-subheader">
    <h1 class="ui large header">{{_("My account")}}</h1>
  </div>
</div>

<div class="ui grid container stackable">
  <nav class="five wide tablet four wide computer column" aria-label="{{ _('Account settings') }}">

    {%- block settings_menu scoped %}
      <div class="ui vertical menu fluid">
        <strong class="header item">{{ _('Settings') }}</strong>
        {%- for item in current_menu.submenu('settings').children if item.visible %}

          {%- block settings_menu_item scoped %}
            <a
              href="{{ item.url }}"
              class="brand item {% if item.active %}active{% endif %}"
              {% if item.active %} aria-current="page" {% endif %}
            >
              {{ item.text|safe }}
            </a>
          {%- endblock %}

        {%- endfor %}
      </div>
    {%- endblock %}

  </nav>

  <article class="eleven wide tablet twelve wide computer column">

    {%- block settings_content scoped %}
      <section aria-label="{{ _(panel_title|default('')) }}" class="ui segments">
        <div class="ui segment secondary">

          {%- block settings_content_title scoped %}
            {%- if panel_icon %}

              {%- block settings_content_title_icon scoped %}
                <i class="{{ panel_icon }}" aria-hidden="true"></i>
              {%- endblock %}

            {%- endif %}
            <h2 class="ui tiny header inline-block m-0">{{ panel_title|default("") }}</h2>
          {%- endblock %}

        </div>

        {%- block settings_body scoped %}
          <div class="ui segment">
            {%- block settings_form scoped %}
            {%- endblock settings_form %}
          </div>
        {%- endblock settings_body %}

        </section>
    {%- endblock %}

  </article>
</div>

{%- endblock %}
