1.7 KiB
| id | title | status | assignee | created_date | labels | dependencies | priority | |||
|---|---|---|---|---|---|---|---|---|---|---|
| TASK-66 | Vertical canvas toolbar + whiteboard tools + zoom dropdown | Done | 2026-02-27 22:46 |
|
medium |
Description
Convert the canvas toolbar from horizontal (top center) to vertical (left side). Add whiteboard drawing tools dropdown and nest zoom controls under a dropdown. Includes collapsible toggle.
Acceptance Criteria
- #1 Toolbar is vertical on the left side with dropdowns opening to the right
- #2 Whiteboard 'Draw' dropdown with pencil, sticky note, rectangle, circle, line, eraser
- #3 Zoom controls nested under a 'Zoom' dropdown group
- #4 Toolbar collapsible via subtle toggle pill at bottom
- #5 Mobile responsive layout preserved
- #6 SVG overlay for whiteboard drawing on canvas
Final Summary
Implemented in commits f8bd09d, 683df43, merged to main as 76f7da8.\n\nChanges to website/canvas.html:\n- #toolbar CSS: flex-direction column, fixed left:12px, scrollable, dropdowns open right\n- New 'Draw' toolbar group: pencil (freehand SVG path), sticky note (yellow markdown shape), rectangle, circle, line, eraser (click SVG elements to delete)\n- SVG overlay inside canvas-content for whiteboard strokes\n- Zoom in/out/reset nested under 'Zoom' dropdown group\n- Collapse toggle moved to bottom as subtle '···' pill, collapses to '▶'\n- Separators now horizontal (full width, 1px height)\n- Mobile styles updated for vertical layout\n- SHAPE_ICONS updated with creative tool entries