Pop-up button margin on mobile appears to be affected by length of Link

[evanwon]

Describe the bug
I noticed that my pop-up buttons margins were wider on my mobile device (Android 14) than they were on my desktop browser.

Here's an example on my browser on Windows using Firefox. As you can see, the buttons are all spaced properly and as expected.

And here's what that same horizontal button stack looks like on Android. Note the spacing between these buttons is much wider and somewhat inconsistent.

Through some trial-and-error, I found out that the value used in the Link attribute of the button appears to influence the button's margin on mobile.

For example: In the screenshot above with the wide spacing on mobile, here's the values I have for the "Living" button:

1_link: '#living_room'
1_name: Living

Now if I reduce the length of the link (from #living_room to #living), note that the margins also shrink and the button spacing looks good now

1_link: '#living'
1_name: Living

To Reproduce
Steps to reproduce the behavior:

1. Create a horizontal button stack using Bubble Cards
2. Add button with a long Link (e.g. #this_is_a_long_link)
3. Add another arbitrary button so you can see the margin between the two
4. On mobile (Android), note that the margin between the buttons is wider than expected
5. On desktop, note that the margin between the buttons is correct
6. Edit the link to be something shorter (e.g. #short
7. Perform Steps 4 and 5 again and note the difference

Expected behavior
The margin between buttons should not be affected by non-visible attributes

Screenshots
Please see above

Informations (please complete the following information):

• OS: Android 14 (Google Pixel 7)
• Browser: Firefox
• Bubble card version: v1.7.3
• Home Assistant 2024.5.5

Additional context
N/A

[evanwon]

I'll also note that I may be wrong on the relationship to link length and button margins - could totally be a red herring. Just seems like I can most directly influence it by changing the link length.

(i.e. maybe it's a caching issue based on the original name of the button, but I've cleared my mobile Firefox and Chrome caches, as well as the Home Assistant app cache, and haven't seen any difference.)

[Clooos]

Hi, this issue is fixed in the v2.0.0-beta, you can get it by going on the HACS page of Bubble Card, then on the 3 dot menu on the top right corner, then click on redownload, you will see the toggle to show the beta versions.

[evanwon]

@Clooos Fantastic, thank you -- yep, that seems to have resolved it.

Thanks for all of your work on this project, it's awesome.