Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Add custom tooltips and scrolling to breadcrumbs #2839

Merged
merged 3 commits into from
Mar 28, 2019

Conversation

turt2live
Copy link
Member

@turt2live turt2live commented Mar 27, 2019

Fixes element-hq/element-web#9303
Fixes element-hq/element-web#8714
Fixes element-hq/element-web#8890
Fixes element-hq/element-web#9034
Fixes element-hq/element-web#8954

Reviewer: It may be easier to review this commit-by-commit, which has more information.

I've bundled these together to try and reduce merge conflicts and because they are both vaguely visual. I was planning on including more, however the scrolling stuff is sufficiently complicated to scare me away from that.

image

Fixes element-hq/element-web#9303

We have to track our own onHover for this, and out of safety we ensure that exactly 1 room is hovered at a time.
Fixes element-hq/element-web#8714
Fixes element-hq/element-web#8890
Fixes element-hq/element-web#9034
Fixes element-hq/element-web#8954

This turned out to be much more complicated than it needed to be. We use an IndicatorScrollbar to do all the math for us and some minor changes have been made so it can flag left/right overflow. The complicated part is the css changes which make the gradients work: unlike the RoomSubList, we have to calculate the offset of the indicators (gradients) on our own because position:sticky doesn't work horizontally.

The changes to the css (well, mostly pointer-events:none) make it so the gradient doesn't interfere with the room avatars. 

9034 and 8954 are fixed by this because they represent an overflow-x:none style breakage where browsers won't let you scroll without a scrollbar. The gradient offset problem is also demonstrated in 8954.
@turt2live turt2live requested a review from a team March 28, 2019 00:02
@bwindels bwindels requested review from bwindels and removed request for a team March 28, 2019 09:32
Copy link
Contributor

@bwindels bwindels left a comment

Choose a reason for hiding this comment

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

generally lgtm, thanks for working on this! Just a few nits and a question how the negative right offset is supposed to work.

src/components/views/rooms/RoomBreadcrumbs.js Outdated Show resolved Hide resolved
src/components/structures/IndicatorScrollbar.js Outdated Show resolved Hide resolved
src/components/structures/IndicatorScrollbar.js Outdated Show resolved Hide resolved
@turt2live turt2live requested a review from bwindels March 28, 2019 16:45
@turt2live
Copy link
Member Author

(requesting review to make sure the question gets answered, and that said answer makes sense)

Copy link
Contributor

@bwindels bwindels left a comment

Choose a reason for hiding this comment

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

lgtm now!

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