feat(03-04): add reward module with pre-generation and reward screen
- Create src/forest/reward.ts with startPreGeneration() and initRewardScreen() - Image pre-generation starts at lesson begin, placeholder shows while loading - Fallback to static SVGs when rate-limited or API unavailable - Reward screen HTML with image area, companion comment, action buttons - CSS for reward screen with animated leaves placeholder and image appear animation
This commit is contained in:
+16
-1
@@ -80,7 +80,22 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="screen-reward" class="screen"></section>
|
||||
<section id="screen-reward" class="screen">
|
||||
<div class="reward">
|
||||
<h2 class="reward__title">Schau mal!</h2>
|
||||
<div class="reward__image-area" id="reward-image-area">
|
||||
<!-- Placeholder or generated image -->
|
||||
</div>
|
||||
<div class="reward__companion" id="reward-companion">
|
||||
<img id="reward-companion-avatar" class="companion-area__avatar" src="" alt="">
|
||||
<p id="reward-companion-text" class="companion-area__text"></p>
|
||||
</div>
|
||||
<div class="reward__actions">
|
||||
<button class="reward__btn reward__btn--continue" id="reward-continue-btn">Weiter ueben</button>
|
||||
<button class="reward__btn reward__btn--back" id="reward-back-btn">Zurueck zum Wald</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section id="screen-parent" class="screen">
|
||||
<div class="parent">
|
||||
<button class="parent__back-btn" id="parent-back-btn">← Zurueck</button>
|
||||
|
||||
Reference in New Issue
Block a user