Store base

This commit is contained in:
Greg Kilmer
2026-08-06 12:13:48 -04:00
parent 51a7b9fee0
commit f4a49fe9bc
28 changed files with 2471 additions and 2 deletions
+27
View File
@@ -0,0 +1,27 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480" role="img" aria-label="Placeholder image: deck box open showing card capacity">
<defs>
<linearGradient id="bg3" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#170f24"/>
<stop offset="1" stop-color="#221630"/>
</linearGradient>
<radialGradient id="glow3" cx="0.5" cy="0.4" r="0.6">
<stop offset="0" stop-color="#e8b54a" stop-opacity="0.16"/>
<stop offset="1" stop-color="#e8b54a" stop-opacity="0"/>
</radialGradient>
</defs>
<rect width="640" height="480" fill="url(#bg3)"/>
<rect width="640" height="480" fill="url(#glow3)"/>
<!-- open deck box, lid back, cards inside -->
<g transform="translate(150 150)">
<!-- base -->
<rect x="0" y="80" width="340" height="180" rx="14" fill="#221630" stroke="#3e2f4a" stroke-width="2"/>
<!-- lid (hinged back) -->
<rect x="0" y="0" width="340" height="90" rx="14" fill="#2c2050" stroke="#3e2f4a" stroke-width="2"/>
<!-- cards stack -->
<rect x="30" y="40" width="200" height="130" rx="8" fill="#f4f1e8" opacity="0.9"/>
<rect x="40" y="30" width="200" height="130" rx="8" fill="#e8b54a" opacity="0.35"/>
<rect x="50" y="20" width="200" height="130" rx="8" fill="#8b7bd8" opacity="0.35"/>
<text x="270" y="180" font-family="monospace" font-size="14" fill="#c4ab8e">100+</text>
</g>
<text x="320" y="450" text-anchor="middle" font-family="monospace" font-size="16" fill="#c4ab8e" letter-spacing="2">PLACEHOLDER &#183; SWAP IN /images/store-products.ts</text>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+25
View File
@@ -0,0 +1,25 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480" role="img" aria-label="Placeholder image: counter close-up with life totals">
<defs>
<linearGradient id="bg4" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#170f24"/>
<stop offset="1" stop-color="#221630"/>
</linearGradient>
<radialGradient id="glow4" cx="0.5" cy="0.4" r="0.6">
<stop offset="0" stop-color="#6fb6ad" stop-opacity="0.16"/>
<stop offset="1" stop-color="#6fb6ad" stop-opacity="0"/>
</radialGradient>
</defs>
<rect width="640" height="480" fill="url(#bg4)"/>
<rect width="640" height="480" fill="url(#glow4)"/>
<!-- spinner-style counter -->
<g transform="translate(220 110)">
<circle cx="100" cy="130" r="110" fill="#221630" stroke="#3e2f4a" stroke-width="2"/>
<circle cx="100" cy="130" r="86" fill="none" stroke="#e8b54a" stroke-width="3" opacity="0.5"/>
<text x="100" y="120" text-anchor="middle" font-family="monospace" font-size="13" fill="#c4ab8e" letter-spacing="2">LIFE</text>
<text x="100" y="165" text-anchor="middle" font-family="sans-serif" font-size="46" font-weight="700" fill="#f4f1e8">40</text>
<!-- dial nubs -->
<circle cx="100" cy="24" r="6" fill="#8b7bd8"/>
<circle cx="100" cy="236" r="6" fill="#8b7bd8"/>
</g>
<text x="320" y="450" text-anchor="middle" font-family="monospace" font-size="16" fill="#c4ab8e" letter-spacing="2">PLACEHOLDER &#183; SWAP IN /images/store-products.ts</text>
</svg>

After

Width:  |  Height:  |  Size: 1.5 KiB

+25
View File
@@ -0,0 +1,25 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480" role="img" aria-label="Placeholder image: close-up of card finish and cut">
<defs>
<linearGradient id="bg1" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#170f24"/>
<stop offset="1" stop-color="#221630"/>
</linearGradient>
<radialGradient id="glow1" cx="0.5" cy="0.4" r="0.6">
<stop offset="0" stop-color="#e8b54a" stop-opacity="0.18"/>
<stop offset="1" stop-color="#e8b54a" stop-opacity="0"/>
</radialGradient>
</defs>
<rect width="640" height="480" fill="url(#bg1)"/>
<rect width="640" height="480" fill="url(#glow1)"/>
<!-- stylized card -->
<g transform="translate(170 70) rotate(-6)">
<rect width="300" height="420" rx="18" fill="#0b1026" stroke="#3e2f4a" stroke-width="2"/>
<rect x="22" y="22" width="256" height="100" rx="8" fill="#221630"/>
<rect x="22" y="140" width="256" height="180" rx="8" fill="#2c2050" opacity="0.5"/>
<rect x="22" y="336" width="180" height="14" rx="4" fill="#8b7bd8" opacity="0.5"/>
<rect x="22" y="360" width="120" height="14" rx="4" fill="#8b7bd8" opacity="0.3"/>
<!-- sparkle -->
<path d="M150 60 l4 10 10 4 -10 4 -4 10 -4 -10 -10 -4 10 -4 z" fill="#e8b54a" opacity="0.8"/>
</g>
<text x="320" y="450" text-anchor="middle" font-family="monospace" font-size="16" fill="#c4ab8e" letter-spacing="2">PLACEHOLDER &#183; SWAP IN /images/store-products.ts</text>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

+22
View File
@@ -0,0 +1,22 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 480" role="img" aria-label="Placeholder image: white card back showing the proxy marking">
<defs>
<linearGradient id="bg2" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#170f24"/>
<stop offset="1" stop-color="#221630"/>
</linearGradient>
<radialGradient id="glow2" cx="0.5" cy="0.4" r="0.6">
<stop offset="0" stop-color="#8b7bd8" stop-opacity="0.16"/>
<stop offset="1" stop-color="#8b7bd8" stop-opacity="0"/>
</radialGradient>
</defs>
<rect width="640" height="480" fill="url(#bg2)"/>
<rect width="640" height="480" fill="url(#glow2)"/>
<!-- white-backed card -->
<g transform="translate(170 70) rotate(5)">
<rect width="300" height="420" rx="18" fill="#f4f1e8" stroke="#3e2f4a" stroke-width="2"/>
<rect x="30" y="30" width="240" height="360" rx="10" fill="none" stroke="#d2c6a2" stroke-width="2" stroke-dasharray="6 6"/>
<text x="150" y="210" text-anchor="middle" font-family="sans-serif" font-size="34" font-weight="700" fill="#1b1730">PROXY</text>
<text x="150" y="248" text-anchor="middle" font-family="monospace" font-size="13" fill="#4a445e" letter-spacing="2">NOT TOURNAMENT LEGAL</text>
</g>
<text x="320" y="450" text-anchor="middle" font-family="monospace" font-size="16" fill="#c4ab8e" letter-spacing="2">PLACEHOLDER &#183; SWAP IN /images/store-products.ts</text>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB