Skip to content

1.10.0

Compare
Choose a tag to compare
@RomRider RomRider released this 24 May 10:55
· 257 commits to master since this release
5ec35fd

BREAKING CHANGES

  • I had to change some default styles to support aspect ratio and icon auto-resizing, this might break some of your custom styles. Hopefully not too much. Feel free to request some help on the forum.
  • Deprecate style. Same result with:
    • before:
      style:
        - font-size: 10px
    • after:
      styles:
        card:
          - font-size: 10px

NEW FEATURES

  • You can now merge states together by id when using templates. The states you want to merge have to have the same id. This id parameter is new and can be anything (string, number, ...). States without id will still be appended. Styles embedded in a state are merged together as usual. Fixes #165

    button_card_templates:
      sensor:
        styles:
          card:
            - font-size: 16px
            - width: 75px
        tap_action:
          action: more-info
        state:
          - color: orange
            value: 75
            id: my_id
    
      sensor_humidity:
        template: sensor
        icon: 'mdi:weather-rainy'
        state:
          - color: 'rgb(255,0,0)'
            operator: '>'
            value: 50
          - color: 'rgb(0,0,255)'
            operator: '<'
            value: 25
    
      sensor_test:
        template: sensor_humidity
        state:
          - color: pink
            id: my_id
            operator: '>'
            value: 75
            styles:
              name:
                - color: '#ff0000'
    ############### Used like this ##############
      - type: custom:button-card
        template: sensor_test
        entity: input_number.test
        show_entity_picture: true

    Will result in this state object for your button (styles, operator and color are overridden for the id: my_id as you can see):

    state:
      - color: pink
        operator: '>'
        value: 75
        styles:
          name:
            - color: '#ff0000'
      - color: 'rgb(255,0,0)'
        operator: '>'
        value: 50
      - color: 'rgb(0,0,255)'
        operator: '<'
        value: 25
  • Icon will auto adapt to the height of the card and not only to it's width. This will enable you to skip using size: xx% when you defined the width, height or aspect-ratio of a card.

  • You can now define an aspect ratio for your cards using aspect_ratio in the main config, and the card will adapt to all of your screen size. This will enable you to skip setting the width and the height of a card to make it square for example.

    image

    - type: vertical-stack
      cards:
        - type: horizontal-stack
          cards:
            - type: custom:button-card
              name: 1/1
              icon: mdi:lightbulb
              aspect_ratio: 1/1
            - type: custom:button-card
              name: 2/1
              icon: mdi:lightbulb
              aspect_ratio: 2/1
            - type: custom:button-card
              name: 3/1
              icon: mdi:lightbulb
              aspect_ratio: 3/1
            - type: custom:button-card
              name: 4/1
              icon: mdi:lightbulb
              aspect_ratio: 4/1
        - type: horizontal-stack
          cards:
            - type: custom:button-card
              name: 1/1.2
              icon: mdi:lightbulb
              aspect_ratio: 1/1.2
            - type: custom:button-card
              name: 1/1.3
              icon: mdi:lightbulb
              aspect_ratio: 1/1.3
            - type: custom:button-card
              name: 1/1.4
              icon: mdi:lightbulb
              aspect_ratio: 1/1.4
            - type: custom:button-card
              name: 1/1.5
              icon: mdi:lightbulb
              aspect_ratio: 1/1.5
  • New option to ignore the light temperature (Fixes #153): color: auto-no-temperature

  • name_template and entity_picture_template. Also available per state (because why not). For both, the javascript code needs to return a string. Fixes #162

  • color: auto-no-temperature: This will have the same effect as color: auto but will ignore your light temperature.

  • When action: more-info, you can now define also an entity other than the one assigned to the card (Fixes #163):

    - type: custom:button-card
      entity: light.my_light
      tap_action:
        action: more-info
        entity: sensor.my_sensor