mirror of
https://github.com/maciejpedzich/spotifyplaylistarchive.com.git
synced 2024-09-19 18:16:19 +02:00
Create a page navigation bar
This commit is contained in:
parent
57e384e45a
commit
3725b558e4
35
components/NavBar.vue
Normal file
35
components/NavBar.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<script setup lang="ts">
|
||||
import Menubar from 'primevue/menubar';
|
||||
|
||||
interface MenuItem {
|
||||
label: string;
|
||||
icon: string;
|
||||
to?: string;
|
||||
visible?: boolean;
|
||||
command?(): unknown;
|
||||
}
|
||||
|
||||
const items = computed<MenuItem[]>(() => [
|
||||
{
|
||||
label: 'Home',
|
||||
icon: 'pi pi-home',
|
||||
to: '/'
|
||||
},
|
||||
{
|
||||
label: 'About',
|
||||
icon: 'pi pi-info-circle',
|
||||
to: '/about'
|
||||
}
|
||||
]);
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Menubar
|
||||
:model="items"
|
||||
class="fixed z-5 top-0 w-full justify-content-between md:justify-content-start"
|
||||
>
|
||||
<template #start>
|
||||
<strong class="px-2 md:px-5">Spotify Playlist Archive</strong>
|
||||
</template>
|
||||
</Menubar>
|
||||
</template>
|
Loading…
Reference in New Issue
Block a user