Custom-card "Battery Chip"¶

This is a custom-card or custom-chip to see your device's battery level at a glance.

Screenshot

Credits¶

Author: Iñaki Abadia - 2024 Version: 1.0.0

Changelog¶

1.0.0

Initial release

Requirements¶

None

Usage¶

type: "custom:button-card"
template: custom_card_iAbadia_battery_chip
variables:
  ulm_custom_card_iAbadia_battery_chip_entity: sensor.living_room_sensor_battery
  ulm_custom_card_iAbadia_battery_chip_icon: mdi:thermostat
  ulm_custom_card_iAbadia_battery_chip_warning: 30
  ulm_custom_card_iAbadia_battery_chip_danger: 10

Variables¶

Variable	Example	Required	Explanation
ulm_custom_card_iAbadia_battery_chip_entity	`sensor.temperature`	✓	Battery entity
ulm_custom_card_iAbadia_battery_chip_icon	`mdi:thermometer`	✘	Icon to be displayed. Will default to mdi:battery
ulm_custom_card_iAbadia_battery_chip_warning	`20`	✘	Battery level below which to color as warning (yellow)
ulm_custom_card_iAbadia_battery_chip_danger	`10`	✘	Battery level below which to color as danger (red)

Template Code¶

Template Code

custom_card_irmajavi_speedtest.yaml

---
custom_card_iAbadia_battery_chip:
  template:
    - "chips"
  variables:
    ulm_custom_card_iAbadia_battery_chip_entity: ""
    ulm_custom_card_iAbadia_battery_chip_icon: ""
    ulm_custom_card_iAbadia_battery_chip_danger: "10"
    ulm_custom_card_iAbadia_battery_chip_warning: "20"
  show_icon: true
  triggers_update: "all"
  icon: >
    [[[
      if (variables.ulm_custom_card_iAbadia_battery_chip_icon){
        return variables.ulm_custom_card_iAbadia_battery_chip_icon;
      } else {
        return "mdi:battery"
      }
    ]]]
  entity: "[[[ return variables.ulm_custom_card_iAbadia_battery_chip_entity; ]]]"
  tap_action:
    action: "more-info"
    entity: "[[[ return variables.ulm_custom_card_iAbadia_battery_chip_entity; ]]]"
  styles:
    icon:
      - color: >
          [[[
            let battery_level = Math.round((states[variables.ulm_custom_card_iAbadia_battery_chip_entity].state)/1);
            if (battery_level > variables.ulm_custom_card_iAbadia_battery_chip_warning) {
              return "var(--google-green)"
            } else if (battery_level <= variables.ulm_custom_card_iAbadia_battery_chip_warning && battery_level > variables.ulm_custom_card_iAbadia_battery_chip_danger) {
              return "var(--google-yellow)"
            } else {
              return "var(--google-red)"
            }
          ]]]
    grid:
      - grid-template-areas: "'i'"