mirror of
https://github.com/em-squared/5e-drs.git
synced 2025-10-30 05:04:21 +00:00
ajout d'un bouton de repli pour la navigation de droite
This commit is contained in:
parent
83ebe6d06b
commit
f778d69981
5 changed files with 36 additions and 7 deletions
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<v-app-bar :clipped-left="$vuetify.breakpoint.lgAndUp" :clipped-right="$vuetify.breakpoint.lgAndUp" :hide-on-scroll="$vuetify.breakpoint.mdAndDown" app color="#563f5a" dark>
|
<v-app-bar :clipped-left="$vuetify.breakpoint.lgAndUp" :clipped-right="$vuetify.breakpoint.lgAndUp" :hide-on-scroll="$vuetify.breakpoint.mdAndDown" scroll-threshold="60" app color="#563f5a" dark>
|
||||||
<v-app-bar-nav-icon @click.stop="setDrawer" />
|
<v-app-bar-nav-icon @click.stop="setDrawer" />
|
||||||
<v-toolbar-title class="ml-0 mr-4 pl-4">
|
<v-toolbar-title class="ml-0 mr-4 pl-4">
|
||||||
<v-btn class="hidden-sm-and-down site-title" text link :to="{ path: '/' }"><img src="/dragon_blanc.svg" /> {{ $site.title }}</v-btn>
|
<v-btn class="hidden-sm-and-down site-title" text link :to="{ path: '/' }"><img src="/dragon_blanc.svg" /> {{ $site.title }}</v-btn>
|
||||||
|
|
@ -12,7 +12,7 @@
|
||||||
<v-btn class="hidden-sm-and-down" @click.stop="toggleAboutDialog" icon>
|
<v-btn class="hidden-sm-and-down" @click.stop="toggleAboutDialog" icon>
|
||||||
<v-icon>mdi-information</v-icon>
|
<v-icon>mdi-information</v-icon>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
<v-btn @click.stop="setRightDrawer" icon v-if="hasRightDrawer">
|
<v-btn class="ml-5" @click.stop="setRightDrawer" icon v-if="hasRightDrawer">
|
||||||
<v-icon>{{ rightDrawerIcon }}</v-icon>
|
<v-icon>{{ rightDrawerIcon }}</v-icon>
|
||||||
</v-btn>
|
</v-btn>
|
||||||
</v-app-bar>
|
</v-app-bar>
|
||||||
|
|
@ -52,7 +52,7 @@ export default {
|
||||||
if (this.inRightDrawer == 'pageToc') {
|
if (this.inRightDrawer == 'pageToc') {
|
||||||
return 'mdi-format-list-bulleted'
|
return 'mdi-format-list-bulleted'
|
||||||
} else if (this.inRightDrawer == 'spellFilters' || this.inRightDrawer == 'monsterFilters' || this.inRightDrawer == 'magicItemFilters') {
|
} else if (this.inRightDrawer == 'spellFilters' || this.inRightDrawer == 'monsterFilters' || this.inRightDrawer == 'magicItemFilters') {
|
||||||
return 'mdi-filter-variant'
|
return 'mdi-filter'
|
||||||
}
|
}
|
||||||
return 'mdi-menu'
|
return 'mdi-menu'
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -15,6 +15,12 @@
|
||||||
</v-row>
|
</v-row>
|
||||||
|
|
||||||
</v-container>
|
</v-container>
|
||||||
|
|
||||||
|
<v-btn v-show="$vuetify.breakpoint.lgAndUp" color="primary" @click.stop="setRightDrawer" :class="rightDrawerButtonCSS()" small top right fixed fab>
|
||||||
|
<v-icon v-if="$store.state.rightDrawer">mdi-chevron-right</v-icon>
|
||||||
|
<v-icon v-else left>mdi-chevron-left</v-icon>
|
||||||
|
</v-btn>
|
||||||
|
|
||||||
<v-fab-transition>
|
<v-fab-transition>
|
||||||
<v-btn color="primary" class="d-print-none" fab bottom right fixed @click="toTop" v-show="toTopButton" v-scroll="onScroll">
|
<v-btn color="primary" class="d-print-none" fab bottom right fixed @click="toTop" v-show="toTopButton" v-scroll="onScroll">
|
||||||
<v-icon class="d-print-none">mdi-chevron-up</v-icon>
|
<v-icon class="d-print-none">mdi-chevron-up</v-icon>
|
||||||
|
|
@ -51,6 +57,9 @@ export default {
|
||||||
RightDrawer
|
RightDrawer
|
||||||
},
|
},
|
||||||
|
|
||||||
|
computed: {
|
||||||
|
},
|
||||||
|
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
cookieConsentDialog: true,
|
cookieConsentDialog: true,
|
||||||
|
|
@ -126,7 +135,18 @@ export default {
|
||||||
|
|
||||||
toTop () {
|
toTop () {
|
||||||
this.$vuetify.goTo(0)
|
this.$vuetify.goTo(0)
|
||||||
}
|
},
|
||||||
|
|
||||||
|
rightDrawerButtonCSS () {
|
||||||
|
if (this.$store.state.rightDrawer) {
|
||||||
|
return 'right-drawer-button right-drawer-button-open'
|
||||||
|
}
|
||||||
|
return 'right-drawer-button right-drawer-button-close'
|
||||||
|
},
|
||||||
|
|
||||||
|
setRightDrawer () {
|
||||||
|
this.$store.commit('setRightDrawer', !this.$store.state.rightDrawer)
|
||||||
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
@ -138,4 +158,13 @@ export default {
|
||||||
.footer-padding-right {
|
.footer-padding-right {
|
||||||
padding-right: 300px;
|
padding-right: 300px;
|
||||||
}
|
}
|
||||||
|
.right-drawer-button {
|
||||||
|
top: 150px !important;
|
||||||
|
}
|
||||||
|
.right-drawer-button-open {
|
||||||
|
right: 280px !important;
|
||||||
|
}
|
||||||
|
.right-drawer-button-close {
|
||||||
|
right: -20px !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ school: "Enchantement"
|
||||||
level: 0
|
level: 0
|
||||||
concentration: true
|
concentration: true
|
||||||
casting_time: "1 action"
|
casting_time: "1 action"
|
||||||
duration: "jusqu'à 1 minutes"
|
duration: "jusqu'à 1 minute"
|
||||||
range: "personnelle"
|
range: "personnelle"
|
||||||
components:
|
components:
|
||||||
verbal: true
|
verbal: true
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ school: "Abjuration"
|
||||||
level: 8
|
level: 8
|
||||||
concentration: true
|
concentration: true
|
||||||
casting_time: "1 action"
|
casting_time: "1 action"
|
||||||
duration: "jusqu'à 1 minutes"
|
duration: "jusqu'à 1 minute"
|
||||||
range: "personnelle"
|
range: "personnelle"
|
||||||
components:
|
components:
|
||||||
verbal: true
|
verbal: true
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ school: "Évocation"
|
||||||
level: 6
|
level: 6
|
||||||
concentration: true
|
concentration: true
|
||||||
casting_time: "1 action"
|
casting_time: "1 action"
|
||||||
duration: "jusqu'à 10 minute"
|
duration: "jusqu'à 10 minutes"
|
||||||
range: "27 mètres"
|
range: "27 mètres"
|
||||||
components:
|
components:
|
||||||
verbal: true
|
verbal: true
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue