aboutsummaryrefslogtreecommitdiffstats
path: root/core/src/components/HeaderMenu.vue
diff options
context:
space:
mode:
authorCarl Schwan <carl@carlschwan.eu>2022-03-16 01:07:55 +0100
committerCarl Schwan <carl@carlschwan.eu>2022-05-16 13:21:48 +0200
commitc1499519d4a57859fa69098a743430a2dc068800 (patch)
treec10816498597e9850140b4d975d68c47bdffd817 /core/src/components/HeaderMenu.vue
parentad405e93767cfaf0ba34011010bb26dc4c05f60a (diff)
downloadnextcloud-server-c1499519d4a57859fa69098a743430a2dc068800.tar.gz
nextcloud-server-c1499519d4a57859fa69098a743430a2dc068800.zip
Improve accessibility with more visible focus indication for non vue apps
- Add visible-focus effect on each header entry - Show focus outline when using focus-visible (keyboard navigation) - Add polyfy for focus-visible since it's only very recently available on webkit - Change text for link to home button to describe the destination and not the current page - Improve focus effect in app sidebar navigation Signed-off-by: Carl Schwan <carl@carlschwan.eu>
Diffstat (limited to 'core/src/components/HeaderMenu.vue')
-rw-r--r--core/src/components/HeaderMenu.vue8
1 files changed, 6 insertions, 2 deletions
diff --git a/core/src/components/HeaderMenu.vue b/core/src/components/HeaderMenu.vue
index 55d018677cb..9fed383b026 100644
--- a/core/src/components/HeaderMenu.vue
+++ b/core/src/components/HeaderMenu.vue
@@ -174,8 +174,8 @@ export default {
align-items: center;
justify-content: center;
width: 50px;
- height: 100%;
- margin: 0;
+ height: 44px;
+ margin: 2px 0;
padding: 0;
cursor: pointer;
opacity: .6;
@@ -188,6 +188,10 @@ export default {
opacity: 1;
}
+ &__trigger:focus-visible {
+ outline: none;
+ }
+
&__wrapper {
position: fixed;
z-index: 2000;