Skip to content

[Bug]: Inline Disclosure Menu gets cut off on desktop screens (>1024px) #86

@72umesh

Description

@72umesh

Description

In the Dropdown component (Inline Disclosure Menu), the "More Options" menu triggered by the 3-dot button is partially hidden on desktop/laptop screens.

  • On mobile and tablet viewports (≤1024px) - the full menu displays correctly.
  • On desktop viewports (>1024px) - the top half of the menu is cut off, hiding the Edit option.

Steps to Reproduce

  1. Go to the Inline Disclosure Menu component preview (https://ui.watermelon.sh/components/category/dropdown).
  2. Resize your browser window to > 1024px width (desktop size).
  3. Click the three-dot button (⋯).
  4. Observe the dropdown menu on different screen sizes

Expected Behavior

The entire menu should be fully visible with all options:

  • Edit
  • Duplicate
  • Favourite
  • Share
  • Delete

The menu should automatically adjust its position (flip upward or shift) if there isn't enough space below the trigger.

Browser

Chrome

Additional Context

Actual Behavior

Only "Duplicate", "Favourite", "Share", and "Delete" are visible. The Edit option (and the top of the menu) is clipped/hidden behind the container or viewport edge.

Screenshots

Tablet (working correctly):

Image

Desktop (bug):

Image

Additional Information

  • Breakpoint observed: Works perfectly up to 1024px, breaks immediately after.

Happy to provide more details or help test a fix.

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions