mirror of
https://github.com/jason5ng32/MyIP.git
synced 2026-11-04 08:55:47 +00:00
Fix(pwa): keep the status-bar strip hit-testable for iOS's edge blur check
iOS 26+ draws its scroll-edge blur over the top of a Home Screen web app unless a hit test at the top edge finds a fixed, viewport-wide box with a plain background colour (WebKit's LocalFrameView::fixedContainerEdges, which honours pointer-events on its first pass). The safe-area strip is exactly that box; it no longer opts out of hit testing. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_013GbLTGMZ45MV78qd2tHoco
This commit is contained in:
1 file changed
+7
-2
@@ -3,8 +3,13 @@
|
||||
in index.html — the only way to get a live status-bar tint on iOS PWA, since WebKit
|
||||
ignores JS theme-color writes and media-variant theme-color tags in standalone mode.
|
||||
Color tracks --page-bg (style.css), which follows .dark class.
|
||||
It and the header below stay put through page transitions (jn-site-* in style.css). -->
|
||||
<div class="jn-site-status-bar fixed top-0 left-0 right-0 z-50 pointer-events-none transition-colors duration-300"
|
||||
It and the header below stay put through page transitions (jn-site-* in style.css).
|
||||
It stays hit-testable on purpose: iOS 26+ decides whether to draw its Liquid Glass
|
||||
scroll-edge blur over the top of a Home Screen web app by hit-testing the top edge
|
||||
for a fixed, viewport-wide box with a plain background colour (WebKit
|
||||
LocalFrameView::fixedContainerEdges); pointer-events: none would hide this strip
|
||||
from that first pass. -->
|
||||
<div class="jn-site-status-bar fixed top-0 left-0 right-0 z-50 transition-colors duration-300"
|
||||
style="height: env(safe-area-inset-top); background: var(--page-bg);" aria-hidden="true"></div>
|
||||
<header
|
||||
class="jn-site-nav fixed top-[env(safe-area-inset-top)] left-0 right-0 z-40 w-full border-b transition-transform duration-300 ease-out will-change-transform"
|
||||
|
||||
Reference in new issue
Block a user