inspin.io/components/Footer.vue

<script setup>
  const route = useRoute()

  const { isMobile, isDesktopOrTablet } = useDevice();

  let hidden = ['/login', '/dashboard']
</script>

<template>
  <footer v-if="!hidden.includes(route.path)" >

    <div class="top">
      <ul class="message">
        <li><NuxtLink to="/" class="logo"><img src="/img/logo.svg" alt="inspin digital"></NuxtLink></li>
        <li><p>Creating a more decentralized web.</p></li>
      </ul>
      <ul class="about">
        <li><h4>Products</h4></li>
        <li><NuxtLink to="/products/tinysites">Tinysites</NuxtLink></li>
        <li><NuxtLink to="/products/parked">Parked</NuxtLink></li>
        <!-- <li><NuxtLink to="/products/runners">Runners</NuxtLink></li> -->
        <li class="catch"><NuxtLink to="/products">View all products</NuxtLink></li>
      </ul>
      <ul class="resources">
        <li><h4>Resources</h4></li>
        <li><NuxtLink to="/status">Service Status</NuxtLink></li>
        <li><NuxtLink to="/help">Help Center</NuxtLink></li>
        <li class="catch"><NuxtLink to="/resources">View all resources</NuxtLink></li>
      </ul>
      <!--
        <ul class="about">
          <li><h4>About Us</h4></li>
          <li><NuxtLink to="/culture">Culture</NuxtLink></li>
          <li><NuxtLink to="/security">Trust & Security</NuxtLink></li>
          <li class="catch"><NuxtLink to="/contact">Contact us</NuxtLink></li>
        </ul>
      -->
    </div>

    <div class="bottom" v-if="isDesktopOrTablet">
      <div class="center">
        <ul class="legal">
          <li><p><span class="icon-copyright"></span> Inspin Digital LLC. All Rights Reserved.</p></li>
          <li><NuxtLink to="/legal/privacy">Privacy Policy</NuxtLink></li>
          <li><NuxtLink to="/legal/user-agreement">User Agreement</NuxtLink></li>
        </ul>
        <ul class="social">
          <li><NuxtLink to="https://git.inspin.io/inspin" target="_BLANK" 
            aria-label="git"><span class="icon-git"></span></NuxtLink></li>
          <li><NuxtLink to="https://x.com/InspinHQ" target="_BLANK" 
            aria-label="x"><span class="icon-x"></span></NuxtLink></li>
          <li><NuxtLink to="https://gab.com/InspinHQ" target="_BLANK" 
            aria-label="gab"><span class="icon-gab"></span></NuxtLink></li>
          <li><NuxtLink to="https://njump.me/npub1nvdr4aeamnswzzm7a5w2w9a0jfy3qqhqa7dy9jhxlyzg0yjq58wsftqtlh" target="_BLANK" 
            aria-label="nostr"><span class="icon-zap"></span></NuxtLink></li>
          <li><NuxtLink to="https://dribbble.com/inspin" target="_BLANK" 
            aria-label="dribbble"><span class="icon-dribbble"></span></NuxtLink></li>
        </ul>
      </div>
    </div>

    <div class="bottom" v-if="isMobile">
      <h4>Social media</h4>
      <ul class="social">
        <li><NuxtLink to="https://git.inspin.io/inspin" target="_BLANK" 
          aria-label="git"><span class="icon-git"></span></NuxtLink></li>
        <li><NuxtLink to="https://x.com/InspinHQ" target="_BLANK" 
          aria-label="x"><span class="icon-x"></span></NuxtLink></li>
        <li><NuxtLink to="https://gab.com/InspinHQ" target="_BLANK" 
          aria-label="gab"><span class="icon-gab"></span></NuxtLink></li>
        <li><NuxtLink to="https://njump.me/npub1nvdr4aeamnswzzm7a5w2w9a0jfy3qqhqa7dy9jhxlyzg0yjq58wsftqtlh" target="_BLANK" 
          aria-label="nostr"><span class="icon-zap"></span></NuxtLink></li>
        <li><NuxtLink to="https://dribbble.com/inspin" target="_BLANK" 
          aria-label="dribbble"><span class="icon-dribbble"></span></NuxtLink></li>
      </ul>
      <ul class="legal">
        <li><NuxtLink to="/legal/privacy">Privacy Policy</NuxtLink></li>
        <li><NuxtLink to="/legal/user-agreement">User Agreement</NuxtLink></li>
        <li class="copy"><p><span class="icon-copyright"></span> Inspin Digital LLC. All Rights Reserved.</p></li>
      </ul>
    </div>

  </footer>
</template>