mirrors/gotosocial
1
0
Fork 0
mirror of https://github.com/superseriousbusiness/gotosocial.git synced 2025-11-02 13:52:24 -06:00
Code Issues Projects Releases Packages Wiki Activity Actions

[bugfix] Fix a couple accessibility issues with :focus elements (#3979)

Browse source 
* [bugfix/frontend] Fix accessibility/focus issues in settings + web ui

* fix little error

* tweaks
This commit is contained in:
tobi 2025-04-09 14:14:20 +02:00 • committed by GitHub
commit 19cfa8d126
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
24 changed files with 405 additions and 152 deletions
Download patch file Download diff file Expand all files Collapse all files

33
web/source/css/_media-wrapper.css
View file

@ -74,6 +74,14 @@
div.blurhash-container > canvas {
display: none;
}
/*
Hide focus outline on click
to avoid ugly artifacts.
*/
&:focus {
outline: none;
}
}
summary {
@ -109,6 +117,16 @@
.hide {
display: none;
}
&:focus-visible {
/*
Can't rely on media having background with
decent contrast so inset and use button-fg
instead so focus is definitely visible.
*/
outline: 0.25rem dashed $button-fg;
outline-offset: -0.25rem;
}
}
.show.sensitive {
@ -126,6 +144,21 @@
}
}
a.photoswipe-slide {
display: inline-block;
height: 100%;
width: 100%;
/*
Inset outline to avoid outline
being hidden by overflow: hidden.
*/
&:focus-visible {
outline: $button-focus-outline;
outline-offset: -0.25rem;
}
}
video.plyr-video, .plyr {
position: absolute;
height: 100%;