designtopack/src/App.vue

<template>
  <h1 v-if="page" class="sr-only">{{ page.content.title }}</h1>
  <div :class="{ 'with-sidebar': page?.template !== 'login' }">
    <Menu v-if="isLogged" />
    <RouterView />
  </div>
</template>

<script setup>
import { storeToRefs } from 'pinia';
import Menu from './components/Menu.vue';
import { usePageStore } from './stores/page';
import { detect } from 'detect-browser';
import { useUserStore } from './stores/user';

const browser = detect();

if (browser) {
  document.querySelector(
    'html'
  ).dataset.browser = `${browser.name} ${browser.version} ${browser.os}`;
}
const { page } = storeToRefs(usePageStore());
const { isLogged } = storeToRefs(useUserStore());
</script>