A11Y: improves avatar menu focus/active states (#12422)

This commit is contained in:
Joffrey JAFFEUX 2021-03-18 13:29:27 +01:00 committed by GitHub
parent 06c60b017c
commit cf703ccf66
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 19 additions and 3 deletions

View File

@ -6,6 +6,10 @@ createWidgetFrom(QuickAccessPanel, "quick-access-notifications", {
buildKey: () => "quick-access-notifications", buildKey: () => "quick-access-notifications",
emptyStatePlaceholderItemKey: "notifications.empty", emptyStatePlaceholderItemKey: "notifications.empty",
buildAttributes() {
return { tabindex: -1 };
},
markReadRequest() { markReadRequest() {
return ajax("/notifications/mark-read", { type: "PUT" }); return ajax("/notifications/mark-read", { type: "PUT" });
}, },

View File

@ -286,12 +286,16 @@
a { a {
display: flex; display: flex;
margin: 0.25em;
padding: 0em 0.25em;
}
button {
padding: 0.25em 0.5em;
} }
a, a,
button { button {
padding: 0.25em 0.5em;
> div { > div {
overflow: hidden; // clears the text from wrapping below icons overflow: hidden; // clears the text from wrapping below icons
overflow-wrap: anywhere; overflow-wrap: anywhere;
@ -437,7 +441,6 @@ div.menu-links-header {
color: var(--primary-high); color: var(--primary-high);
} }
&:focus,
&:hover { &:hover {
background-color: inherit; background-color: inherit;
} }

View File

@ -297,6 +297,15 @@
} }
} }
} }
&:focus {
outline: none;
background: var(--primary-medium);
color: var(--secondary);
.d-icon {
color: var(--primary-low);
}
}
} }
.btn-link { .btn-link {