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

I’ve noticed this happening a lot since the update…

I have to refresh the edit page for the content to populate…

3 Likes

Glad you got it up and running!

Browser_mod is really powerful and useful for a huge amount of things in HA. Worth looking into.

It isn’t actually needed for this and you can simply use navigate in your tap action:

type: vertical-stack
cards:
  - type: custom:bubble-card
    card_type: pop-up
    hash: '#testpop'
    name: Settings
    icon: mdi:cog
    margin_top_desktop: 50%
    margin_top_mobile: 50%
    is_sidebar_hidden: true
    width_desktop: 50%
    styles: |
      #root { 
        opacity: 1; 
      }
    auto_close: '5000'
    margin: 0px
    back_open: false
  - type: custom:mushroom-media-player-card
    entity: media_player.toms_bedroom
    use_media_info: false
    show_volume_level: false
    media_controls:
      - play_pause_stop
      - next
      - previous
    collapsible_controls: false
    fill_container: true
    layout: horizontal
    name: Tom Bedroom
    volume_controls:
      - volume_set
  - show_name: true
    show_icon: false
    type: button
    tap_action:
      action: navigate
      navigation_path: '#testpop2'
    entity: light.8bc0abaa_120febac_screen
    show_state: false
    name: MORE POPUPS

I did it this way:

I have the code in this post.

Here you go mate. I added a “tag” starting with ‘ENTER_YOU_XXX’ where i could.

Repo:

Cloos Theme:

Get all the components listed in Cloos very detailed and easy to read guide(best I have seen so far by a contributing dev)

Bubble Card:

Again follow the guide and this forum post

Media card:
Sonarr:

Plex:

Enjoy!

1 Like

Sweet! Thank you!

What are you using for the PS5 integration?

THis is what i use:

super easy to setup and works really well

1 Like

ah brilliant. that’s what i’m using :slight_smile:

Can anyone tell me how to make the popup background the same color as the running track?

Are you trying to make the background color dynamically change?

1 Like

oh yes, that’s it, based on the track
@chintito4ever

Salut, j’utilise bubble-card cela fonctionne parfaitement sur pc mais sur mobile j’ai une erreur et je ne vois pas comment corriger cela. Si tu avais une piste à me donné.

En gros j’ai l’ensemble de mes cartes qui apparaît avec comme erreur “Custom element doesn’t exist: bubble-pop-up” cela me le fait avec le pop-up régulier ou optimisé.

The war against bugs and instability continues :unicorn:

v1.6.0-beta.2 :

Hi! Here is a new update that should fix all the new issues introduced in v1.6.0-beta.1. This new version was a huge challenge for me, as it involved a complete overhaul of the entire code structure. However, I sincerely hope that everything is working flawlessly now!

And given the uncertainty of getting another version out before the holidays, I’d like to take this opportunity to say Merry Christmas and Happy New Year to all of you! :christmas_tree:

:heavy_check_mark: Bug fixes

  • Fixed “bg_color, bg_opacity don’t work” #246
  • Fixed? “bubble card error android webiew” #247
  • This one should be definitely fixed “Reload issue still present on 1.6.0-1 beta” #248
  • This one too :crossed_fingers: “Beta v1.6 Won’t load on Android Companion App” #252
  • This one too? “Scrolling is not smooth on Android” #253

There is now a small issue with this fix from v1.6.0-beta.1 (but it works after a refresh):

  • Fixed the pop-ups background color that was not changing when switching themes.
1 Like

Take a look here:

1 Like

Hi @Cloos, congratulations on these cards! Do you know how to solve the problem described above?

Hi, I guess that it’s not possible (or pretty difficult to do) because that color is not just a color, it’s a gradient or a blurred image.

But I already did it for the background under the cover, but I can’t get it to work in the popup

Is there any way to have the popup button bar always be in front of the cards? When i open the first popup button it’s in front, but whenever i open any other card the bar is behind the card.

Hi! Just put your horizontal buttons stack at the last position of your dashboard to fix that :slightly_smiling_face:

3 Likes

So I tried this so well understood:

  • remove the js URL from the configuration.yaml - system reboot
  • go back to 1.4.4 - system reboot
  • modify my maps in yaml with ‘type: custom:bubble-pop-up’ - system reboot
  • upgrade via hacs to 1.5.3 - system reboot
  • add js URL to configuration - system reboot

But this was causing more trouble, because before I’d only had problems with the mobile version, but now it was doing it on the PC too. So I opted for the version with the added javascript resources, despite the advice you gave below, but there were no more problems. And I don’t think I have a big configuration because I don’t feel any slowdown.

Otherwise to be sure it is rather advised in the frontend to specify the version at the end of the url or not?

Otherwise thank you for this beautiful card.
Chakalis49 :wink:

Edit: I’m on a raspberry pi 4 2Go

Core: 2023.12.3
Supervisor: 2023.12.0
Operating System: 11.2
User Interface: 20231208.2


Alors j’ai essayer cela si bien compris:

  • supprimer l’URL js de la configuration.yaml - redémarrage système
  • revenir à 1.4.4 - redémarrage système
  • Modifier mes cartes en yaml avec ‘type: custom:bubble-pop-up’ - redémarrage système
  • mise à niveau via hacs vers 1.5.3 - redémarrage système
  • ajouter l’URL js à la configuration - redémarrage système

Mais cela causais plus de soucis car avant j’avais des soucis que sur la version mobile mais là cela le faisait aussi sur pc. J’ai donc opté pour la version de l’ajouté en ressources javascript malgré que tu déconseillais un peu plus bas, mais là plus aucun soucis. Et je ne pense pas avoir une grosse configuration car je ressens aucun ralentissement.

Sinon pour être sur il est plutôt conseillé dans le frontend de précisé la version à la fin de l’url ou non ?

Sinon merci pour cette magnifique carte.
Chakalis49 :wink:

Edit: Je suis sur un raspberry pi 4 2Go

  • Core: 2023.12.3
  • Supervisor: 2023.12.0
  • Operating System: 11.2
  • Interface utilisateur: 20231208.2