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:
@ -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;
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user