services/mtg-online-drafter
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Implement dynamic art cropping for small cards and refine preview suppression for large cards.

Browse Source
This commit is contained in:
Daniele Viti
2025-12-17 01:28:26 +01:00
parent f9819b324e
commit 4ad0cd6fdc
10 changed files with 92 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
docs/development/devlog/2025-12-17-024500_dynamic_art_cropping.md Normal file
View File

@@ -0,0 +1,18 @@
# Dynamic Art Cropping
## Objective
Automatically switch card visualizations to "Full Art" (Art Crop) mode when the thumbnail size is reduced below a readability threshold, maximizing the visual impact of the artwork when text is too small to read.
## Changes
- **Backend (Client & Server)**:
- Updated `DraftCard` interface to include `imageArtCrop`.
- Modified parsing services (`PackGeneratorService`) to extract and populate `imageArtCrop` from Scryfall data.
- **Frontend (UI)**:
- **PackCard (Grid View)**: Implemented a conditional check: if `cardWidth < 170px`, the image source switches to `imageArtCrop`.
- **StackView (Deck/Collection)**: Applied the same logic.
- **Visuals**:
- The `object-cover` CSS property ensures the rectangular art crop fills the entire card frame, creating a "borderless/full-art" look.
- The **Foil Overlay** and **Rarity Stripe** remain visible on top of the art crop, maintaining game state clarity.
## Result
As you slide the size slider down, the cards seamlessly transform from standard cards (with borders and text) to vibrant, full-art thumbnails. This creates a stunning "mosaic" effect for the cube overview and deck stacks, solving the issue of illegible text at small scales.