mirrors/redlib
1
0
Fork 0
mirror of https://github.com/redlib-org/redlib.git synced 2025-04-07 06:57:39 +03:00
Code Issues Projects Releases Packages Wiki Activity

fix reblurring and disabling after focusing on link

Browse source
This commit is contained in:
DokterKaj 2024-10-15 01:14:16 +08:00
parent ac7eb2e97b
commit eacb0cf7fd
1 changed files with 43 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

67
static/style.css
View file

@ -1146,35 +1146,54 @@ a.search_subreddit:hover {
}
/* Unblur on hover */
.post_blurred .post_media_content:hover *,
.post_blurred .post_media_content:hover ~ .post_body,
.post_blurred .post_media_content:has(~ .post_body:hover) *,
.post_blurred .post_body:hover,
.post_blurred .post_thumbnail:hover * {
.post_blurred .post_media_content:not([tabindex]):hover *,
.post_blurred .post_media_content:not([tabindex]):hover ~ .post_body,
.post_blurred .post_media_content:not([tabindex]):has(~ .post_body:hover) *,
.post_blurred .post_body:not([tabindex]):hover,
.post_blurred .post_thumbnail:not([tabindex]):hover a * {
filter: none;
}
/* Unblur on click */
.post_blurred .post_media_content a,
.post_blurred .post_body a,
.post_blurred .post_thumbnail a {
pointer-events: none;
}
.post_blurred {
.post_media_content[tabindex],
.post_body[tabindex],
.post_thumbnail[tabindex] {
cursor: pointer;
/* Disable links when link is not focused */
a:not(:focus) {
pointer-events: none;
}
}
/* Enable links when content is focused */
.post_media_content:focus a,
.post_media_content:focus ~ .post_body a,
.post_media_content:has(~ .post_body:focus) a,
.post_body:focus a,
.post_thumbnail:focus a,
/* Keep enabling links when a link is focused */
.post_media_content:has(*:focus) a,
.post_media_content:has(*:focus) ~ .post_body a,
.post_media_content:has(~ .post_body a:focus) a,
.post_body:has(a:focus) a {
pointer-events: auto !important;
}
.post_blurred .post_media_content:focus a,
.post_blurred .post_media_content:focus ~ .post_body a,
.post_blurred .post_media_content:has(~ .post_body:focus) a,
.post_blurred .post_body:focus a,
.post_blurred .post_thumbnail:focus a {
pointer-events: auto;
}
.post_blurred .post_media_content:focus *,
.post_blurred .post_media_content:focus ~ .post_body,
.post_blurred .post_media_content:has(~ .post_body:focus) *,
.post_blurred .post_body:focus,
.post_blurred .post_thumbnail:focus * {
filter: none;
/* Unblur when content is focused */
.post_media_content:focus *,
.post_media_content:focus ~ .post_body,
.post_media_content:has(~ .post_body:focus) *,
.post_body:focus,
.post_thumbnail:focus a *,
/* Keep unblurring when link or video is focused */
.post_media_content:has(*:focus) *,
.post_media_content:has(*:focus) ~ .post_body,
.post_media_content:has(~ .post_body a:focus) *,
.post_body:has(a:focus),
.post_thumbnail a:focus * {
filter: none;
}
}
.post_media_image svg {