<template>
  <div class="d-flex flex-row" :class="!hasLateralMenu ? 'pl-4' : ''">
    <a
      :href="homeUrl"
      :title="$t('go_back_home')"
      class="d-flex flex-row align-center"
    >
      <v-img src="/favicon.ico" height="42" width="42" class="mr-2" />
      <span v-if="mdAndUp"><slot /></span>
    </a>
  </div>
</template>

<script setup lang="ts">
import { useDisplay } from 'vuetify'
import { useHomeUrl } from '~/composables/utils/useHomeUrl'

const props = defineProps({
  hasLateralMenu: {
    type: Boolean,
    required: false,
    default: true,
  },
})

const { homeUrl } = useHomeUrl()
const { mdAndUp } = useDisplay()
</script>

<style scoped lang="scss">
a {
  color: rgb(var(--v-theme-on-primary)) !important;
  text-decoration: none;
}
</style>
