[Example] Auto-Entity Battery Card with Sliders

[Zerosignal84]

With the new slider update now showing battery states as a percentage of the bar I decided to switch my old auto populated battery card over to bubble!

Cards & Integrations used:

1. The excellent Battery Notes integration - https://github.com/andrew-codechimp/HA-Battery-Notes
2. Lovelace auto entities card - https://github.com/thomasloven/lovelace-auto-entities
3. Bubblecard 2.5 Beta 9

This is what the current auto population looks like, I might play around with the styling some more or maybe event take some advice from the gurus here.

Hope somebody finds this useful!

type: custom:auto-entities
card:
  square: false
  type: grid
  columns: 1
card_param: cards
filter:
  include:
    - entity_id: sensor.*battery_plus*
      options:
        type: custom:bubble-card
        card_type: button
        button_type: slider
        show_last_changed: true
        show_state: true
        read_only_slider: true
        scrolling_effect: false
        sub_button:
          - show_state: false
            show_icon: false
            state_background: false
            show_background: false
            show_attribute: true
            attribute: battery_type_and_quantity
        modules:
          - default
  exclude: []
sort:
  method: state
  numeric: true
  reverse: false
show_empty: true

[MetalOnes]

I like this, thanks!
I added conditional backgrounds by adding this style to the cards. Adjust the thresholds and RGB values as desired.

.bubble-range-fill {  
  background-color: rgba(${state > 50.0 ?  '39, 174, 96' : state > 20.0 ? '243, 156, 18' : '192, 57, 43'}, 0.4) !important;
}