Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

added a max height and overflow to select-dropdown #12038

Merged

Conversation

jonah-iden
Copy link
Contributor

@jonah-iden jonah-iden commented Jan 2, 2023

auto to the select-component-dropdown,
so that the dropdown can't get bigger than the

Signed-off-by: Jonah Iden jonah.iden@typefox.io

What it does

Closes: #11991 .
Added a default "overflow: auto" and a max-height to the select-component dropdown. The max-height is calculated so that the dropdown is never outside of the visible area (clientRect).

How to test

Best way to test is probably adding a lot of debug configurations to the launch.json. Then in the debug window the configuration dropdown should on go to the bottom of the page and have a scrollbar.
For the inverted state i testet it thorugh the preferences (Terminal › Integrated: Font Weight Bold is a good select-box for that) by making the browser very small.

Review checklist

Reminder for reviewers

auto to the select-component-dropdown,
so that the dropdown can't get bigger than the

Signed-off-by: Jonah Iden <jonah.iden@typefox.io>
Copy link
Member

@msujew msujew left a comment

Choose a reason for hiding this comment

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

Hey @jonah-iden, thanks for the first time contribution.

Please make sure to sign the Eclipse Contributor Agreement (ECA) with the same email that is associated with this commit for us to accept the changes.

Copy link
Member

@msujew msujew left a comment

Choose a reason for hiding this comment

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

When scrolling using the mouse wheel, the select component will automatically close due to this code. The hide function needs to be updated to detect whether the target element of the event is actually inside of the select component. If it is outside the component, it should close the dropdown and keep it open if the target is inside.

Signed-off-by: Jonah Iden <jonah.iden@typefox.io>
@vince-fugnitto vince-fugnitto added core issues related to the core of the application ui/ux issues related to user interface / user experience labels Jan 10, 2023
Copy link
Member

@msujew msujew left a comment

Choose a reason for hiding this comment

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

The changes look good to me, thanks 👍

@msujew msujew merged commit 00564d6 into eclipse-theia:master Jan 18, 2023
@paul-marechal paul-marechal added this to the 1.34.0 milestone Jan 24, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
core issues related to the core of the application ui/ux issues related to user interface / user experience
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Many debug configurations make it impossible to reach 'Add Configurations'
4 participants