feat: Implement advanced foil effects with rolling rainbow, circular glare, and mobile entrance animations, alongside a fix for foil rendering on non-foil cards.

This commit is contained in:
2025-12-17 01:11:50 +01:00
parent 119af95cee
commit f7d22377fa
16 changed files with 314 additions and 10 deletions

View File

@@ -0,0 +1,13 @@
# Bug Fix: Unconditional Foil Overlay
## Objective
Correct the issue where foil holographic animations were appearing on non-foil cards in the desktop view.
## Changes
- Modified `FloatingPreview` in `src/client/src/components/CardPreview.tsx`:
- In the desktop return block, the code manually embedding the foil effect divs (introduced in a previous step) was missing the `{isFoil && ...}` conditional wrapper.
- Replaced the manual div insertion with the `<FoilOverlay />` component, which encapsulates the foil logic correctly.
- Wrapped this component call in the `{isFoil && <FoilOverlay />}` check to ensure it only renders for cards with `foil` or `etched` finishes.
## Result
Foil animations now strictly adhere to card metadata, appearing only on actual foil cards as intended. Normal cards display cleanly without any holographic overlay.