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

[Cloos]

Bubble Card 2

v2.3.3 - Hotfix Release (again)!

Here’s a new version that fix some new issues introduced in v2.3.1/v2.3.2. Thank you again for your feedback!

• Media player border radius:
  Corrected the border radius for the media player card in the normal layout. #1034

• Box shadow variable for cover buttons:
  Fixed an issue where the box shadow variable was affecting the cover buttons instead of the card in the large layout. #1039

• Undefined message in console logs:
  Resolved an issue causing the browser console to be spammed with undefined messages.

Release Bubble Card v2.3.3 · Clooos/Bubble-Card

[Hallo]

Hello, thank you very much for your great work!

Since the update 2.3.0 and following, my dashboard, which consists exclusively of a Bubble card objects, is very very slow. Sometimes keystrokes take several seconds until the pop-up opens.

Does anyone else have such a problem? Before the update, it went wonderfully.

[MrBearPresident]

[v2.3.2] Bubble Card Buttons Unresponsive

[benjamin.schrupp (BenButton)]

Replacing innerText no longer works in 2.3.3 for me.
Its working in 2.3.0. All version above dont work.

type: custom:bubble-card
card_type: button
entity: scene.wdflurwhite_naturliches_licht_2
scrolling_effect: false
styles: >
  ${card.querySelector('.bubble-name').innerText =
  card.querySelector('.bubble-name').innerText.replace('WDFlurWhite ', '')}

[Menelao (Roberto)]

Try like this

type: custom:button-card
aspect_ratio: 10/3
custom_fields:
  value:
    card:
      type: custom:button-card
      entity: sensor.buro_klima_temperature
      show_icon: false
      show_state: true
      show_name: true
      name: "Indoor Temperature :"
      styles:
        name:
          - padding-left: 70px
          - justify-self: start
          - font-size: 0.9em
          - font-weight: bold
        state:
          - padding-left: 100px
          - justify-self: start
          - font-size: 0.7em
        card:
          - background-color: transparent
          - width: 500px
          - border-radius: 0%
          - z-index: 1
      tap_action:
        action: none
      hold_action:
        action: none
  graph:
    card:
      type: custom:mini-graph-card
      entities:
        - entity: sensor.buro_klima_temperature
      color_thresholds:
        - value: -20
          color: "#0000FF"
        - value: -10
          color: "#00BFFF"
        - value: 0
          color: "#ADD8E6"
        - value: 10
          color: "#00FF00"
        - value: 20
          color: "#80FF00"
        - value: 25
          color: "#FF8000"
        - value: 30
          color: "#FF0000"
      hours_to_show: 24
      hour24: true
      points_per_hour: 2
      animate: true
      update_interval: 30
      aggregate_func: avg
      line_width: 2
      bar_spacing: 5
      height: 100
      group: true
      show:
        labels: false
        fill: fade
        state: false
        name: false
        icon: false
      card_mod:
        style: |
          ha-card {
            --ha-card-background: rgba(0,0,0,0);
            border: none;
          }
styles:
  card:
    - background-color: var(--button-card-background-color)
  custom_fields:
    graph:
      - position: absolute
      - bottom: 0px
      - left: 0px
      - width: 100%
      - height: 70%
      - padding-bottom: 0
tap_action:
  action: none
hold_action:
  action: none

[MrBearPresident]

Hi

Due to some issues identified in the latest releases (v2.3.1, v2.3.2, v2.3.3), I have decided to mark them as pre-release versions. These updates may not be fully stable and could cause unexpected behavior. I strongly recommend rolling back to the latest stable release, v2.3.0, until further notice. This version has been thoroughly tested and provides a reliable experience. Thank you for your understanding and patience as we work to ensure a future updates that meets the highest standards of quality.

---

How to rollback

1. Click on the integration in HACS.
2. Click on the three dots icon top right of the page.
3. Select Redownload.
4. Choose the version you want from the dropdown list.
5. Click Download.

[dpedr]

Hi!.

I´m new using this wonderfull cards for H.A.
Have a question about Climate Card. I´m setting a sub button for HVAC modes, only turn Off or Heat. Works ok, but, where I can set the target temperature for Heating mode?. Actually sets 18º automatically.

Regards

[fela93]

How do I control the bubble card height

type: custom:bubble-card
card_type: separator
name: Rooms
icon: mdi:home
card_layout: large
styles: |-
  .bubble-line {
      background: '#ffffff';
      opacity: 0.5;
    }
visibility:
  - condition: screen
    media_query: "(min-width: 0px) and (max-width: 767px)"

[kexan82]

Is it possible to have a card be like a filling progress bar or meter? So its not swipable but shows % of defined value?

[RKCKBN]

Not directly, as far a I know. I’m using a slider card with a helper to show the minimum battery level of my equipment:

 - type: custom:bubble-card
    card_type: button
    button_type: slider
    entity: input_number.batterylevelhelper
    show_state: true
    slider_live_update: false
    show_attribute: false
    scrolling_effect: false
    show_last_changed: false
    styles: |
     
       ${(() => {
          hass.states['input_number.batterylevelhelper'].state = hass.states['sensor.batterie_level'].state
        })()}
       
    name: Battery Level
    icon: mdi:battery
    tap_action:
      action: navigate
      navigation_path: /[your path]
    double_tap_action:
      action: none
    hold_action:
      action: none

The input_number - helper is used as the entity and set with the sensor value. I can still manually slide the slider, but it jumps back to the sensor value after a second.

[Navypixel]

do you have full YAML available for this? this looks like a great idea for my upcoming landscape wall tablet project

[MrBearPresident]

See [Example] Progressbar, % bar · Clooos/Bubble-Card · Discussion #928 · GitHub

[MrBearPresident]

See ⚪ Bubble Card - A minimalist card collection for Home Assistant with a nice pop-up touch - #1912 by MrBearPresident

[MrBearPresident]

Hey

Can you send the yaml? Also a screenshot would be helpfull.

I’m a bit confused because in the climate card it is not possible for it to hide the temp settings.

[RKCKBN]

If I understand you correctly, you just want to have the sub-button with Off and Heat but no temperature selector button.

If so, you probably need to set the Heat temperature directly in the settings of your climate entity, not in bubble card. With bubble card you just select the presets.

[dpedr]

Sorry, bad explanation.
I don´t want to hide temp controls. I want to automatically set temp to 20º when select heat function on dropdown (now is 18º).

[MrBearPresident]

You will have to do this through an automation.

_{If you need help putting something up make a new post under Configuration.}

[prockeo (Paul)]

I am loving the bubble cards - especially the pop-up! I am in the process of transitioning my main dashboard, and have hit a small snag with the media player. I use Music Assistant, and would love to be able to expose the ‘Browse Media’ function. It’s there indirectly, if I click on the icon, and dig into the unerlying "more Info’ dialog, but I would love to have it exposed right on the player. I have a feeling I just missed it somewhere, but have searched and came up empty. Is there a way to do this?

Thanks!

[MrBearPresident]

What about something like this:

tap_action:
  action: navigate
  navigation_path: /media-browser/media_player.mass_entity_ID

[RichardU (Richard)]

FWIW, I’m successfully using sub-button visibility to replace a previous styles: display condition, however when I try the same thing inside a decluttering card it doesn’t work even when there are no variables in the visibility section.