1
0
mirror of https://github.com/BookStackApp/BookStack.git synced 2025-07-30 04:23:11 +03:00

Improved header element accessibility when at mobile sizes

Intended to fix issues raised in #2681.
Changes up the tri-layout tabs, and the main header menu toggle,
to be buttons while adding better text and keyboard controls.

Updated the component format of a few elements along the way.
This commit is contained in:
Dan Brown
2021-04-19 21:41:13 +01:00
parent 60ffe6a993
commit 9df4dee1b2
8 changed files with 66 additions and 31 deletions

View File

@ -191,6 +191,11 @@ header .search-box {
@include lightDark(color, #000, #fff);
text-decoration: none;
}
&:focus {
@include lightDark(background-color, #eee, #333);
outline-color: var(--color-primary);
color: var(--color-primary);
}
}
header .dropdown-container {
display: block;
@ -225,7 +230,7 @@ header .search-box {
&:first-child {
border-inline-end: 1px solid #DDD;
}
&.active {
&[aria-selected="true"] {
border-bottom-color: currentColor;
}
}