46 lines
2.0 KiB
Markdown
46 lines
2.0 KiB
Markdown
---
|
|
status: building
|
|
created: 2026-08-04
|
|
owner: kandev
|
|
---
|
|
|
|
# Quick Chat elevation
|
|
|
|
## Why
|
|
|
|
Quick Chat opens over the current page with a transparent backdrop, so the floating panel can
|
|
blend into the page and its opened state is not immediately clear. Users need a restrained visual
|
|
separation that makes the panel feel elevated while preserving the surrounding page as context.
|
|
|
|
## What
|
|
|
|
- When Quick Chat opens at tablet or desktop widths, the page behind it is visually de-emphasized by
|
|
a subtle semitransparent backdrop.
|
|
- The Quick Chat panel remains above the backdrop with its existing elevation shadow, dimensions,
|
|
position, content, and interaction behavior unchanged.
|
|
- Closing Quick Chat removes the backdrop and restores the page's normal appearance and interaction.
|
|
- On phone widths, Quick Chat keeps its existing full-screen composition, explicit close control,
|
|
and viewport containment. The backdrop does not need to be visible because the panel covers the
|
|
viewport.
|
|
|
|
## Scenarios
|
|
|
|
- **GIVEN** Quick Chat is closed on a tablet or desktop viewport, **WHEN** the user opens Quick Chat,
|
|
**THEN** the Quick Chat dialog is visible above a non-transparent backdrop and its computed panel
|
|
shadow is not `none`.
|
|
- **GIVEN** Quick Chat is open on a tablet or desktop viewport, **WHEN** the user closes it,
|
|
**THEN** the dialog and backdrop are removed so the page is fully visible again.
|
|
- **GIVEN** a phone viewport, **WHEN** the user opens Quick Chat from an existing mobile entry
|
|
point, **THEN** the full-screen dialog remains usable, the explicit close control remains
|
|
reachable, and the document has no horizontal overflow.
|
|
|
|
## Out of scope
|
|
|
|
- Changing Quick Chat size, position, responsive composition, content, sessions, or persistence.
|
|
- Adding a new backdrop component, user setting, animation, or navigation behavior.
|
|
- Changing the separate new-Quick-Chat picker dialog or configuration-chat popover.
|
|
|
|
## Implementation plan
|
|
|
|
[Quick Chat elevation implementation](../../plans/quick-chat-elevation/plan.md)
|