Tetardtek/ClickerZ
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: migrate frontend React 18 → Svelte 5 + SvelteKit
All checks were successful
CI/CD — Build & Deploy / Build & Deploy (push) Successful in 22s
Details

Browse Source 
Core logic portable (economy, balance, cosmetics, migrateSave) — zero rewrite.
136 tests green, identiques. Backend inchangé.

- Svelte 5 runes stores (game, auth, toast) remplacent Zustand
- SvelteKit adapter-static SPA (dist/ output, fallback index.html)
- Tailwind v4 conservé, design system .gp-* porté
- Transitions natives : slide, fly, scale, fade sur toute l'UI
- Sidebar tabbée (Production/Evolution/Collection) + CollapsiblePanel
- Mobile bottom sheet avec FAB toggle + backdrop blur
- Click particles réactifs Svelte (plus de DOM impératif)
- TadpoleSprite bounce + glow ring au clic
- Guide refait en accordéon, Achievements avec filtres
- a11y : focus-visible, Escape modals, aria-current, aria-labels
- CI/CD adapté (tests + build + rsync)
- Build 504K (vs ~1.2MB React)
This commit is contained in:
Tetardtek
2026-03-28 20:03:21 +01:00
parent 3de0492631
commit f6bff6e389
125 changed files with 5323 additions and 10373 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
Frontend/static/NavBar/SnowOff.svg Executable file
View File

@@ -0,0 +1,15 @@
<svg width="39" height="39" viewBox="0 0 39 39" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- Bubbles OFF — inactive state, dashed border -->
<rect x="1" y="1" width="37" height="37" rx="7" stroke="#202020" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" stroke-dasharray="20 20"/>
<!-- Big bubble -->
<circle cx="19" cy="16" r="8" stroke="#202020" stroke-width="2" fill="none"/>
<circle cx="16" cy="13" r="2" fill="#202020" opacity="0.3"/>
<!-- Medium bubble -->
<circle cx="12" cy="28" r="5" stroke="#202020" stroke-width="1.8" fill="none"/>
<circle cx="10.5" cy="26.5" r="1.2" fill="#202020" opacity="0.25"/>
<!-- Small bubble -->
<circle cx="28" cy="26" r="3.5" stroke="#202020" stroke-width="1.5" fill="none"/>
<circle cx="27" cy="24.8" r="0.9" fill="#202020" opacity="0.25"/>
<!-- Tiny bubble -->
<circle cx="30" cy="14" r="2" stroke="#202020" stroke-width="1.2" fill="none"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 915 B

15
Frontend/static/NavBar/SnowOn.svg Executable file
View File

@@ -0,0 +1,15 @@
<svg width="39" height="39" viewBox="0 0 39 39" fill="none" xmlns="http://www.w3.org/2000/svg">
<!-- Bubbles ON — active state, filled background -->
<rect width="39" height="39" rx="8" fill="#202020"/>
<!-- Big bubble -->
<circle cx="19" cy="16" r="8" stroke="#8ecae6" stroke-width="2" fill="none"/>
<circle cx="16" cy="13" r="2" fill="#8ecae6" opacity="0.6"/>
<!-- Medium bubble -->
<circle cx="12" cy="28" r="5" stroke="#8ecae6" stroke-width="1.8" fill="none"/>
<circle cx="10.5" cy="26.5" r="1.2" fill="#8ecae6" opacity="0.5"/>
<!-- Small bubble -->
<circle cx="28" cy="26" r="3.5" stroke="#8ecae6" stroke-width="1.5" fill="none"/>
<circle cx="27" cy="24.8" r="0.9" fill="#8ecae6" opacity="0.5"/>
<!-- Tiny bubble -->
<circle cx="30" cy="14" r="2" stroke="#8ecae6" stroke-width="1.2" fill="none"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 811 B

150
Frontend/static/robots.txt Normal file
View File

@@ -0,0 +1,150 @@
Sitemap: https://clickerz.tetardtek.com/sitemap.xml
User-agent: AlphaSeoBot
User-agent: AlphaSeoBot-SA
User-agent: Baiduspider-favo
User-agent: Baiduspider-cpro
User-agent: Baiduspider-ads
User-agent: Baidu
User-agent: Baiduspider-news
User-agent: Baiduspider-video
User-agent: Baiduspider-image
User-agent: Baiduspider
User-agent: BLEXBot
User-agent: 008
User-agent: Alexibot
User-agent: AlvinetSpider
User-agent: Antenne Hatena
User-agent: ApocalXExplorerBot
User-agent: asterias
User-agent: BackDoorBot/1.0
User-agent: BizInformation
User-agent: Black Hole
User-agent: BlowFish/1.0
User-agent: BotALot
User-agent: BuiltBotTough
User-agent: Bullseye/1.0
User-agent: BunnySlippers
User-agent: Cegbfeieh
User-agent: CheeseBot
User-agent: CherryPicker
User-agent: CherryPickerElite/1.0
User-agent: CherryPickerSE/1.0
User-agent: CopyRightCheck
User-agent: cosmos
User-agent: Crescent
User-agent: Crescent Internet ToolPak HTTP OLE Control v.1.0
User-agent: DISCo Pump 3.1
User-agent: DittoSpyder
User-agent: dotbot
User-agent: EmailCollector
User-agent: EmailSiphon
User-agent: EmailWolf
User-agent: EroCrawler
User-agent: Exabot
User-agent: ExtractorPro
User-agent: Flamingo_SearchEngine
User-agent: Foobot
User-agent: grapeshot
User-agent: Harvest/1.5
User-agent: hloader
User-agent: httplib
User-agent: HTTrack
User-agent: HTTrack 3.0
User-agent: humanlinks
User-agent: Igentia
User-agent: InfoNaviRobot
User-agent: JennyBot
User-agent: JikeSpider
User-agent: Kenjin Spider
User-agent: LexiBot
User-agent: libWeb/clsHTTP
User-agent: LinkextractorPro
User-agent: LinkScan/8.1a Unix
User-agent: LinkWalker
User-agent: lwp-trivial
User-agent: lwp-trivial/1.34
User-agent: Mata Hari
User-agent: Microsoft URL Control - 5.01.4511
User-agent: Microsoft URL Control - 6.00.8169
User-agent: MIIxpc
User-agent: MIIxpc/4.2
User-agent: Mister PiX
User-agent: MLBot
User-agent: moget
User-agent: moget/2.1
User-agent: MS Search 4.0 Robot
User-agent: MS Search 5.0 Robot
User-agent: Naverbot
User-agent: NetAnts
User-agent: NetAttache
User-agent: NetMechanic
User-agent: NICErsPRO
User-agent: Offline Explorer
User-agent: Openfind
User-agent: OpenindexSpider
User-agent: ProPowerBot/2.14
User-agent: ProWebWalker
User-agent: psbot
User-agent: QuepasaCreep
User-agent: QueryN Metasearch
User-agent: RepoMonkey
User-agent: RMA
User-agent: SightupBot
User-agent: SiteBot
User-agent: SiteSnagger
User-agent: SiteSucker
User-agent: Sogou web spider
User-agent: sosospider
User-agent: SpankBot
User-agent: spanner
User-agent: Speedy
User-agent: suggybot
User-agent: SuperBot
User-agent: SuperBot/2.6
User-agent: suzuran
User-agent: Szukacz/1.4
User-agent: Teleport
User-agent: Telesoft
User-agent: The Intraformant
User-agent: TheNomad
User-agent: TightTwatBot
User-agent: Titan
User-agent: toCrawl/UrlDispatcher
User-agent: TosCrawler
User-agent: trendictionbot
User-agent: True_Robot
User-agent: True_Robot/1.0
User-agent: turingos
User-agent: TurnitinBot
User-agent: UrlPouls
User-agent: URLy Warning
User-agent: VCI
User-agent: Web Image Collector
User-agent: WebAuto
User-agent: WebBandit
User-agent: WebBandit/3.50
User-agent: WebCopier
User-agent: webcopy
User-agent: WebEnhancer
User-agent: WebmasterWorldForumBot
User-agent: webmirror
User-agent: WebReaper
User-agent: WebSauger
User-agent: website extractor
User-agent: Website Quester
User-agent: Webster Pro
User-agent: WebStripper
User-agent: WebStripper/2.02
User-agent: WebZip
User-agent: wget
User-agent: WikioFeedBot
User-agent: WinHTTrack
User-agent: WWW-Collector-E
User-agent: Xenu Link Sleuth/1.3.8
User-agent: yacy
User-agent: yandex
User-agent: YRSPider
User-agent: Zeus
User-agent: Zookabot
Disallow: /

23
Frontend/static/sitemap.xml Executable file
View File

@@ -0,0 +1,23 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset
xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://www.sitemaps.org/schemas/sitemap/0.9
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
<url>
<loc>https://clickerz.tetardtek.com/</loc>
<lastmod>2026-03-20T12:00:00+00:00</lastmod>
<priority>1.00</priority>
</url>
<url>
<loc>https://clickerz.tetardtek.com/boutique</loc>
<lastmod>2026-03-20T12:00:00+00:00</lastmod>
<priority>0.80</priority>
</url>
<url>
<loc>https://clickerz.tetardtek.com/achievements</loc>
<lastmod>2026-03-20T12:00:00+00:00</lastmod>
<priority>0.80</priority>
</url>
</urlset>

44
Frontend/static/svg/aura-swamp.svg Normal file
View File

@@ -0,0 +1,44 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="320" height="320" shape-rendering="crispEdges">
<!-- Aura: Swamp — default cosmetic overlay -->
<!-- Same 32x32 grid as tadpole.svg, overlaid on top -->
<!-- ===== SEAWEED LEFT ===== -->
<rect x="0" y="10" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="11" width="1" height="1" fill="#4a8070"/>
<rect x="0" y="12" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="13" width="1" height="1" fill="#4a8070"/>
<rect x="0" y="14" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="15" width="1" height="1" fill="#4a8070"/>
<rect x="0" y="16" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="17" width="1" height="1" fill="#4a8070"/>
<rect x="0" y="18" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="19" width="1" height="1" fill="#4a8070"/>
<rect x="0" y="20" width="1" height="1" fill="#4a8070"/>
<rect x="1" y="21" width="1" height="1" fill="#4a8070"/>
<!-- ===== SEAWEED RIGHT ===== -->
<rect x="30" y="10" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="11" width="1" height="1" fill="#4a8070"/>
<rect x="30" y="12" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="13" width="1" height="1" fill="#4a8070"/>
<rect x="30" y="14" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="15" width="1" height="1" fill="#4a8070"/>
<rect x="30" y="16" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="17" width="1" height="1" fill="#4a8070"/>
<rect x="30" y="18" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="19" width="1" height="1" fill="#4a8070"/>
<rect x="30" y="20" width="1" height="1" fill="#4a8070"/>
<rect x="31" y="21" width="1" height="1" fill="#4a8070"/>
<!-- ===== WATER RIPPLE ===== -->
<rect x="6" y="27" width="13" height="1" fill="#3888d8"/>
<rect x="7" y="28" width="11" height="1" fill="#58a8e8"/>
<rect x="8" y="29" width="9" height="1" fill="#58a8e8" opacity="0.5"/>
<!-- ===== BUBBLES ===== -->
<rect x="1" y="6" width="1" height="1" fill="#50aab8" opacity="0.6"/>
<rect x="0" y="7" width="1" height="1" fill="#50aab8" opacity="0.4"/>
<rect x="2" y="5" width="1" height="1" fill="#50aab8" opacity="0.35"/>
<rect x="29" y="5" width="1" height="1" fill="#50aab8" opacity="0.5"/>
<rect x="30" y="6" width="1" height="1" fill="#50aab8" opacity="0.35"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.3 KiB

1
Frontend/static/svg/cosmetics/armor-scales.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><g fill="#6b7280" opacity="0.5"><ellipse cx="13" cy="16" rx="3" ry="2"/><ellipse cx="19" cy="16" rx="3" ry="2"/><ellipse cx="16" cy="20" rx="3" ry="2"/><ellipse cx="13" cy="24" rx="3" ry="2"/><ellipse cx="19" cy="24" rx="3" ry="2"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 303 B

1
Frontend/static/svg/cosmetics/cap-swamp.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><ellipse cx="16" cy="8" rx="10" ry="4" fill="#34d399"/><rect x="6" y="7" width="20" height="3" rx="1" fill="#059669"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 185 B

1
Frontend/static/svg/cosmetics/cape-algae.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M10,14 Q6,20 8,28 L16,26 L24,28 Q26,20 22,14Z" fill="#059669" opacity="0.5"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 153 B

1
Frontend/static/svg/cosmetics/crown.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><polygon points="8,10 11,4 16,8 21,4 24,10" fill="#fbbf24"/><rect x="8" y="10" width="16" height="3" rx="1" fill="#f59e0b"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 191 B

1
Frontend/static/svg/cosmetics/flame-tail.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M14,22 Q12,18 16,16 Q20,18 18,22 Q20,20 18,26 Q16,28 14,26 Q12,24 14,22Z" fill="#f59e0b" opacity="0.8"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 180 B

1
Frontend/static/svg/cosmetics/glasses-savant.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><circle cx="11" cy="13" r="3" fill="none" stroke="#a78bfa" stroke-width="1.5"/><circle cx="21" cy="13" r="3" fill="none" stroke="#a78bfa" stroke-width="1.5"/><line x1="14" y1="13" x2="18" y2="13" stroke="#a78bfa" stroke-width="1"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 298 B

1
Frontend/static/svg/cosmetics/mask-frog.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M8,12 Q16,18 24,12 Q24,16 16,17 Q8,16 8,12Z" fill="#34d399" opacity="0.7"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 151 B

1
Frontend/static/svg/cosmetics/particles-gold.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><g fill="#fbbf24" opacity="0.6"><circle cx="6" cy="8" r="1.2"/><circle cx="26" cy="6" r="1"/><circle cx="4" cy="20" r="0.8"/><circle cx="28" cy="22" r="1.2"/><circle cx="10" cy="28" r="1"/><circle cx="22" cy="30" r="0.8"/><circle cx="16" cy="2" r="1"/><circle cx="2" cy="14" r="0.8"/><circle cx="30" cy="14" r="1"/></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 386 B

1
Frontend/static/svg/cosmetics/ribbon.svg Normal file
View File

@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"><path d="M12,22 L16,20 L20,22 L18,26 L16,24 L14,26Z" fill="#ec4899"/><circle cx="16" cy="21" r="2" fill="#f472b6"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 182 B

139
Frontend/static/svg/tadpole.svg Executable file
View File

@@ -0,0 +1,139 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="320" height="320" shape-rendering="crispEdges">
<!-- Kawaii Tadpole V5 — pixel art 32x32 — BASE ONLY (no auras) -->
<!-- Character fills ~90% of canvas. Auras = separate overlay files. -->
<!-- ===== TAIL (behind body) ===== -->
<g id="tail">
<!-- Outline (darkest green, full shape) -->
<rect x="28" y="3" width="3" height="1" fill="#1c4c0c"/>
<rect x="26" y="4" width="6" height="1" fill="#1c4c0c"/>
<rect x="24" y="5" width="8" height="1" fill="#1c4c0c"/>
<rect x="19" y="6" width="12" height="1" fill="#1c4c0c"/>
<rect x="20" y="7" width="11" height="1" fill="#1c4c0c"/>
<rect x="21" y="8" width="9" height="1" fill="#1c4c0c"/>
<rect x="22" y="9" width="7" height="1" fill="#1c4c0c"/>
<rect x="22" y="10" width="6" height="1" fill="#1c4c0c"/>
<rect x="23" y="11" width="4" height="1" fill="#1c4c0c"/>
<rect x="23" y="12" width="4" height="1" fill="#1c4c0c"/>
<rect x="23" y="13" width="3" height="1" fill="#1c4c0c"/>
<rect x="23" y="14" width="3" height="1" fill="#1c4c0c"/>
<rect x="23" y="15" width="3" height="1" fill="#1c4c0c"/>
<rect x="23" y="16" width="2" height="1" fill="#1c4c0c"/>
<rect x="23" y="17" width="2" height="1" fill="#1c4c0c"/>
<!-- Fill (dark green) -->
<rect x="27" y="4" width="4" height="1" fill="#2c6410"/>
<rect x="25" y="5" width="6" height="1" fill="#2c6410"/>
<rect x="20" y="6" width="10" height="1" fill="#2c6410"/>
<rect x="21" y="7" width="9" height="1" fill="#2c6410"/>
<rect x="22" y="8" width="7" height="1" fill="#2c6410"/>
<rect x="23" y="9" width="5" height="1" fill="#2c6410"/>
<rect x="23" y="10" width="4" height="1" fill="#2c6410"/>
<rect x="24" y="11" width="2" height="1" fill="#2c6410"/>
<rect x="24" y="12" width="2" height="1" fill="#2c6410"/>
<rect x="24" y="13" width="1" height="1" fill="#2c6410"/>
<!-- Highlight (lighter green, upper curve) -->
<rect x="28" y="4" width="2" height="1" fill="#50a020"/>
<rect x="26" y="5" width="4" height="1" fill="#50a020"/>
<rect x="21" y="6" width="5" height="1" fill="#50a020"/>
<rect x="22" y="7" width="4" height="1" fill="#50a020"/>
<rect x="23" y="8" width="3" height="1" fill="#50a020"/>
<rect x="24" y="9" width="2" height="1" fill="#50a020"/>
<!-- Tip accent -->
<rect x="29" y="3" width="1" height="1" fill="#68b830"/>
<rect x="30" y="4" width="1" height="1" fill="#50aab8" opacity="0.5"/>
<rect x="31" y="3" width="1" height="1" fill="#50aab8" opacity="0.35"/>
</g>
<!-- ===== BODY (head, on top of tail) ===== -->
<g id="body">
<!-- Black outline circle (outer r=11, center 12,15) -->
<rect x="8" y="5" width="9" height="1" fill="#111"/>
<rect x="6" y="6" width="13" height="1" fill="#111"/>
<rect x="5" y="7" width="15" height="1" fill="#111"/>
<rect x="4" y="8" width="17" height="1" fill="#111"/>
<rect x="3" y="9" width="19" height="1" fill="#111"/>
<rect x="3" y="10" width="19" height="1" fill="#111"/>
<rect x="2" y="11" width="21" height="1" fill="#111"/>
<rect x="2" y="12" width="21" height="1" fill="#111"/>
<rect x="2" y="13" width="21" height="1" fill="#111"/>
<rect x="2" y="14" width="21" height="1" fill="#111"/>
<rect x="1" y="15" width="23" height="1" fill="#111"/>
<rect x="2" y="16" width="21" height="1" fill="#111"/>
<rect x="2" y="17" width="21" height="1" fill="#111"/>
<rect x="2" y="18" width="21" height="1" fill="#111"/>
<rect x="2" y="19" width="21" height="1" fill="#111"/>
<rect x="3" y="20" width="19" height="1" fill="#111"/>
<rect x="3" y="21" width="19" height="1" fill="#111"/>
<rect x="4" y="22" width="17" height="1" fill="#111"/>
<rect x="5" y="23" width="15" height="1" fill="#111"/>
<rect x="6" y="24" width="13" height="1" fill="#111"/>
<rect x="8" y="25" width="9" height="1" fill="#111"/>
<!-- Green fill (inner r=10) — Band 1: lightest top -->
<rect x="12" y="5" width="1" height="1" fill="#d0f058"/>
<rect x="8" y="6" width="9" height="1" fill="#d0f058"/>
<rect x="6" y="7" width="13" height="1" fill="#d0f058"/>
<rect x="5" y="8" width="15" height="1" fill="#d0f058"/>
<!-- Band 2: light -->
<rect x="4" y="9" width="17" height="1" fill="#a8d830"/>
<rect x="4" y="10" width="17" height="1" fill="#a8d830"/>
<rect x="3" y="11" width="19" height="1" fill="#a8d830"/>
<!-- Band 3: medium (center, largest area) -->
<rect x="3" y="12" width="19" height="1" fill="#80c020"/>
<rect x="3" y="13" width="19" height="1" fill="#80c020"/>
<rect x="3" y="14" width="19" height="1" fill="#80c020"/>
<rect x="2" y="15" width="21" height="1" fill="#80c020"/>
<rect x="3" y="16" width="19" height="1" fill="#80c020"/>
<rect x="3" y="17" width="19" height="1" fill="#80c020"/>
<rect x="3" y="18" width="19" height="1" fill="#80c020"/>
<!-- Band 4: dark -->
<rect x="3" y="19" width="19" height="1" fill="#60a418"/>
<rect x="4" y="20" width="17" height="1" fill="#60a418"/>
<rect x="4" y="21" width="17" height="1" fill="#60a418"/>
<rect x="5" y="22" width="15" height="1" fill="#60a418"/>
<!-- Band 5: darkest bottom -->
<rect x="6" y="23" width="13" height="1" fill="#4c8c14"/>
<rect x="8" y="24" width="9" height="1" fill="#4c8c14"/>
<rect x="12" y="25" width="1" height="1" fill="#4c8c14"/>
<!-- Specular highlight (top-left) -->
<rect x="8" y="6" width="3" height="1" fill="#e8ff78"/>
<rect x="6" y="7" width="3" height="1" fill="#e8ff78"/>
<rect x="6" y="8" width="2" height="1" fill="#e8ff78"/>
</g>
<!-- ===== EYES (big, expressive, pixel art) ===== -->
<g id="eyes">
<!-- Left eye — black pupil (5x6) -->
<rect x="6" y="12" width="5" height="6" fill="#111"/>
<!-- Left eye — white highlight (2x2 top-left) -->
<rect x="6" y="12" width="2" height="2" fill="#fff"/>
<!-- Left eye — secondary glint -->
<rect x="10" y="16" width="1" height="1" fill="#fff" opacity="0.4"/>
<!-- Right eye — black pupil (5x6) -->
<rect x="14" y="12" width="5" height="6" fill="#111"/>
<!-- Right eye — white highlight -->
<rect x="14" y="12" width="2" height="2" fill="#fff"/>
<!-- Right eye — secondary glint -->
<rect x="18" y="16" width="1" height="1" fill="#fff" opacity="0.4"/>
</g>
<!-- ===== MOUTH (subtle pixel smile) ===== -->
<g id="mouth">
<rect x="9" y="20" width="1" height="1" fill="#2a5a10"/>
<rect x="10" y="21" width="4" height="1" fill="#2a5a10"/>
<rect x="14" y="20" width="1" height="1" fill="#2a5a10"/>
</g>
<!-- ===== CHEEKS (subtle beige spots) ===== -->
<rect x="4" y="19" width="2" height="1" fill="#c0a860" opacity="0.3"/>
<rect x="19" y="19" width="2" height="1" fill="#c0a860" opacity="0.3"/>
<!-- ===== COSMETIC SLOTS (populated by game logic) ===== -->
<g id="slot-hat"><!-- crown, cap, helmet — above y=5 --></g>
<g id="slot-eyes"><!-- glasses, monocle, mask — over eyes area --></g>
<g id="slot-body"><!-- cape, armor, shirt — over body --></g>
<g id="slot-tail"><!-- flame, ribbon, glow — over tail --></g>
<g id="slot-accessory"><!-- aura, particles, pet — around character --></g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 7.1 KiB

BIN
Frontend/static/webp/bg-cover.webp Executable file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB