Skip to content

Custom-card "Input Number"

The card_input_number you can control a input_number entity

Input Number Card

Credits

Author: sildehoop - 2021 Version: 1.1.0

Braking changes

1.1.0
#OLD
- type: "custom:button-card"
  template:
    - card_input_number
  variables:
    ulm_card_input_number_name: "YOUR_NAME"
    ulm_card_input_number_entity: "input_number.YOUR_INPUT_NUMBER"
#NEW
- type: "custom:button-card"
  template: card_input_number
  entity: input_number.YOUR_INPUT_NUMBER_ENTITY
  variables:
    ulm_card_input_number_name: "YOUR_CARD_NAME"

Changelog

1.1.0 Adds ability to work with counter entities. Compatibility with input number entities is not affected.
1.0.1 Added option to leave ulm_card_input_number_name empty (takes the friendly_name of the entity) Removed background from middle text (because it is not a button). Removed variables ulm_card_input_number_entity.
1.0.0 Initial release

Usage

- type: "custom:button-card"
  template: card_input_number
  entity: input_number.YOUR_INPUT_NUMBER
  variables:
    ulm_card_input_number_name: "YOUR_NAME"

Requirements

n/a

Variables

Variable Example Required Explanation
ulm_card_input_number_name Bathroom Ceiling Fan Threshold false The name to display on your card

Template code

Template Code
custom_card_input_number.yaml
---
card_input_number:
  variables:
    ulm_card_input_number_name: "[[[ return entity.attributes.friendly_name ]]]"
  triggers_update: "all"
  show_icon: false
  show_label: false
  show_name: false
  styles:
    grid:
      - grid-template-areas: "'item1' 'item2'"
      - grid-template-columns: "1fr"
      - grid-template-rows: "min-content  min-content"
      - row-gap: "12px"
    card:
      - border-radius: "var(--border-radius)"
      - box-shadow: "var(--box-shadow)"
      - padding: "12px"
  custom_fields:
    item1:
      card:
        type: "custom:button-card"
        template:
          - "icon_info"
          - "ulm_translation_engine"
          - "input_number"
        tap_action:
          action: "more-info"
        entity: "[[[ return entity.entity_id ]]]"
        name: "[[[ return variables.ulm_card_input_number_name ]]]"
    item2:
      card:
        type: "custom:button-card"
        template: "list_3_items"
        custom_fields:
          item1:
            card:
              type: "custom:button-card"
              template: "widget_icon"
              tap_action:
                action: "call-service"
                service: |
                  [[[
                    if( entity.entity_id.startsWith("input_number.") )
                      return "input_number.decrement";
                    if( entity.entity_id.startsWith("counter.") )
                      return "counter.decrement";
                    return "";
                  ]]]
                service_data:
                  entity_id: "[[[ return entity.entity_id ]]]"
              icon: "mdi:arrow-down"
          item2:
            card:
              type: "custom:button-card"
              template: "widget_text"
              entity: "[[[ return entity.entity_id ]]]"
              tap_action:
                action: "call-service"
                service: "cover.stop_cover"
                service_data:
                  entity_id: "[[[ return entity.entity_id ]]]"
          item3:
            card:
              type: "custom:button-card"
              template: "widget_icon"
              tap_action:
                action: "call-service"
                service: |
                  [[[
                    if( entity.entity_id.startsWith("input_number.") )
                      return "input_number.increment";
                    if( entity.entity_id.startsWith("counter.") )
                      return "counter.increment";
                    return "";
                  ]]]
                service_data:
                  entity_id: "[[[ return entity.entity_id ]]]"
              icon: "mdi:arrow-up"

input_number:
  tap_action:
    action: "more-info"
  show_last_changed: true

widget_text:
  tap_action:
    action: "toggle"
  template:
    - "ulm_translation_engine"
  show_icon: false
  show_label: true
  show_name: false
  label: "[[[ return variables.ulm_translation_state ]]]"
  styles:
    grid:
      - grid-template-areas: "'l'"
    card:
      - box-shadow: "none"
      - padding: "0px"
      - border-radius: "14px"
      - place-self: "center"
      - height: "42px"
    state:
      - color: "rgba(var(--color-theme),0.9)"
  size: "20px"
  color: "var(--google-grey)"