{% load i18n static wagtailcore_tags %}

{# Translators: accessibility text label for footer site navigation #}
{% translate "footer navigation" as footer_nav_label %}
<nav id="footer-nav">
    <ul role="menu">
        <li class="menu-item" role="none">
            {% if not skip_nav %}
                {% pageurl site.root_page.localized as root_url %}
            {% endif %}
            {# Translators: label for 'home' link in footer navigation #}
            <a href="{{ root_url|default:"/" }}" role="menuitem"{% if not skip_nav and request.path == root_url %} aria-current="page"{% endif %}>{% translate "Home" %}</a>
        </li>
        {% include "snippets/menu.html" %}
    </ul>
</nav>

<ul id="footer-links">
    <li>
        {# Translators: accessibility label for Princeton Geniza Lab homepage, for footer #}
        <a class="logo" href="https://genizalab.princeton.edu/" aria-label="{% translate 'Princeton Geniza Lab homepage' %}">
            <svg id="pgl-logo">
                <use href="{% static 'img/logos/all/all/pgl-logo.svg' %}#pgl-logo" />
            </svg>
        </a>
        <ul class="social">
            <li>
                {% blocktranslate asvar follow_genizalab_twitter with username="GenizaLab" %}Follow {{ username }} on Twitter.{% endblocktranslate %}
                <a class="twitter" href="https://twitter.com/GenizaLab" aria-label="{{ follow_genizalab_twitter }}">GenizaLab</a>
            </li>
        </ul>
    </li>
    <li>
        {# Translators: accessibility label for Princeton CDH homepage, for footer #}
        <a class="logo" href="https://cdh.princeton.edu/" aria-label="{% translate 'Princeton Center for Digital Humanities homepage' %}">
            <svg id="cdh-logo">
                <use href="{% static 'img/logos/all/all/cdh-logo.svg' %}#cdh-logo" />
            </svg>
        </a>
        <ul class="social">
            <li>
                {% blocktranslate asvar follow_cdh_twitter with username="PrincetonDH" %}Follow {{ username }} on Twitter.{% endblocktranslate %}
                <a class="twitter" href="https://twitter.com/PrincetonDH" aria-label="{{ follow_cdh_twitter }}">PrincetonDH</a>
            </li>
            <li>
                {% blocktranslate asvar follow_cdh_insta with username="princetoncdh" %}Follow {{ username }} on Instagram.{% endblocktranslate %}
                <a class="instagram" href="https://www.instagram.com/princetoncdh/" aria-label="{{ follow_cdh_insta }}">princetoncdh</a>
            </li>
        </ul>
    </li>
</ul>
<ul id="legal">
    <li>
        <a href="https://accessibility.princeton.edu/help" id="accessibility">
            {# Translators: link label for Princeton accessibility assistance page, for footer #}
            {% translate 'Accessibility' %}
        </a>
    </li>
    <li id="copyright">
        {# Translators: official name of Princeton University's board of trustees, for footer #}
        <span>{% now 'Y' %} {% translate 'The Trustees of Princeton University' %}</span>
    </li>
    <li id="license">
        {# Translators: Creative Commons license text, for footer #}
        {% translate 'Creative Commons CC-BY license' as license_text %}
        <a href="https://creativecommons.org/licenses/by/2.0/" aria-label="{{ license_text }}">
            <img src="{% static 'img/icons/license-icon.svg' %}" width="32" height="16" alt="{{ license_text }}" />
        </a>
    </li>
    <li id="issn">
        {# Translators: International Standard Serial Number (ISSN), for footer #}
        <span>{% translate 'ISSN: 2834-4146' %}</span>
    </li>
    <li id="sw-version">
        {# Translators: software version, for footer #}
        {% translate 'software version' as version_text %}
        <a href="https://github.com/Princeton-CDH/geniza/" aria-label="{{ version_text }}">
            v. {{ SW_VERSION }}
        </a>
    </li>
    <li>
        {# Translators: official name of Princeton University, for footer #}
        <a href="https://princeton.edu/" aria-label="{% translate 'Princeton University homepage' %}">
            <svg id="princeton-logo">
                <use href="{% static 'img/logos/all/all/princeton-logo.svg' %}#princeton-logo" />
            </svg>
        </a>
    </li>
</ul>