27 lines
1.2 KiB
Markdown
27 lines
1.2 KiB
Markdown
|
|
# 2024-12-18 16:35:00 - Refactor Game Battlefield Sidebar
|
|
|
|
## Description
|
|
Refactored the `GameView` sidebar to be graphically and functionally consistent with `DeckBuilderView` and `DraftView`.
|
|
|
|
## Key Changes
|
|
- **Component**: `GameView.tsx`
|
|
- **Functionality**:
|
|
- Implemented collapsible sidebar state with persistence (`game_sidebarCollapsed`).
|
|
- Implemented resizable sidebar width with persistence (`game_sidebarWidth`).
|
|
- Added transition animations for collapsing/expanding.
|
|
- **Visuals**:
|
|
- Adopted the "Card Preview" style with a 3D flip effect.
|
|
- Used `back.jpg` (path `/images/back.jpg`) for the empty/back state.
|
|
- Moved the resize handle *inside* the sidebar container with consistent styling (floating pill).
|
|
- Preserved Oracle Text display below the card image (as it is critical for gameplay), styled within the new container.
|
|
|
|
## Consistent Elements
|
|
- **Icons**: Used `Eye` and `ChevronLeft` from Lucide.
|
|
- **Styling**: `slate-900` backgrounds, glassmorphism borders (`slate-800/50`), shadow effects.
|
|
- **Behavior**: Sidebar width allows dragging between 200px and 600px.
|
|
|
|
## Status
|
|
- [ ] Verify `back.jpg` exists in the deployed `public/images` folder (currently assumed based on other files).
|
|
- [x] Code refactoring complete.
|