tdpeuter/2025SELab2-project-Dwengo
tdpeuter/2025SELab2-project-Dwengo
1
Fork 0
Code Issues Releases 4 Packages 2 Wiki Activity

feat(frontend): dropdown menu om te veranderen tussen nederlands en engels is in de menubalk geplaatst

Browse source
This commit is contained in:
Laure Jablonski 2025-02-28 15:02:48 +01:00
parent e92744fc92
commit ad726843b4
1 changed files with 39 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

40
frontend/src/components/MenuBar.vue
View file

@ -1,6 +1,7 @@
<script setup lang="ts">
import { computed } from "vue";
import { useRoute } from "vue-router";
import { ref } from "vue";
import dwengo_logo from "../../../assets/img/dwengo-groen-zwart.svg";
const route = useRoute();
@ -16,6 +17,14 @@
.split(" ")
.map((n) => n[0])
.join("");
const languages = ref([
{ name: "English", code: "en" },
{ name: "Nederlands", code: "nl" },
]);
// logic to change the language of the website to the selected language
const changeLanguage = (langCode: string) => {};
</script>
<template>
@ -59,12 +68,41 @@
>discussions</router-link
>
</li>
<li>
<v-menu open-on-hover>
<template v-slot:activator="{ props }">
<v-btn
v-bind="props"
icon
variant="text"
>
<v-icon
icon="mdi-translate"
size="small"
color="#0e6942"
></v-icon>
</v-btn>
</template>
<v-list>
<v-list-item
v-for="(language, index) in languages"
:key="index"
@click="changeLanguage(language.code)"
>
<v-list-item-title>{{ language.name }}</v-list-item-title>
</v-list-item>
</v-list>
</v-menu>
</li>
</ul>
</div>
<div class="right">
<li>
<router-link :to="`/login`">
<v-tooltip text="log out">
<v-tooltip
text="log out"
location="bottom"
>
<template v-slot:activator="{ props }">
<v-icon
v-bind="props"