<footer>
  <div class="mt-8 pt-8 pb-4 flex gap-3 justify-center w-full">
    {% include "icons/fastmail.liquid" %}
    {% include "icons/github.liquid" %}
    {% include "icons/mastodon.liquid" %}
    {% include "icons/lastfm.liquid" %}
    {% include "icons/instapaper.liquid" %}
    {% include "icons/letterboxd.liquid" %}
    {% include "icons/trakt.liquid" %}
    {% include "icons/oku.liquid" %}
  </div>
  <p class="text-sm text-gray-500 dark:text-gray-100 text-center pb-8">
    <a class="text-gray-700 hover:text-purple-500 dark:text-gray-200 dark:hover:text-purple-500{% if page.url == '/uses/' %} active{% endif %}" href="/uses">Uses</a>
    •
    <a class="text-gray-700 hover:text-purple-500 dark:text-gray-200 dark:hover:text-purple-500{% if page.url == '/referrals/' %} active{% endif %}" href="/referrals">Referrals</a>
    • Cory Dransfeldt • © {{ "now" | date: "%Y" }}</p>
</footer>
