[BUG] - Recipe button tooltips go over top navbar when scrolling

[shiruken]

First Check

• This is not a feature request.
• I added a very descriptive title to this issue (title field is above this).
• I used the GitHub search to find a similar issue and didn't find it.
• I searched the Mealie documentation, with the integrated search.
• I already read the docs and didn't find an answer.
• This issue can be replicated on the demo site (https://demo.mealie.io/).

What is the issue you are experiencing?

When scrolling, the recipe button tooltips go over the top navbar on mobile. This occurs for the Favorites, Timeline, and Edit buttons. The same occurs on desktop but is more difficult to catch since the tooltip only appears on hover.

screen-20240107-214904-compressed.mp4

Steps to Reproduce

On Mobile:

1. Long press on Favorites (heart) button on a recipe page until the tooltip appears.
2. Scroll down the page, the tooltip will go over the top navbar.

On Desktop:

1. Hover over the Favorites button until tooltip appears.
2. Quickly scroll down the page, the tooltip will go over the top navbar as it fades out.

Please provide relevant logs

N/A

Mealie Version

Version: v1.0.0-RC2
Build: c9852da

Deployment

Docker (Linux)

Additional Deployment Details

No response

[boc-the-git]

Have watched your video, thanks for that. The experience for me on desktop seems to be that the tooltip remains until I stop scrolling and/or move the cursor.
I can see a bit of what you're talking about, but I have no idea if this is solvable.

Have you dealt with it sticking around indefinitely? Which would therefore be an issue with some impact.

[shiruken]

Have you dealt with it sticking around indefinitely? Which would therefore be an issue with some impact.

I have not seen it persist indefinitely.

For additional context, I first encountered this bug after opening and closing the Timeline view for a recipe. The tooltip remains active even after the Timeline popup is closed (on both mobile and desktop), which means scrolling down the page results in the tooltip going over the navbar. If the user touches or clicks anywhere (dragging or scrolling doesn't count), the tooltip will close. This means this bug is at risk of happening every single time the recipe Timeline view is opened.