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

Improve navigation tooltips #1597

Merged
merged 11 commits into from Nov 17, 2020
Merged

Conversation

awaismbajwa
Copy link
Contributor

REDMINE-17849

@coveralls
Copy link

coveralls commented Nov 5, 2020

Coverage Status

Coverage remained the same at 99.193% when pulling bf2e931 on awaismbajwa:custom-tooltip-for-scrolled into 3c6b46b on codevise:master.

@awaismbajwa awaismbajwa force-pushed the custom-tooltip-for-scrolled branch 7 times, most recently from 88028c6 to bf2e931 Compare November 10, 2020 16:45
@tf tf force-pushed the custom-tooltip-for-scrolled branch from bf2e931 to 7ecdb59 Compare November 12, 2020 06:49
@tf tf changed the title Custom tooltip for scrolled [WIP] Custom tooltip for scrolled Nov 12, 2020
@tf tf force-pushed the custom-tooltip-for-scrolled branch from c339d27 to 0d6cbac Compare November 17, 2020 06:57
awaismbajwa and others added 11 commits November 17, 2020 08:45
Implemented a basic Tooltip in pageflow scrolled to solve the problem with react tooltip css in Server side rendering.
Compared to the previous JS based approach this has a couple of
advantages:

* Clicking outside of a tooltip closes it. Before, a tooltip could
  only be closed by clicking the icon again.

* Closing other tooltips is taken care of automatically since opening
  a tooltip means the other tooltip loses focus.

* Less JS logic, less things to test.

* Also works in non-JS case.

As a result, tooltips now already open when the menu icon is
focused. Given that we have a skip link to skip the whole navigation
this seems ok to me.

Remove some unneeded code:

* `hasTrigger` was always true.

* Use CSS parent selector to make icons of expanded tooltips blue
  instead of cloning children and setting an additional class.

REDMINE-17849
* Keep only currently needed variants.

* Remove duplicate inline styles.

* Fine tune transitions.
Prevent collapsing the navigation while tooltips are still visible
when scrolling page.
@tf tf force-pushed the custom-tooltip-for-scrolled branch from 0d6cbac to 44d36f1 Compare November 17, 2020 07:45
@tf tf changed the title [WIP] Custom tooltip for scrolled Improve navigation tooltips Nov 17, 2020
@tf tf added this to the v15.4 milestone Nov 17, 2020
@tf tf merged commit 6c132c5 into codevise:master Nov 17, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants