# Phase 9: Board Properties Quick Panel

**Status:** ⬜ Not Started
**Parent plan:** [PLAN.md](./PLAN.md)
**Domain:** frontend

## Objective
Create a side panel / modal accessible from the edit toolbar's gear icon for editing board-level properties with live preview.

## Tasks

- [ ] Create `src/lib/components/board/BoardPropertiesPanel.svelte`
- [ ] Panel opens from toolbar gear icon as a slide-out side panel (right side)
- [ ] Board properties: name, description, icon
- [ ] Theme settings: themeHue slider (0-360), themeSaturation slider (0-100)
- [ ] Background type selector: mesh, particles, aurora, wallpaper, none
- [ ] Wallpaper settings: upload, URL input, blur slider, overlay opacity slider
- [ ] Card size selector: compact, medium, large
- [ ] Custom CSS editor (textarea or code editor)
- [ ] Guest access toggle
- [ ] All changes preview live on the board behind the panel
- [ ] Changes stored in edit mode changeset (boardUpdates)
- [ ] Close panel button, Escape to close
- [ ] Panel has its own scroll if content overflows

## Files to Modify/Create
- `src/lib/components/board/BoardPropertiesPanel.svelte` — new
- `src/lib/components/board/EditToolbar.svelte` — wire gear icon to open panel
- `src/routes/boards/[boardId]/+page.svelte` — mount panel, apply live preview overrides
- `src/lib/components/board/BoardThemeProvider.svelte` — support preview overrides

## Acceptance Criteria
- Gear icon opens the properties panel
- All board-level settings are editable
- Changes preview live on the board
- Wallpaper upload works with live preview
- Theme sliders update board colors in real-time
- Changes accumulate in changeset
- Panel closes on button click or Escape

## Notes
- Live preview means overriding BoardThemeProvider props with unsaved values
- Wallpaper upload may need special handling (uploaded immediately to server, URL stored in changeset)
- Custom CSS injection should be sandboxed to board scope

## Review Checklist
- [ ] All tasks completed
- [ ] Code follows project conventions
- [ ] No unintended side effects
- [ ] Build passes
- [ ] Tests pass (new + existing)

## Handoff to Next Phase
<!-- Filled in after completing this phase -->