github/mealie
1
0
Fork 0
mirror of https://github.com/hay-kot/mealie.git synced 2025-08-22 14:33:33 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions 20

Fixed navbar on mobile

Browse source
This commit is contained in:
hay-kot 2021-02-18 18:25:49 -09:00
commit a56d4f6d11
1 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/components/UI/CategorySidebar.vue
View file

@ -1,5 +1,5 @@
<template> <template>
<v-navigation-drawer width="175px" clipped app permanent expand-on-hover> <v-navigation-drawer width="175px" clipped app :expand-on-hover="!mobile">
<v-list nav dense> <v-list nav dense>
<v-list-item v-for="nav in links" :key="nav.title" link :to="nav.to"> <v-list-item v-for="nav in links" :key="nav.title" link :to="nav.to">
<v-list-item-icon> <v-list-item-icon>
@ -34,6 +34,16 @@ export default {
allCategories() { allCategories() {
return this.$store.getters.getCategories; return this.$store.getters.getCategories;
}, },
mobile() {
switch (this.$vuetify.breakpoint.name) {
case "xs":
return true;
case "sm":
return true;
default:
return false;
}
},
}, },
watch: { watch: {
allCategories() { allCategories() {
@ -48,7 +58,7 @@ export default {
async buildSidebar() { async buildSidebar() {
this.links = []; this.links = [];
this.links.push(...this.baseLinks); this.links.push(...this.baseLinks);
this.allCategories.forEach(async (element) => { this.allCategories.forEach(async element => {
this.links.push({ this.links.push({
title: element.name, title: element.name,
to: `/recipes/${element.slug}`, to: `/recipes/${element.slug}`,