Horizontal buttons stack breaks layout in dashboard edit mode on mobile

[bthorsted]

Describe the bug
When editing a dashboard on mobile, the page width increases unexpectedly after adding a Horizontal Buttons Stack card. This means having to swipe left and right to find the dialog buttons and the Done button in the editor menu.

To Reproduce
Steps to reproduce the behavior:

1. On a mobile, go to any dashboard view
2. Click on the top right menu button and choose 'edit dashboard'
3. Click the '+' symbol to add a new view
4. Use the default (sections) type, add an arbitrary title and click Save
5. On the new view, click to add a card
6. Select Bubble Card
7. As card type, choose Horizontal buttons stack
8. Click Save
9. Layout becomes messed up while editing.

Expected behavior
No change to layout.

Screenshots
I made a screen recording of the issue. But it's too large to attach. Will add a link in the comments.

Informations (please complete the following information):

• OS: Android 15
• Browser/App: Home Assistant Companion app
• Bubble Card version: 2.4.0
• Home Assistant version: 2025.3.4

[Clooos]

Hi! I tried to reproduce your issue, but everything is working correctly on my side, but I'm on the latest beta, come back to me if you still have this issue after the update 🙂

[zofrea24]

Hi i have the same problem on mobile : as u can see in screenshot , the tablet show me the correct button format , but not the mobile. I have an iphone with the Home assistant application. Can anyone help me please?

[bthorsted]

I just tried to install the 2.5.0 beta 9 and the behavior seemed to have disappeared until I clicked edit on any card, at which point the screen was again too wide. I have linked to the video mentioned in OP here: link to screen capture of buggy behavior

[Clooos]

Hi, is this issue fixed in the latest release? Can I close this issue? 🙂

[zofrea24]

Hi yes Fixed thanks u.

On Sun, 11 May 2025 at 16:54, Cloos @.***> wrote:

Clooos left a comment (Clooos/Bubble-Card#1361) https://github.com/Clooos/Bubble-Card/issues/1361#issuecomment-2869918514

Hi, is this issue fixed in the latest release? Can I close this issue? 🙂

— Reply to this email directly, view it on GitHub https://github.com/Clooos/Bubble-Card/issues/1361#issuecomment-2869918514, or unsubscribe https://github.com/notifications/unsubscribe-auth/ATJJ34LZHQ4ZNYBEVLIDVSD255QBBAVCNFSM6AAAAABZTBUS5CVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDQNRZHEYTQNJRGQ . You are receiving this because you commented.Message ID: @.***>

[Clooos]

Your issue was different from @bthorsted's one, but glad yours is fixed 😄

[bthorsted]

@Clooos sadly, it is not yet fixed. However, I just realized that I can use pinch to zoom and if I zoom out all the way, then everything looks more or less like it should - apart from everything being much smaller, of course.

So, I suspect the issue is somehow related to how screen resolution is determined and handled by the css styles. Let me know if you need me to do do some logging or similar.

[bthorsted]

@Clooos just popping in to say that the issue persists in beta8 🙃

[Clooos]

Hi, I just tried again and I don't have this issue on my side, have you updated HA to the latest version?

[bthorsted]

@Clooos I just updated to beta-9 and I have the latest version of HA and the companion app, but the issue persists :( is there anything I can do to troubleshoot the issue?

[Clooos]

What HA version do you have?

Like I said I don't have this issue on my side, so I suspect something else, or maybe some custom styles on your side?

[bthorsted]

@Clooos, here is the relevant info: Installation method: Home Assistant OS Core: 2025.5.3 Supervisor: 2025.05.3 Operating System: 15.2 Frontend: 20250516.0 Android companion app: 2025.5.3

I don't have any card_mod styles applied to this dashboard, but I don't know if there are other ways to introduce custom styles. Could it be the theme I am using?

Edit: it does not appear to be caused by a custom theme. I just tried switching to the standard theme and the issue was still present.

[bthorsted]

@Clooos, I have discovered a crucial step missing from the steps to reproduce. In the companion app settings, there is an option to enable pinch-to-zoom and it turns out that it was enabled on my device. If I disable it, the issue disappears.

So there is something in the code that does not play nice with a device where zoom is enabled.

[Clooos]

That's very good to know! I will try to reproduce this way!

[github-actions[bot]]

There hasn't been any activity on this issue recently. Due to the high number of incoming GitHub notifications, we have to clean some of the old issues, as many of them have already been resolved with the latest updates. Please make sure to update to the latest version and check if that solves the issue. Let us know if that works for you by adding a comment 👍 This issue has now been marked as stale and will be closed if no further activity occurs. If you want to keep it open, please leave a comment. Thank you for your contributions.