Skip to content

Workspace detail: left half of the screen is black (dark overlay not removed) #286

Description

@yustme

Bug / UX issue

When clicking on a workspace row, a detail panel opens — but visually it looks like the left ~75% of the screen simply goes black and turns off. Only the right side remains visible with the workspace detail.

What's actually happening

A modal/side-sheet opens over the page. The problem is the modal backdrop (the scrim behind the panel) is rendered as a solid opaque black fill, making it completely invisible that there's anything underneath. It doesn't look like a modal at all — it looks like a broken layout where half the page crashed.

Screenshot

The workspace detail panel is on the right. Everything to the left is a solid black rectangle — the sidebar and workspace list are completely invisible beneath it.

Proposed UX fix

The fix doesn't need to change the layout — just make the modal feel like a modal:

  • Replace the solid black backdrop with a semi-transparent dark scrim (e.g. bg-black/50 or bg-zinc-900/60) so the content underneath is dimmed but still visible
  • Optionally add a subtle blur (backdrop-blur-sm) to reinforce the depth effect
  • This immediately communicates "something has opened on top of the page" rather than "the page broke"
Before: |████████████████████| workspace detail |
         solid black, no hint of content beneath

After:  |░░░░░░░░░░░░░░░░░░░░| workspace detail |
         dimmed/blurred backdrop, modal is obvious

The core layout (side panel on the right) is fine — it just needs a proper semi-transparent backdrop so users understand they've opened a modal and can close it to get back to the list.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions