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 <noreply@anthropic.com>
This commit is contained in:
@@ -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 {
|
||||
|
||||
Reference in New Issue
Block a user