glowing-fiesta-original/app/layouts/default/Sidebar.vue

45 lines
1.2 KiB
Vue

<script setup lang="ts">
import {
Sidebar,
SidebarContent,
SidebarFooter,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarRail,
type SidebarProps,
} from "~/components/ui/sidebar";
import { HandCoins } from "lucide-vue-next";
const props = withDefaults(defineProps<SidebarProps>(), {
collapsible: "icon",
});
</script>
<template>
<Sidebar v-bind="props">
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton size="lg" as-child>
<NuxtLink to="/">
<div
class="flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground"
>
<HandCoins class="size-4" />
</div>
<div class="flex flex-col gap-0.5 leading-none">
<span class="font-medium">Glowing Fiesta</span>
<span class="">v1.0.0</span>
</div>
</NuxtLink>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
<SidebarContent></SidebarContent>
<SidebarFooter></SidebarFooter>
<SidebarRail></SidebarRail>
</Sidebar>
</template>