Differential D7563
[web] Show message tooltip on hover in the pinned messages modal Authored by rohan on Apr 21 2023, 6:49 AM. Tags None Referenced Files
Subscribers
Details Currently, the tooltip displays below the pinned messages modal when a message is hovered over. This is because of the z-index property in the ModalOverlay component. The solution here is to make the tooltip container, icons, and label to have a z-index of 5 so it displays above the modal. This visually has no effect on the tooltip in chat. Linear: https://linear.app/comm/issue/ENG-3451/show-message-tooltip-on-hover-in-the-pinned-messages-modal Depends on D7505 Please watch the video showing the behavior of the tooltip in both chat and the pinned messages modal
Diff Detail
Event Timeline
Comment Actions Is there a way to avoid specifying z-index? (usually when we use z-index in one place, it quickly becomes necessary in a lot of places) If there's no other way, can we limit the number of places where it has to be specified? Comment Actions I believe the z-index is necessary since we're rendering the message in the ModalOverlay, and that has a z-index of 4, so by default I think the tooltip will render below the modal.  I think alternatively, though like you say, we can limit the number of 'z-indexes' to just messageTooltipContainer and emojiKeyboard, and add a position: relative to messageTooltipContainer since z-index only works on positioned elements.
Comment Actions
Ahhh, that's exactly what I've described. The fact that z-index is used in one place made it necessary to use it in the other.
That's a good idea! | ||||||||||||||||||||||||||||||||||||||||