Bug?: Can't scroll in pop-up card

[taikun114]

Hello.
I like the design of this card and was trying to create a dashboard with pop-up cards and found a problem, so I am reporting it here.

When I created a popup card within a dashboard, the inside of the popup card could not scroll and instead the dashboard scrolled, so I tried to figure out what the problem was.
As a result, it appears that if the height within the pop-up card is smaller than the display area of the browser, it will not scroll.

This is not a problem if the popup card is displayed at 100% height, but if the height is smaller (top margin is set), the card I want to control goes outside the screen and I cannot scroll, which is inconvenient...

I am not sure if this is correct as I am not familiar with it, but I think the height of the pop-up card is probably the same as the height of the browser's display area.
Therefore, even if the height of the pop-up card is reduced (top margin increased), it will only shift to the bottom of the screen, but the height of the pop-up card itself is not changed, so if the height within the pop-up card is smaller than the height of the browser's display area, then it will not be able to scroll.

Also, even if the height within the pop-up card is larger than the browser display, sometimes it cannot be scrolled to the end.
In order to scroll within the pop-up card to the end, I need to make the height of the browser's display area much larger.

I have captured the actual behavior, please see the video.
https://youtu.be/JNRQcdtnwXs?si=F7zmk82NvG5dbEFm

Therefore, after setting the top margin, in addition to shifting the pop-up card to the bottom of the screen, the height of the pop-up card needs to be reduced ("pop-up card height = browser display area height - top margin" need to be set?) I think so, and it would be very grateful if you could fix this.

My environment is the following:

• iMac (Retina 5K, 27-inch, 2020)
• macOS 14.2
• Brave Browser, Google Chrome, Safari

I tried the default theme and various themes, but they were the same.
I also tried clearing the browser cache and reloading but no change.

Thank you.

[Clooos]

Hi and thank you for your feedback. Can you try to add this style to your pop-up and tell me if it fixes your issue?

#234 (comment)

If not I will take a closer look at that issue.

[taikun114]

Thank you for your reply!
I tried it before and it didn't change, but I tried it again just to be sure and it didn't change.
When I scrolled over the pop-up card, the dashboard no longer scrolled, but I still could not scroll the pop-up card.

[Clooos]

Can you try the latest beta?

https://github.com/Clooos/Bubble-Card/releases/tag/v1.6.0-beta.5

[taikun114]

Thanks for your response.
I tried it and unfortunately it did not change at all.
The scrollable area was the same as before.

I tried re-downloading the latest beta version, reloading the page, and clearing the cache, but it made no difference.

[Clooos]

Hi, is this issue still here in the v2 beta?

Here is the full changelog:
https://github.com/Clooos/Bubble-Card/releases/tag/v2.0.0-beta.1

[taikun114]

Thanks for your response.
I installed it right away and tried it, and at first, when I displayed the popup, the background was just blurred and the popup itself did not appear.
However, when I changed the Top margin in the Styling options from "100vh - 300px" to "300px", it now works correctly!
I'm still in the first beta version, so maybe the top margin calculation is not working properly, but anyway, this problem seems to be solved. Thank you so much for your support!

[Clooos]

I'm glad that it's working! And indeed there was some changes from @brunosabot on that and it's possible that this value only works with a value in px now. I will take a look at that.