aboutsummaryrefslogtreecommitdiff
path: root/src/lib/User/BadgeWall/badges.css
diff options
context:
space:
mode:
authorFuwn <[email protected]>2026-06-02 12:26:13 +0000
committerFuwn <[email protected]>2026-06-02 12:26:13 +0000
commit9fbe4faac31426b49e9bb3d22bee9472ed52c564 (patch)
tree896ba18b22ab099128b62bd6de28c8a909ea7c24 /src/lib/User/BadgeWall/badges.css
parentfix(security): make rate limiting real; limit the click counter (L8/L10) (diff)
downloaddue.moe-9fbe4faac31426b49e9bb3d22bee9472ed52c564.tar.xz
due.moe-9fbe4faac31426b49e9bb3d22bee9472ed52c564.zip
perf(badges): skip off-screen cells via IntersectionObserver
Re-adds the off-screen layout/paint skip that was reverted for clipping the hover tilt/scale and tooltip. content-visibility: auto is now applied only to cells the IntersectionObserver marks off-screen (600px margin), so the containment — and the visible<->auto flip that flashes — never affects a cell that is on screen and interactive. Cells start off-screen so the first paint still skips, and the observer clears it for visible cells after mount.
Diffstat (limited to 'src/lib/User/BadgeWall/badges.css')
-rw-r--r--src/lib/User/BadgeWall/badges.css9
1 files changed, 9 insertions, 0 deletions
diff --git a/src/lib/User/BadgeWall/badges.css b/src/lib/User/BadgeWall/badges.css
index 19f8996f..f2e03988 100644
--- a/src/lib/User/BadgeWall/badges.css
+++ b/src/lib/User/BadgeWall/badges.css
@@ -11,6 +11,15 @@
gap: 0.25rem;
}
+/* Off-screen cells skip layout + paint. skipWhenOffscreen toggles this class
+ via IntersectionObserver so the containment — and the clipping it does to
+ the hover tilt, scale, and tooltip — is never active on an on-screen cell,
+ and the auto<->visible flip (which flashes) only ever happens off-screen. */
+.badges > .is-offscreen {
+ content-visibility: auto;
+ contain-intrinsic-size: auto 8rem;
+}
+
.edit-row-2 {
margin-top: -1.25rem;
}