services/mtg-online-drafter
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
Files
7b47d566c23f1bbf7cd40bd6654a8b0d61c42d99
mtg-online-drafter/docs/development/devlog/2025-12-18-195000_battlefield_restructure.md
dnviti bc5eda5e2a
Some checks failed
Build and Deploy / build (push) Failing after 1m10s
Details
feat: Implement game restart, battlefield styling with art crops and tapped stacks, and initial draw fixes.
2025-12-18 20:26:42 +01:00

1.3 KiB
Raw Blame History

Restructure Battlefield Layout

Status: Planned Date: 2025-12-18 Description: Restructure the battlefield view in GameView.tsx from a free-form absolute positioning system to a structured, 3-zone layout (Creatures, Non-Creatures, Lands) using Flex/Grid. This improves readability and organization of the board state.

Technical Plan:

  1. Categorization: In GameView.tsx, split the myBattlefield array into three logical groups:
    • Creatures: Any card with 'Creature' type (including Artifact Creatures and Land Creatures).
    • Lands: Any card with 'Land' type that is NOT a creature.
    • Others: Artifacts, Enchantments, Planeswalkers, Battles that are neither Creatures nor Lands.
  2. Layout: Replace the absolute div rendering with a Flexbox column container (h-full flex flex-col).
    • Combat Zone (Top): flex-1 (takes remaining space). Used for Creatures. Layout: flex-wrap, centered.
    • Support Zone (Middle): Fixed height or proportional. Used for Artifacts/Enchantments.
    • Mana Zone (Bottom): Fixed height. Used for Lands.
  3. Action Logic: Ensure drag-and-drop targeting and attacking/blocking selection still functions correctly within the new layout structure.
  4. Visuals: Maintain the existing perspective and 3D transforms for card interaction (hover, attack state).