60 lines
1.3 KiB
Vue
60 lines
1.3 KiB
Vue
<template>
|
|
<v-navigation-drawer v-model="showMenuBar" v-if="showMenuBar" app :clipped="$vuetify.breakpoint.mdAndUp">
|
|
<v-list dense>
|
|
<v-list-item link>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-home</v-icon>
|
|
</v-list-item-action>
|
|
<v-list-item-content>
|
|
<v-list-item-title>Home</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
<v-list-item link>
|
|
<v-list-item-action>
|
|
<v-icon>mdi-contact-mail</v-icon>
|
|
</v-list-item-action>
|
|
<v-list-item-content>
|
|
<v-list-item-title>Contact</v-list-item-title>
|
|
</v-list-item-content>
|
|
</v-list-item>
|
|
</v-list>
|
|
</v-navigation-drawer>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
export default {
|
|
name: "NavigationBar",
|
|
props: ["showMenu"],
|
|
data: () => ({
|
|
drawer: false,
|
|
group: null,
|
|
menuItems: [
|
|
"Notes & Cards",
|
|
"Wedding",
|
|
"Business",
|
|
"For the Desk",
|
|
"For the Home",
|
|
"Occasions",
|
|
"Crane & Co",
|
|
"",
|
|
"Store Locator",
|
|
"Sign-In"
|
|
]
|
|
}),
|
|
computed: {
|
|
showMenuBar: {
|
|
get: function() {
|
|
return this.showMenu;
|
|
},
|
|
set: function(value) {
|
|
this.showMenu = value;
|
|
}
|
|
}
|
|
},
|
|
watch: {}
|
|
};
|
|
</script>
|
|
|
|
<style src="./MobileNavigationBar.scss" lang="scss"/>
|