Skip to content

feat: Improve golden layout tab overflow drop down behaviour#1330

Merged
dsmmcken merged 9 commits intomainfrom
dmckenzie_fix_overflow_gl
Jun 8, 2023
Merged

feat: Improve golden layout tab overflow drop down behaviour#1330
dsmmcken merged 9 commits intomainfrom
dmckenzie_fix_overflow_gl

Conversation

@dsmmcken
Copy link
Copy Markdown
Contributor

  • Header now has overflow hidden - which fixes an issue where the controls causing overflow of the viewport
  • Since header has overflow, the dropdown menu is now moved to root while opened
  • Add logic to flip menu to expand upward when there's no space below
  • Add long name to test layout to check truncation behaviour
  • Close menu when item is picked up based on a drag from the dropdown
  • Resize dropdown when window is resized

Example of incorrect overflow:
Screenshot 2023-05-26 111108

dsmmcken added 7 commits May 29, 2023 15:52
…nto the package, will make it easier to theme later.
- Header no has overflow hidden fixing an issue where the controls causing overflow
- Since header has overflow, the dropdown menu is now moved to root while opened
- Add logic to flip menu to expand upward when there's no space below
- Add long name to test layout to check truncation behaviour
- Close menu when item is picked up based on a drag from the dropdown
- Resize dropdown when window is resized
@dsmmcken dsmmcken requested a review from mofojed May 29, 2023 20:16
@dsmmcken dsmmcken self-assigned this May 29, 2023
@codecov
Copy link
Copy Markdown

codecov Bot commented May 29, 2023

Codecov Report

Merging #1330 (65ba161) into main (2601146) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main    #1330   +/-   ##
=======================================
  Coverage   45.95%   45.95%           
=======================================
  Files         494      494           
  Lines       34423    34423           
  Branches     8587     8587           
=======================================
  Hits        15820    15820           
  Misses      18552    18552           
  Partials       51       51           
Flag Coverage Δ
unit 45.95% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Comment thread packages/golden-layout/src/controls/Header.ts Outdated
this.tabDropdownContainer.hide();
this.isDropdownShown = false;

// put it back in the header dom
Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

Why are we putting it back in the header DOM? Why don't we just create the container when we show the list and then remove it completely when it's hidden?

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

I could, but then I would have to re-bind all the listeners, which is not how it works currently.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Which would be easier if this was react and not jquery 🤷

@dsmmcken dsmmcken requested a review from mofojed June 6, 2023 16:01
@dsmmcken dsmmcken merged commit 9331822 into main Jun 8, 2023
@dsmmcken dsmmcken deleted the dmckenzie_fix_overflow_gl branch June 8, 2023 13:20
@github-actions github-actions Bot locked and limited conversation to collaborators Jun 8, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants