⚪ Bubble Card - A minimalist card collection for Home Assistant with a nice pop-up touch

In HACS go to Bubble Card, on the 3 dots icon on the top right corner go to re-download then select the version you want.

I have rolled back to beta version, restarted HA and clear my cache, The problem is still present. I am not sure what caused this. After thorough check, it works fine with my other dashboard. :thinking:

Can you try with a fresh pop-up then? I hope that you will find what is causing this. Keep me informed if you made any progress.

v1.1.0 - Design enhancements and new styling options!

:bulb: New features:

  • The pop-ups have undergone a slight visual transformation, and they look great!
  • A new animation has been added to the horizontal-buttons-stack that activates once the page has loaded. This can be disabled with rise_animation: false.
  • Introduced bg_color to modify the background color of a pop-up.
  • Introduced bg_opacity to adjust the background opacity of a pop-up. The previous default was bg_opacity: 100.
  • Introduced bg_blur to alter the background blur effect of a transparent pop-up. The previous default was bg_blur: 0.
  • Introduced shadow_opacity to adjust the shadow opacity of a pop-up. The previous default was shadow_opacity: 0.
  • All new options are accessible in the GUI editor.

:heavy_check_mark: Fixes

  • Minor enhancements have been implemented.

More styling options for the other cards will be added soon. Please feel free to open an issue for any specific styling requests.

I really appreciate your feedback on any issues you may encounter, and thank you once again for your continued support!

5 Likes

I tried with a fresh pop-up, still having the same problem. Other thing to note is that, the page/dashboard im having problem with is the one with kiosk mode enabled to hide the top bar disappeared in the app. the one thats working is without this kiosk mode.

edit: so it is the kiosk mode enabled. i removed it from one of my page and the pop up works. Is it a bug or it just doesnt work with kiosk mode enabled? hopefully there will be a fix :pensive:

Kiosk mode is old and not maintened anymore, they are better ways to hide your header on mobile with card-mod for example.

If you are using a theme you can just add this at the end of your theme yaml, just edit the first line and you will have no header on mobile (only) anymore :

  card-mod-theme: the_name_of_your_theme
  
  card-mod-root-yaml: |
    .: |
      @media only screen and (max-width: 768px) {
          .header {
            display: none;
            opacity: 0;
          }
          #view {
            padding-top: 0 !important;
            margin-top: 0 !important;
            height: calc(100vh - env(safe-area-inset-top)) !important;
          }
      }

And to display the header just put your device in landscape mode or move to your computer.

It’s possible to hide it on all resolutions too like that, but add a button somewhere on your dashboard to navigate to your settings page, just in case:

  card-mod-theme: the_name_of_your_theme
  
  card-mod-root-yaml: |
    .: |
      .header {
        display: none;
        opacity: 0;
      }
      #view {
        padding-top: 0 !important;
        margin-top: 0 !important;
        height: calc(100vh - env(safe-area-inset-top)) !important;
      }
2 Likes

Trying to give these a whirl, but I’m feeling pretty dumb on step 0 here. It says it’s mostly editable through the GUI, but all I get is this screen and no matter what I select in the dropdownlist, it says “You need to add a card type first.”

Feel like I’m missing something really obvious, but all the instructions just say to use the GUI editor… :\

Nope you are not doing anything wrong, but I did :sweat_smile: I will release a new version!

Edit: It’s now fixed, thanks for pointing me this issue!

2 Likes

i suppose i have to put numbers in the ‘safe-area-inset-top’? and in what unit? sorry i am not that advanced yet :sweat_smile:

like this?

Nope, just replace the first line with “card-mod-theme: mushroom-shadow” and you should be good :slightly_smiling_face:

I got it! Thank you so much! :grin:

Not true. Original Kiosk Mode was stopped last year, but quickly another community member picked it up and is very active on it. It even had a new release last week. It also has many more features than the original ever had.

This the correct one, which is still maintained very actively: GitHub - NemesisRE/kiosk-mode: 🙈 Hides the Home Assistant header and/or sidebar

4 Likes

Good to know! Thanks!

1 Like

v1.2.0 - A lightning fast release!

This update doesn’t come with any new features, but it is a major release because it brings significant improvements to the speed and efficiency of the code execution. I’ve found 2 major memory leaks and fixed them to ensure that everything loads almost instantaneously, like the pop-ups, even with a lot of them!

This means a (lot) smoother and faster experience for everyone!

Changelog:

:heavy_check_mark: Fixes

  • Fixed 2 major (and really huuuuuge) memory leaks.
  • Fixed a centering issue of the pop-ups on some resolutions.

I really appreciate your feedback on any issues you may encounter, and thank you once again for your continued support!

3 Likes

iv got an issue since v1.1.0… see the image… Bottom is black and strange blurred

2 Likes

It’s probably because of the new shadow I’ve added, to fix that you can temporary add shadow_opacity: 0 to all your pop-ups. But I will fix that in the next release tomorrow, thanks for the feedback!

I have the same problem. The pop-up takes 5 to 10 seconds to open. In addition, as soon as I created a bubble card, all my HA slowed down.

And it was not the case on v1.1.0? It’s so weird because on my end it’s incredibly faster.

Just found this, and love it. Super easy and looks amazing.

One thing before I start migrating a number of specific views.

As I read/try, then all code needs to be in the same view in a dashboard.

As I have a number of different “standard views” I would like to point to one pop-up card from several views/dashboards.

If I need to create and maintain it for each view, it will lead to manual errors (done by me).

Is this possible?

Thanks! For now there is no way to have any kind of templating, and it’s not working with decluttering-card. The main goal of Bubble Card is to have everything on one page.

1 Like