feat: Implement deck builder magnified card view, land advice, basic land integration, and unlimited time for deck construction.
This commit is contained in:
@@ -0,0 +1,27 @@
|
||||
# Deck Builder Magnified View
|
||||
|
||||
## Requirements
|
||||
- Add a magnified card view to the `DeckBuilderView`, similar to the one in `DraftView`.
|
||||
- Show card details (name, type, oracle text) when hovering over any card in the pool, deck, or land station.
|
||||
- Use a persistent sidebar layout for the magnified view.
|
||||
|
||||
## Implementation Details
|
||||
|
||||
### `DeckBuilderView.tsx`
|
||||
|
||||
- **State**: Added `hoveredCard` state to track the card being inspected.
|
||||
- **Layout**:
|
||||
- Changed the layout to a 3-column flex design:
|
||||
1. **Zoom Sidebar** (`hidden xl:flex w-80`): Shows the magnified card image and text details. Defaults to a "Hover Card" placeholder.
|
||||
2. **Card Pool** (`flex-1`): Displays available cards.
|
||||
3. **Deck & Lands** (`flex-1`): Displays the current deck and land controls.
|
||||
- **Interactions**:
|
||||
- Added `onMouseEnter={() => setHoveredCard(card)}` and `onMouseLeave={() => setHoveredCard(null)}` handlers to:
|
||||
- Cards in the Pool.
|
||||
- Cards in the current Deck.
|
||||
- Basic Lands in the Land Station.
|
||||
|
||||
## Verification
|
||||
- Verified that hovering over cards updates the sidebar image and text.
|
||||
- Verified that moving mouse away clears the preview (consistent with Draft View).
|
||||
- Layout adjusts responsively (sidebar hidden on smaller screens).
|
||||
Reference in New Issue
Block a user