mirror of
https://github.com/pengzhanbo/vuepress-theme-plume.git
synced 2026-04-26 11:38:15 +08:00
34 lines
770 B
Vue
34 lines
770 B
Vue
<script lang="ts" setup>
|
|
import { useThemeLocaleData } from '../../composables/themeData.js'
|
|
import NavBarMenuGroup from './NavBarMenuGroup.vue'
|
|
import NavBarMenuLink from './NavBarMenuLink.vue'
|
|
|
|
const theme = useThemeLocaleData()
|
|
</script>
|
|
|
|
<template>
|
|
<nav
|
|
v-if="theme.navbar"
|
|
aria-labelledby="main-nav-aria-label"
|
|
class="navbar-menu"
|
|
>
|
|
<span id="main-nav-aria-label" class="visually-hidden">Main Navigation</span>
|
|
<template v-for="item in theme.navbar" :key="item.text">
|
|
<NavBarMenuLink v-if="'link' in item" :item="item" />
|
|
<NavBarMenuGroup v-else :item="item" />
|
|
</template>
|
|
</nav>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.navbar-menu {
|
|
display: none;
|
|
}
|
|
|
|
@media (min-width: 768px) {
|
|
.navbar-menu {
|
|
display: flex;
|
|
}
|
|
}
|
|
</style>
|