aboutsummaryrefslogtreecommitdiff
path: root/html/jspage.pl
diff options
context:
space:
mode:
authorBen Harris <bjh21@bjh21.me.uk>2022-11-14 22:16:03 +0000
committerBen Harris <bjh21@bjh21.me.uk>2022-11-23 21:56:42 +0000
commit8445f07827eb13db005aa38b7f665f8154e3918c (patch)
tree595dd671ac5c05f6e5c86dece9b751bb9499b28a /html/jspage.pl
parent52cd58043ac144eeafb92fd962662420506283c1 (diff)
downloadpuzzles-8445f07827eb13db005aa38b7f665f8154e3918c.zip
puzzles-8445f07827eb13db005aa38b7f665f8154e3918c.tar.gz
puzzles-8445f07827eb13db005aa38b7f665f8154e3918c.tar.bz2
puzzles-8445f07827eb13db005aa38b7f665f8154e3918c.tar.xz
js: Replace :focus-within with JS-maintained .focus-within
Old browsers (like KaiOS 2.5) don't have :focus-within, but it's pretty easy to replace the pseudo-class with a real .focus-within class maintained by JavaScript event handlers. This is made only marginally fiddlier by the odd fact that "focus" and "blur" events don't bubble.
Diffstat (limited to 'html/jspage.pl')
-rwxr-xr-xhtml/jspage.pl4
1 files changed, 2 insertions, 2 deletions
diff --git a/html/jspage.pl b/html/jspage.pl
index ec67a4d..5376a9a 100755
--- a/html/jspage.pl
+++ b/html/jspage.pl
@@ -128,7 +128,7 @@ EOF
}
#gamemenu li > :hover:not(:disabled),
-#gamemenu li > :focus-within {
+#gamemenu li > .focus-within {
/* When the mouse is over a menu item, highlight it */
background: rgba(0,0,0,0.3);
}
@@ -186,7 +186,7 @@ EOF
}
#gamemenu :hover > ul,
-#gamemenu :focus-within > ul {
+#gamemenu .focus-within > ul {
/* Last but by no means least, the all-important line that makes
* submenus be displayed! Any <ul> whose parent <li> is being
* hovered over gets display:flex overriding the display:none