Skip to content

Comments

Fix discover page dropdown menu items cut off at viewport edge#3603

Closed
Shine2099 wants to merge 1 commit intoantiwork:mainfrom
Shine2099:fix-discover-dropdown-overflow
Closed

Fix discover page dropdown menu items cut off at viewport edge#3603
Shine2099 wants to merge 1 commit intoantiwork:mainfrom
Shine2099:fix-discover-dropdown-overflow

Conversation

@Shine2099
Copy link

Fixes #3467

Problem

The dropdown menus in the Discover page navigation extend beyond the viewport when they contain many items. Items at the bottom of these dropdowns become inaccessible as they're rendered outside the visible screen area with no way to scroll to them.

Solution

Add and to the dropdown menu container to:

  1. Limit the maximum height to 80% of the viewport height
  2. Enable vertical scrolling when content exceeds the max height

Changes

  • Modified to add to the dropdown menu className

Testing

Tested by checking that long dropdown menus now show scrollbars and all items are accessible.

Add max-height and overflow-y-auto to dropdown menu to prevent items from extending beyond viewport edge. This allows users to scroll through long dropdown lists.

Fixes antiwork#3467
Copy link
Member

@nyomanjyotisa nyomanjyotisa left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Discover page dropdown menu items cut off at viewport edge

2 participants