<template>
  <q-footer
    v-if="tools.isUserOk() && site"
    class="bg-white small-screen-only"
    bordered
  >
    <q-tabs
      dense
      class="text-grey-10 mylabfooter mysmalltabs"
      style="padding: 0px !important;"
      content-class="mysmalltabs"
      active-color="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>
