Menu clickable

This commit is contained in:
Laurent 2024-02-24 17:07:42 +00:00
parent e619db9643
commit 172d648568

View File

@ -1,22 +1,14 @@
<script>
// Il s'agit de la bar de navigation principale pour passer d'une vue a l'autre
</script>
<template> <template>
<v-app-bar :elevation="12"> <v-app-bar :elevation="12">
<!-- TODO: Ici je voudrai ouvrir un menu en cliquant sur le v-app-bar-nav-icon --> <!-- TODO: Ici je voudrai ouvrir un menu en cliquant sur le v-app-bar-nav-icon -->
<v-app-bar-nav-icon @click="menu = !menu"></v-app-bar-nav-icon> <v-app-bar-nav-icon v-on:click="menu = !menu"></v-app-bar-nav-icon>
<v-menu v-model="menu" offset-y> <v-menu v-model="menu">
<template v-slot:activator="{ on }">
<v-btn v-on="on" color="primary">Menu</v-btn>
</template>
<v-list> <v-list>
<v-list-item>Item 1</v-list-item> <v-list-item>Item 1</v-list-item>
<v-list-item>Item 2</v-list-item> <v-list-item>Item 2</v-list-item>
</v-list> </v-list>
</v-menu> </v-menu>
<v-app-bar-title>Brain Blast</v-app-bar-title> <v-app-bar-title>Brain Blast</v-app-bar-title>
<template v-slot:append> <template v-slot:append>
@ -26,11 +18,14 @@
</template> </template>
<script setup> <script setup>
import { ref } from 'vue'
import { useTheme } from 'vuetify' import { useTheme } from 'vuetify'
const theme = useTheme() const theme = useTheme()
let menu = ref(false)
function toggleTheme () { function toggleTheme () {
theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark' theme.global.name.value = theme.global.current.value.dark ? 'light' : 'dark'
} }
</script> </script>