From cf8d1f58dee9cec2afac64074540c29883c92fdf Mon Sep 17 00:00:00 2001
From: Henrik Askjer <henrik.askjer@uib.no>
Date: Fri, 17 Dec 2021 14:00:20 +0100
Subject: [PATCH] use top menu in accessibility link
---
src/components/Autocomplete.vue | 31 +++++++------------------------
src/components/TopBar.vue | 13 +++++++++++--
src/main.js | 3 ++-
3 files changed, 20 insertions(+), 27 deletions(-)
diff --git a/src/components/Autocomplete.vue b/src/components/Autocomplete.vue
index 00baa4e4..d9d79ec6 100644
--- a/src/components/Autocomplete.vue
+++ b/src/components/Autocomplete.vue
@@ -27,32 +27,13 @@
<template v-slot:append>
<a class="accessibility_link" href="#main_content">GÃ¥ videre til hovedinnholdet</a>
- <a href= "#menu_title"
- class="accessibility_link"
- @click="menuDialog=true"
- :aria-label="$t('menu.title')"
- aria-haspopup="true"
- :aria-expanded="menuDialog"
+ <a href="#top_menu" class="accessibility_link"
+ @click="$store.commit('toggle', 'menuOpen')"
+ aria-label="Hopp til toppmeny"
>
Ã…pne hovedmeny</a>
- <v-dialog v-model="menuDialog">
- <v-toolbar dense dark color="primary">
- <v-toolbar-title id="menu_title">{{$t('menu.title')}}</v-toolbar-title><v-spacer></v-spacer>
- <v-toolbar-items><v-divider vertical/>
-
- <v-btn
- @click="menuDialog=false"
- dark
- text
- >{{$t("close")}}
- <v-icon right>close</v-icon>
- </v-btn>
- </v-toolbar-items>
- </v-toolbar>
- <Menu @close="menuDialog=false"/>
- </v-dialog>
<v-menu allowOverflow: true offsetY>
<template v-slot:activator="{ on, attrs }">
@@ -123,9 +104,11 @@ import Menu from './Menu.vue'
select(item) {
if (item) {
this.items = []
- this.suggesting = false
+ this.suggesting = false
+ console.log("ITEM", item)
+ console.log("INFLECTED", this.inflected_suggestions)
- this.submit(item)
+ this.submit(item)
}
}
diff --git a/src/components/TopBar.vue b/src/components/TopBar.vue
index 67662151..fa4c96fe 100644
--- a/src/components/TopBar.vue
+++ b/src/components/TopBar.vue
@@ -37,7 +37,7 @@
</v-toolbar-items>
- <v-btn width="96px" v-if="$route.name != 'about'" aria-labelledby="menu_label" text @click.native="menuOpen = !menuOpen">
+ <v-btn id="top_menu" width="96px" v-if="$route.name != 'about'" aria-labelledby="menu_label" text @click.native="menuOpen = !menuOpen">
<span id="menu_label">{{$t('menu.title')}}</span><v-icon right>{{menuOpen? 'close' : 'menu'}}</v-icon></v-btn>
<v-divider vertical/>
@@ -62,10 +62,19 @@ export default {
return {
version_label: process.env.VUE_APP_VERSION_LABEL,
release: process.env.VUE_APP_RELEASE,
- menuOpen: false,
settingsMenu: false
}
},
+ computed: {
+ menuOpen: {
+ get() {
+ return this.$store.state.menuOpen
+ },
+ set () {
+ this.$store.commit('toggle', 'menuOpen')
+ }
+ }
+ },
methods: {
toggleAbout: function() {
this.$route.name=='about'? this.$router.back(): this.$router.push('/om')
diff --git a/src/main.js b/src/main.js
index b26431c8..f428032d 100644
--- a/src/main.js
+++ b/src/main.js
@@ -27,7 +27,8 @@ const store = new Vuex.Store({
showHGNO: null,
showInflectionNo: null,
currentLocale: null,
- collapseArticles: null
+ collapseArticles: null,
+ menuOpen: false
},
mutations: {
initStore(state) {
--
GitLab