mirror of
				https://github.com/em-squared/5e-drs.git
				synced 2025-10-31 13:34: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
	
	 Maxime Moraine
						Maxime Moraine