From c1499519d4a57859fa69098a743430a2dc068800 Mon Sep 17 00:00:00 2001 From: Carl Schwan Date: Wed, 16 Mar 2022 01:07:55 +0100 Subject: 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 --- apps/dashboard/src/DashboardApp.vue | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'apps/dashboard') diff --git a/apps/dashboard/src/DashboardApp.vue b/apps/dashboard/src/DashboardApp.vue index 46de7b58827..d08c18c6ffd 100644 --- a/apps/dashboard/src/DashboardApp.vue +++ b/apps/dashboard/src/DashboardApp.vue @@ -517,9 +517,9 @@ export default { & > .panel--content { margin: 0 16px 16px 16px; - height: 420px; + height: 424px; // We specifically do not want scrollbars inside widgets - overflow: hidden; + overflow: visible; } // No need to extend height of widgets if only one column is shown @@ -566,7 +566,7 @@ export default { background-color: var(--color-background-hover)!important; } &:focus-visible { - border: 2px solid var(--color-main-text)!important; + box-shadow: 0 0 0 2px var(--color-main-text) !important; } } -- cgit v1.2.3