784 B
784 B
Card Zoom on Hover - Dedicated Zone
Status
- Add
hoveredCardstate toDraftView(Already done). - Implement
onMouseEnter/onMouseLeavehandlers (Already done). - Refactor
DraftViewlayout to include a dedicated sidebar for card preview. - Move the zoomed card image into this dedicated zone instead of a fixed overlay.
Implementation Details
- File:
src/client/src/modules/draft/DraftView.tsx - Layout Change:
- Wrap the central card selection area in a
flex-rowcontainer. - Add a Left Sidebar (e.g.,
w-80) reserved for the zoomed card. - Ensure the main card grid takes up the remaining space (
flex-1).
- Wrap the central card selection area in a
- Behavior: When no card is hovered, the sidebar can show a placeholder or remain empty/decorative.