feat(toolbar): consolidate document actions

[ThisIs-Developer]

What changed

• converted New, Share, Live Share, and Export into accessible icon-only header controls
• changed Create/Import Document to the Lucide plus icon and Copy Markdown to the Lucide clipboard icon
• embedded the clipboard SVG mask so the new icon renders consistently in the web and offline desktop builds
• moved view mode, Copy, synchronized scrolling, and Review into the header
• ordered document actions as View, Sync, New, Copy, Export, Share, Live Share, and Review
• removed the app-brand product icon while preserving the app name, subtitle, and GitHub link
• removed the More Tools overflow and promoted the advanced insertion actions to direct formatting-toolbar buttons
• rebuilt the desktop Appearance control with the same switch pattern as Private mode
• enlarged the Theme and Private mode switches to a clearer 40x22px track with a 16px circular thumb on desktop and mobile
• placed sun and moon inside the Theme switch thumb on desktop and mobile
• swapped the Theme thumb palette by appearance: light surface with dark sun in light mode, dark surface with light moon in dark mode
• kept the active Theme track dark gray in dark appearance instead of accent blue
• restored the active Private mode track to the theme accent blue in both light and dark appearances
• increased the Theme switch glyph to 12px and strengthened its visual weight
• kept Private mode icon-free while matching the Theme switch enlarged thumb geometry and theme-aware surface colors
• preserved Lucide styling, active states, keyboard shortcuts, responsive overflow, localization hooks, and desktop resource parity
• updated the affected Playwright coverage

Why

The document commands were split across the header and formatting toolbar, while several advanced insertion actions were hidden behind an overflow menu. Consolidating related document actions improves scanability and makes the complete tool set directly discoverable. The revised order moves view and synchronization first, document creation and output next, and collaboration and review last. The simplified plus and clipboard symbols make the creation and copy commands easier to recognize at compact toolbar sizes. The theme control now uses the same interaction pattern as Private mode and communicates its current state directly inside the switch.

User impact

Desktop users get a compact, icon-first document toolbar with clearer grouping and more familiar creation and clipboard symbols. Theme switching is now visually consistent across desktop and mobile, with a sun or moon icon acting as the switch thumb. Phone and tablet layouts continue to use the existing mobile menu, while the expanded formatting toolbar remains horizontally scrollable.

Validation

• npm run check:static - passed
• focused header icon Chromium check - passed
• exact Lucide classes and clipboard mask rendering - passed
• browser visual QA and console diagnostics - passed
• theme-switching Chromium check - passed
• Private mode accent checks in light and dark Chromium - passed
• mobile 375px settings/control check - passed
• exact desktop header order, app-brand, and 375px layout checks - passed
• broader settings/storage Chromium regression set - 23 passed
• visual QA in light and dark themes - passed; switch size, icon position, focus state, and contrast verified
• responsive assertions at 320, 375, 768, 1080, and 1440px plus landscape - passed
• full 109-test Chromium suite - inconclusive; exceeded the 10-minute outer command limit without reporting an assertion failure

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
markdown-viwer	Ready	Preview	Aug 11, 2026 9:17pm

[cloudflare-workers-and-pages]

Deploying markdownviewer with    Cloudflare Pages

Latest commit:	da75506
Status:	✅  Deploy successful!
Preview URL:	https://1c1a161c.markdownviewer.pages.dev
Branch Preview URL:	https://agent-consolidate-icon-toolb.markdownviewer.pages.dev

View logs