From 368ad9b48eb37265207f8601a0123454b89fd29a Mon Sep 17 00:00:00 2001 From: Jared Vititoe Date: Thu, 19 Mar 2026 11:35:38 -0400 Subject: [PATCH] Promote ascii-frame-outer to GPU layer to stop hover blink The body::before scanline overlay (position:fixed, z-index:9999) requires the compositor to re-blend over the section every time a CPU repaint happens inside it. Hover state entry/exit triggers these repaints, causing a visible blink as the compositor flushes. Fixes: - Add will-change:transform + transform:translateZ(0) to ascii-frame-outer to promote it to its own GPU compositing layer, isolating its repaints from the scanline compositing pass - Convert corner-pulse and subtle-pulse from text-shadow (CPU repaint) to opacity (GPU composited) to eliminate continuous repaint pressure inside the section Co-Authored-By: Claude Sonnet 4.6 --- assets/css/dashboard.css | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/assets/css/dashboard.css b/assets/css/dashboard.css index 8885f69..6681fbb 100644 --- a/assets/css/dashboard.css +++ b/assets/css/dashboard.css @@ -991,6 +991,8 @@ h1 { padding: 0; background: var(--bg-primary); margin-bottom: 2rem; + will-change: transform; + transform: translateZ(0); } .ascii-frame-outer::before { @@ -1029,8 +1031,8 @@ h1 { } @keyframes corner-pulse { - 0%, 100% { text-shadow: var(--glow-green); } - 50% { text-shadow: var(--glow-green-intense); } + 0%, 100% { opacity: 0.7; } + 50% { opacity: 1; } } .bottom-left-corner { @@ -1086,8 +1088,8 @@ h1 { } @keyframes subtle-pulse { - 0%, 100% { text-shadow: var(--glow-amber); } - 50% { text-shadow: var(--glow-amber-intense); } + 0%, 100% { opacity: 0.75; } + 50% { opacity: 1; } } .ascii-section-header::before {