imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Merge pull request #3591 from matrix-org/t3chguy/a11y_fix

Browse source 
Fix focus-within on EventTile and more showing onClick
This commit is contained in:
David Baker 2019-11-06 10:50:42 +00:00 • committed by GitHub
commit 68a3fabada
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 12 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

2
res/css/structures/_RoomSubList.scss
View file

@ -51,7 +51,7 @@ limitations under the License.
height: 36px; height: 36px;
} }
.mx_RoomSubList_labelContainer:focus-within { .mx_RoomSubList_labelContainer.focus-visible:focus-within {
background-color: $roomtile-focused-bg-color; background-color: $roomtile-focused-bg-color;
} }

22
res/css/views/rooms/_EventTile.scss
View file

@ -138,14 +138,14 @@ limitations under the License.
// Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies) // Explicit relationships so that it doesn't apply to nested EventTile components (e.g in Replies)
.mx_EventTile_last > div > a > .mx_MessageTimestamp, .mx_EventTile_last > div > a > .mx_MessageTimestamp,
.mx_EventTile:hover > div > a > .mx_MessageTimestamp, .mx_EventTile:hover > div > a > .mx_MessageTimestamp,
.mx_EventTile:focus-within > div > a > .mx_MessageTimestamp, .mx_EventTile.mx_EventTile_actionBarFocused > div > a > .mx_MessageTimestamp,
.mx_EventTile.mx_EventTile_actionBarFocused > div > a > .mx_MessageTimestamp { .mx_EventTile.focus-visible:focus-within > div > a > .mx_MessageTimestamp {
visibility: visible; visibility: visible;
} }
.mx_EventTile:hover .mx_MessageActionBar, .mx_EventTile:hover .mx_MessageActionBar,
.mx_EventTile:focus-within .mx_MessageActionBar, .mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar { .mx_EventTile.focus-visible:focus-within .mx_MessageActionBar {
visibility: visible; visibility: visible;
} }
@ -167,9 +167,13 @@ limitations under the License.
} }
} }
.mx_EventTile_selected.mx_EventTile_info .mx_EventTile_line {
padding-left: 78px;
}
.mx_EventTile:hover .mx_EventTile_line, .mx_EventTile:hover .mx_EventTile_line,
.mx_EventTile:focus-within .mx_EventTile_line, .mx_EventTile.mx_EventTile_actionBarFocused .mx_EventTile_line,
.mx_EventTile.mx_EventTile_actionBarFocused .mx_EventTile_line { .mx_EventTile.focus-visible:focus-within .mx_EventTile_line {
background-color: $event-selected-color; background-color: $event-selected-color;
} }
@ -384,10 +388,6 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
padding-left: 5px; padding-left: 5px;
} }
.mx_EventTile_selected.mx_EventTile_info .mx_EventTile_line {
padding-left: 78px;
}
.mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line, .mx_EventTile:hover.mx_EventTile_verified .mx_EventTile_line,
.mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line { .mx_EventTile:hover.mx_EventTile_unverified .mx_EventTile_line {
padding-left: 60px; padding-left: 60px;
@ -469,7 +469,7 @@ div.mx_EventTile_notSent.mx_EventTile_redacted .mx_UnknownBody {
} }
.mx_EventTile:hover .mx_EventTile_body pre, .mx_EventTile:hover .mx_EventTile_body pre,
.mx_EventTile:focus-within .mx_EventTile_body pre { .mx_EventTile.focus-visible:focus-within .mx_EventTile_body pre {
border: 1px solid #e5e5e5; // deliberate constant as we're behind an invert filter border: 1px solid #e5e5e5; // deliberate constant as we're behind an invert filter
} }