obsidian-visualiser/app.vue

36 lines
2.0 KiB
Vue

<script setup lang="ts">
const layout = ref();
const toggled = ref(false);
</script>
<template>
<div class="bg-light-0 dark:bg-dark-0">
<div class="bg-light-0 dark:bg-dark-0 px-12 py-3 sticky top-0 z-40 w-full flex align-middle justify-between lg:z-50 border-b gap-12 border-light-30 dark:border-dark-30">
<div class="flex flex-auto items-stretch gap-12">
<NuxtLink class="text-lg flex align-center font-semibold text-light-100 dark:text-dark-100 hover:text-opacity-70" aria-label="Accueil" :to="{ path: '/', force: true }"><ThemeIcon icon="logo" :width=40 :height=40 /></NuxtLink>
<NuxtLink class="text-lg flex align-center font-semibold text-light-100 dark:text-dark-100 hover:text-opacity-70" aria-label="Projets" :to="{ path: `/explorer`, force: true }">Projets</NuxtLink>
<NuxtLink class="text-lg flex align-center font-semibold text-light-100 dark:text-dark-100 hover:text-opacity-70" aria-label="Editeur" :to="{ path: '/editing', force: true }">Editeur</NuxtLink>
</div>
<div class="flex-auto"><SearchView /></div>
<div class="flex flex-auto align-center gap-6 justify-end">
<ThemeSwitch />
<NuxtLink class="" :to="{ path: '/user/profile', force: true }"><ThemeIcon icon="user" :width=32 :height=32 /></NuxtLink>
</div>
</div>
<NuxtLayout ref="layout">
<template #mobile>
<div class="">
<NuxtLink class="" aria-label="Accueil" :to="{ path: '/', force: true }">Accueil</NuxtLink>
<NuxtLink class="" aria-label="Projets" :to="{ path: `/explorer`, force: true }" active-class="">Projets</NuxtLink>
<NuxtLink class="" aria-label="Editeur" :to="{ path: '/editing', force: true }" active-class="">Editeur</NuxtLink>
</div>
</template>
<NuxtPage/>
</NuxtLayout>
<div class="">
<p>Copyright Peaceultime - 2024</p>
<NuxtLink :to="{ path: '/third-party', force: true }">Applications tierces et crédits</NuxtLink>
</div>
</div>
</template>