christian/internetforkids
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: move ocean background to SVG element itself
All checks were successful
Deploy Internet for Kids / Build & Push (push) Successful in 11s
Details
Deploy Internet for Kids / Deploy (push) Successful in 6s
Details
Deploy Internet for Kids / Health Check (push) Successful in 2s
Details
Deploy Internet for Kids / Smoke Tests (push) Successful in 3s
Details
Deploy Internet for Kids / IndexNow Ping (push) Successful in 7s
Details
Deploy Internet for Kids / Promote to Latest (push) Successful in 2s
Details
Deploy Internet for Kids / Rollback (push) Has been skipped
Details
Deploy Internet for Kids / Audit (push) Successful in 2s
Details

Browse Source 
GPU tile seams show parent container background through gaps. Moving
background to the SVG element puts it in the same compositing layer
as the path fills, so tile seams split both identically.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Christian Gick
2026-04-04 10:08:50 +03:00
parent 82211ac5e4
commit 82760e3263
1 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
layouts/shortcodes/world-map.html
View File

@@ -5,8 +5,8 @@
.ifk-map-wrap { max-width: 100%; margin: 2rem 0; } .ifk-map-wrap { max-width: 100%; margin: 2rem 0; }
.ifk-map-wrap h3 { text-align: center; margin-bottom: 0.5rem; font-size: 1.25rem; } .ifk-map-wrap h3 { text-align: center; margin-bottom: 0.5rem; font-size: 1.25rem; }
.ifk-map-subtitle { text-align: center; color: #666; font-size: 0.85rem; margin-bottom: 1rem; } .ifk-map-subtitle { text-align: center; color: #666; font-size: 0.85rem; margin-bottom: 1rem; }
.ifk-map-container { position: relative; width: 100%; height: 420px; border-radius: 8px; overflow: hidden; background: #c8d3df; contain: strict; isolation: isolate; will-change: contents; } .ifk-map-container { position: relative; width: 100%; height: 420px; border-radius: 8px; overflow: hidden; }
.ifk-map-svg { width: 100%; height: 100%; display: block; cursor: grab; } .ifk-map-svg { width: 100%; height: 100%; display: block; cursor: grab; background: #c8d3df; }
.ifk-map-svg:active { cursor: grabbing; } .ifk-map-svg:active { cursor: grabbing; }
.ifk-map-svg .country { stroke: #94a3b8; stroke-width: 0.3; transition: stroke-width 0.15s; } .ifk-map-svg .country { stroke: #94a3b8; stroke-width: 0.3; transition: stroke-width 0.15s; }
.ifk-map-svg .country.has-data:hover { stroke: #667eea; stroke-width: 1.2; cursor: pointer; } .ifk-map-svg .country.has-data:hover { stroke: #667eea; stroke-width: 1.2; cursor: pointer; }