36 lines
1.7 KiB
Markdown
36 lines
1.7 KiB
Markdown
---
|
|
id: TASK-66
|
|
title: Vertical canvas toolbar + whiteboard tools + zoom dropdown
|
|
status: Done
|
|
assignee: []
|
|
created_date: '2026-02-27 22:46'
|
|
labels:
|
|
- canvas
|
|
- ux
|
|
- toolbar
|
|
dependencies: []
|
|
priority: medium
|
|
---
|
|
|
|
## Description
|
|
|
|
<!-- SECTION:DESCRIPTION:BEGIN -->
|
|
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.
|
|
<!-- SECTION:DESCRIPTION:END -->
|
|
|
|
## Acceptance Criteria
|
|
<!-- AC:BEGIN -->
|
|
- [ ] #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
|
|
<!-- AC:END -->
|
|
|
|
## Final Summary
|
|
|
|
<!-- SECTION:FINAL_SUMMARY:BEGIN -->
|
|
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
|
|
<!-- SECTION:FINAL_SUMMARY:END -->
|