[Website] Add a square mobile Dock with a tools toggle

[adamziel]

The mobile Dock is now a square, full-width bottom bar with a chevron that hides the tool buttons. The address and save-status row stays visible when the tools are hidden, and New remains the full-size primary button. The expanded bar leaves 16px above the tools and keeps its outer shadow instead of clipping it.

Desktop keeps the rounded Dock and both existing toggle actions. AGENTS.md also makes the test rule explicit: current CSS dimensions belong in screenshots and manual review, not unit-test fixtures.

Before	After: tools shown	After: tools hidden

Testing

At 1024px wide or narrower, check that the Dock has square corners and a visible shadow, New remains full-size, and the chevron hides and shows the tools without removing the address or save status.

Above 1024px, check that the Dock remains rounded and its collapse and full-width controls still work.

[Copilot]

Pull request overview

Note

Copilot was unable to run its full agentic suite in this review.

Updates the mobile Dock to have square corners and an in-bar chevron that collapses/expands the tools row, while keeping desktop Dock behavior unchanged.

Changes:

• Override mobile Dock corner treatment (border radius + clip behavior) and adjust collapsed layout to remove tools from flow on mobile.
• Render the existing DockTogglePill on mobile, but hide only the full-width toggle half.
• Update Dock height/operation-toast positioning logic to treat mobile collapse as “measured height already equals visible height,” and add a test for the toast style.

Reviewed changes

Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
packages/playground/website/src/components/dock/style.module.css	Mobile breakpoint styling: square corners, hide only full-width toggle, and remove tools row from layout when collapsed.
packages/playground/website/src/components/dock/dock.tsx	Adjusts “visible height” calculation to account for mobile collapsing via layout removal instead of translation.
packages/playground/website/src/components/dock/dock-toggle-pill.tsx	Adds a dedicated class to the full-width button so it can be hidden on mobile while keeping the collapse chevron.
packages/playground/website/src/components/dock/dock-positioning.ts	Aligns operation toast bottom offset with mobile’s “measured height is visible height” collapse behavior.
packages/playground/website/src/components/dock/dock-positioning.spec.ts	Adds test coverage for mobile collapsed toast positioning using measured height.

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.