{# Previous/Next article navigation #}
<!-- #Article navigation -->
<nav class="clear-both py-8">
  <ul class="text-secondary-content flex justify-between gap-4">
    <li class="flex flex-col gap-1">
      {% if prev %}
        <span class="flex items-center text-xs font-light">
          <span class="icon-[prime--angle-left]"></span>
          {{ _('Previous') }}
        </span>
        <a
          class="hover:text-accent-content pl-1 text-sm underline"
          href="{{ prev.link|e }}"
          title="{{ _('Previous article') }}"
          >{{ prev.title }}</a
        >
      {% endif %}
    </li>
    <li class="flex flex-col gap-1 lg:items-end">
      {% if next %}
        <span class="flex items-center text-xs font-light">
          {{ _('Next') }}
          <span class="icon-[prime--angle-right]"></span>
        </span>
        <a
          class="hover:text-accent-content pr-1 text-sm underline"
          href="{{ next.link|e }}"
          title="{{ _('Next article') }}"
          >{{ next.title }}</a
        >
      {% endif %}
    </li>
  </ul>
</nav>
<!-- .#Article navigation -->