<footer id="footer" class="grid">
  <section class="grid-row">
      <ul class="grid-cell x2 footer-list">
        <li class="footer-item{% if request.url_rule.endpoint == 'index' %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('index') }}">
            Home
          </a>
        </li>
        <li class="footer-item{% if request.url_rule.endpoint == 'show_issues' %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('show_issues') }}">
            List of issues
          </a>
        </li>
        <li class="footer-item{% if request.url_rule.endpoint == 'about' %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('about') }}">
            About
          </a>
        </li>
        <li class="footer-item{% if 'contributors' in request.url_rule.endpoint %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('contributors') }}">
            Contribute
          </a>
        </li>
        <li class="footer-item{% if request.url_rule.endpoint == 'contact' %} active{% endif %}">
          <a class="footer-item-link" href="/contact">
            Contact
          </a>
        </li>
        <li class="footer-item{% if request.url_rule.endpoint == 'privacy' %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('privacy') }}">
            Privacy Policy
          </a>
        </li>
       <li class="footer-item{% if request.url_rule.endpoint == 'terms' %} active{% endif %}">
          <a class="footer-item-link" href="{{ url_for('terms') }}">
            Terms of Service
          </a>
        </li>
        <li class="footer-item">
          <a class="footer-item-link" href="https://github.com/webcompat/webcompat.com/blob/master/CODE_OF_CONDUCT.md">
            Code of Conduct
          </a>
        </li>
      </ul>

<!-- sub nav for contribute > working with bugs -->
      {% if 'contributors_bug_' in request.url_rule.endpoint %}
        <ul class="grid-cell x1 footer-sub-list">
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_bug_report' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/report-bug">Report a Bug</a>
          </li>
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_bug_reproduce' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/reproduce-bug">Triage a bug</a>
          </li>
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_bug_diagnosis' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/diagnose-bug">Diagnose a Bug</a>
          </li>
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_bug_outreach' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/site-outreach">Site Outreach</a>
          </li>
        </ul>
      {% endif %}

<!-- sub nav for contribute > other contributions -->
      {% if 'contributors_other_' in request.url_rule.endpoint %}
        <ul class="grid-cell x1 footer-sub-list">
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_other_tools' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/build-tools">Build Tools</a>
          </li>
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_other_research' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/web-platform-research">Web Platform Research</a>
          </li>
          <li class="footer-sub-item {% if request.url_rule.endpoint == 'contributors_other_events' %}active{% endif %}">
            <a class="footer-item-link" href="/contributors/organize-webcompat-events">Organize Webcompat events</a>
          </li>
        </ul>
      {% endif %}

      <ul class="grid-cell x1 footer-sub-icons">
        <li class="footer-icon icon-twitter">
          <a class="footer-item-link" aria-label="Twitter (opens in a new tab)" href="https://twitter.com/webcompat/with_replies" target="_blank">
              <svg class="icon" role="presentation" viewBox="0 0 30 30" aria-hidden="true">
                  <use xlink:href="#svg-twitter" />
              </svg>
          </a>
        </li>
        <li class="footer-icon icon-twitter">
          <a class="footer-item-link" aria-label="GitHub (opens in a new tab)" href=" https://github.com/webcompat/webcompat.com/" target="_blank">
              <svg class="icon" role="presentation" viewBox="0 0 30 30" aria-hidden="true">
                  <use xlink:href="#svg-github2" />
              </svg>
          </a>
        </li>
      </ul>
  </section>
</footer>
