myprojplanet_vite/src/components/MyFooter/MyFooter.vue

<template>
  <q-footer
    v-if="tools.isUserOk() && site && site.confpages"
    :class="($q.dark.isActive ? `bg-black` : `bg-white`) +  `small-screen-only`"
    bordered
  >
    <q-tabs
      dense
      :class="($q.dark.isActive ? `text-white bg-black` : `text-grey-10 bg-white`) + ` mylabfooter mysmalltabs`"
      style="padding: 0px !important;"
      content-class="mysmalltabs"
      :active-color="$q.dark.isActive ? `primary`: `primary`"
      no-caps
      indicator-color="transparent"
    >
      <q-route-tab
        v-if="site.confpages.showButtHome"
        to="/"
        class="mylabfooter"
        :label="$t('tabdown.home')"
        icon="fas fa-home"
      />
      <q-route-tab
        v-if="site.confpages.showViewGroups"
        class="mylabfooter"
        :label="$t('tabdown.groups')"
        to="/groups"
        icon="fas fa-users"
      />
      <q-route-tab
        v-if="site.confpages.showViewCircuits"
        class="mylabfooter"
        :label="$t('tabdown.circuits')"
        to="/circuits"
        icon="fas fa-coins"
      />
      <q-route-tab
        v-if="site.confpages.showViewUsers"
        class="mylabfooter"
        :label="$t('tabdown.friends')"
        to="/friends"
        icon="fas fa-user-friends"
      />
      <q-route-tab
        v-if="site.confpages.bookingEvents"
        class="mylabfooter"
        :label="$t('tabdown.bookings')"
        to="/admin/eventlist"
        icon="fas fa-calendar-plus"
      />
      <q-route-tab
        v-if="site.confpages.showViewProfile"
        class="mylabfooter"
        :label="$t('tabdown.profile')"
        :to="`/my/`+getMyUsername()"
        icon="person"
      />
    </q-tabs>
  </q-footer>
</template>

<script lang="ts" src="./MyFooter.ts">
</script>

<style lang="scss" scoped>
@import './MyFooter.scss';
</style>