Fix paid room preview mismatch and ground pulsation.

Richer forest/night SVGs and stable scene-image rendering without parallax overshoot so shop thumbnails match the pet LCD.
This commit is contained in:
2026-05-24 05:14:14 -06:00
parent f0d36d53fa
commit 0b309fbc24
3 changed files with 74 additions and 23 deletions

View File

@@ -1,4 +1,4 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48" height="48">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 96" width="128" height="96">
<defs>
<linearGradient id="night-sky" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#1e1b4b"/>
@@ -6,10 +6,31 @@
<stop offset="100%" stop-color="#0f172a"/>
</linearGradient>
</defs>
<rect width="48" height="48" fill="url(#night-sky)"/>
<circle cx="10" cy="12" r="1" fill="#fef9c3"/>
<circle cx="22" cy="8" r="1" fill="#fef9c3"/>
<circle cx="34" cy="14" r="1" fill="#fef9c3"/>
<circle cx="38" cy="10" r="1.5" fill="#fef08a"/>
<circle cx="36" cy="11" r="4" fill="#fef9c3" opacity="0.9"/>
<rect width="128" height="96" fill="url(#night-sky)"/>
<!-- stars -->
<rect x="12" y="10" width="2" height="2" fill="#fef9c3"/>
<rect x="28" y="6" width="2" height="2" fill="#fef9c3"/>
<rect x="44" y="14" width="2" height="2" fill="#fef9c3"/>
<rect x="58" y="8" width="2" height="2" fill="#fef9c3"/>
<rect x="72" y="18" width="2" height="2" fill="#fef9c3"/>
<rect x="86" y="12" width="2" height="2" fill="#fef9c3"/>
<rect x="102" y="6" width="2" height="2" fill="#fef9c3"/>
<rect x="18" y="24" width="2" height="2" fill="#fef08a"/>
<rect x="52" y="22" width="2" height="2" fill="#fef9c3"/>
<rect x="94" y="26" width="2" height="2" fill="#fef9c3"/>
<rect x="110" y="20" width="2" height="2" fill="#fef08a"/>
<rect x="36" y="32" width="2" height="2" fill="#fef9c3" opacity="0.8"/>
<rect x="68" y="30" width="2" height="2" fill="#fef9c3" opacity="0.8"/>
<!-- moon glow -->
<circle cx="98" cy="22" r="14" fill="#fef9c3" opacity="0.15"/>
<circle cx="98" cy="22" r="10" fill="#fef9c3" opacity="0.25"/>
<circle cx="98" cy="22" r="7" fill="#fef9c3" opacity="0.95"/>
<circle cx="95" cy="20" r="5" fill="#fef08a" opacity="0.5"/>
<!-- distant hills -->
<rect x="0" y="68" width="128" height="28" fill="#0f172a" opacity="0.55"/>
<rect x="0" y="72" width="40" height="24" fill="#1e1b4b" opacity="0.7"/>
<rect x="36" y="76" width="48" height="20" fill="#312e81" opacity="0.5"/>
<rect x="80" y="70" width="48" height="26" fill="#1e1b4b" opacity="0.65"/>
<!-- ground -->
<rect x="0" y="84" width="128" height="12" fill="#0f172a"/>
</svg>

Before

Width:  |  Height:  |  Size: 656 B

After

Width:  |  Height:  |  Size: 1.9 KiB