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

fixed category sidebar on mobile

Browse source
This commit is contained in:
hay-kot 2021-02-18 21:24:28 -09:00
commit 761e276ace
1 changed files with 32 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -1,20 +1,42 @@
<template> <template>
<v-navigation-drawer width="175px" clipped app :expand-on-hover="!mobile"> <div>
<v-list nav dense> <v-btn
<v-list-item v-for="nav in links" :key="nav.title" link :to="nav.to"> class="mt-9 ml-n1"
<v-list-item-icon> fixed
<v-icon>{{ nav.icon }}</v-icon> left
</v-list-item-icon> bottom
<v-list-item-title>{{ nav.title | titleCase }}</v-list-item-title> fab
</v-list-item> small
</v-list> color="primary"
</v-navigation-drawer> @click="showSidebar = !showSidebar"
>
<v-icon>mdi-tag</v-icon></v-btn
>
<v-navigation-drawer
:value="mobile ? showSidebar : true"
v-model="showSidebar"
width="175px"
clipped
app
>
<v-list nav dense>
<v-list-item v-for="nav in links" :key="nav.title" link :to="nav.to">
<v-list-item-icon>
<v-icon>{{ nav.icon }}</v-icon>
</v-list-item-icon>
<v-list-item-title>{{ nav.title | titleCase }}</v-list-item-title>
</v-list-item>
</v-list>
</v-navigation-drawer>
</div>
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
showSidebar: false,
links: [], links: [],
baseLinks: [ baseLinks: [
{ {