89 lines
2.1 KiB
Vue
89 lines
2.1 KiB
Vue
<template>
|
|
<aside class="relative h-full overflow-y-auto custom-scrollbar">
|
|
|
|
<nav class="h-full grid grid-rows-[60px_1fr_auto]">
|
|
<div></div>
|
|
<div class="pt-4 px-4">
|
|
<h2>Subscriptions</h2>
|
|
|
|
<ul class="space-y">
|
|
<li>
|
|
<RouterLink to="/@hutopy">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
Hutopy
|
|
</div>
|
|
</RouterLink>
|
|
|
|
<RouterLink to="/@leffet">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
L'Effet
|
|
</div>
|
|
</RouterLink>
|
|
|
|
<RouterLink to="/@chloebeaugrand">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
Chloe Beaugrand
|
|
</div>
|
|
</RouterLink>
|
|
|
|
<RouterLink to="/@guillaumeaime">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
Guillaume Aime
|
|
</div>
|
|
</RouterLink>
|
|
|
|
<RouterLink to="/@mathieucaron">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
Mathieu Caron
|
|
</div>
|
|
</RouterLink>
|
|
|
|
<RouterLink to="/@arps">
|
|
<div class="nav-button">
|
|
<v-icon class="mx-2">mdi-account</v-icon>
|
|
ARPS
|
|
</div>
|
|
</RouterLink>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="border-t w-full py-10">
|
|
<SiteMenu></SiteMenu>
|
|
</div>
|
|
</nav>
|
|
</aside>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.nav-button {
|
|
@apply rounded p-1 m-1 text-gray-800 font-sans;
|
|
}
|
|
|
|
.nav-button:hover {
|
|
@apply bg-[#903175] text-gray-200;
|
|
}
|
|
|
|
h2 {
|
|
@apply font-sans font-bold ml-2;
|
|
}
|
|
|
|
aside {
|
|
@apply relative;
|
|
}
|
|
|
|
.custom-scrollbar {
|
|
scrollbar-width: thin;
|
|
scrollbar-color: #903175 #f1f1f1;
|
|
}
|
|
</style>
|
|
|
|
<script setup lang="ts">
|
|
import SiteMenu from "@/views/main/SiteMenu.vue";
|
|
</script>
|