diff options
| author | Carl Schwan <carl@carlschwan.eu> | 2022-03-16 01:07:55 +0100 |
|---|---|---|
| committer | Carl Schwan <carl@carlschwan.eu> | 2022-05-16 13:21:48 +0200 |
| commit | c1499519d4a57859fa69098a743430a2dc068800 (patch) | |
| tree | c10816498597e9850140b4d975d68c47bdffd817 /apps/user_status | |
| parent | ad405e93767cfaf0ba34011010bb26dc4c05f60a (diff) | |
| download | nextcloud-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 'apps/user_status')
| -rw-r--r-- | apps/user_status/src/UserStatus.vue | 7 |
1 files changed, 6 insertions, 1 deletions
diff --git a/apps/user_status/src/UserStatus.vue b/apps/user_status/src/UserStatus.vue index 8baf31de1b7..644ff97d689 100644 --- a/apps/user_status/src/UserStatus.vue +++ b/apps/user_status/src/UserStatus.vue @@ -231,6 +231,11 @@ export default { align-items: flex-start !important; color: var(--color-main-text) !important; + &:focus-visible { + padding: 6px 8px 1px 8px !important; + margin: 2px !important; + } + &:not([href]) { height: var(--header-menu-item-height) !important; color: var(--color-text-maxcontrast) !important; @@ -298,7 +303,7 @@ export default { background-color: var(--color-background-hover); } &:focus { - border: 2px solid var(--color-main-text)!important; + box-shadow: 0 0 0 2px var(--color-main-text) !important; } } } |