Paper-Buttons-Row question

Configuration Frontend
1

Hello experts,

I have a small question. I’m using the custom paper-buttons-row to have buttons for my garage door and main house door. I want to configure the garage door to show the state from another entity related to the garage door. Is this possible? Many thanks!!

To be precise:

  • I want to use the “binary_sensor.garage_door_door” entity’s state to show the color whether the garage door is closed or open (the current lock state does not work correctly).

image
image2050×1406 243 KB

2

Hi, from How to help us help you - or How to ask a good question → Format it properly

3

To start, I would verify your states defined under state_styles: match what is shown in Developer tools. The lock state should work.

You can always reference the binary_sensor as the entity and use tap_action to active the actual lock

An example with two different entities

type: entities
entities:
  - type: custom:paper-buttons-row
    buttons:
      - entity: light.pc_lights
        state_styles:
          'on':
            button:
              color: red
          'off':
            button:
              color: green
        tap_action:
          action: call-service
          service: light.toggle
          service_data:
            entity_id: light.bathroom_lights
1 Like
4

Thank you LiQuid_cOOled.

1 Like
5

Hey there i have a problem with backround. I want to chance de Background of the button (state of input select ) Auto / Home / Einkauf . So that button who is active . Is this possible?

entities:
  - type: custom:paper-buttons-row
    buttons:
      - entity: input_select.mobile_dashboard
        icon: mdi:shopping
        name: false
        state:
          attribute: state
        tap_action:
          action: call-service
          service: input_select.select_option
          service_data:
            entity_id: input_select.mobile_dashboard
            option: Einkauf
        styles:
          button:
            border-radius: 10px
            font-size: 1.2rem
            padding: 8px
          icon:
            "--mdc-icon-size": 40px
            color: white
        state_styles:
          Einkauf:
            button:
              background-color: "#C96868"
      - icon: mdi:home
        name: false
        tap_action:
          action: call-service
          service: input_select.select_option
          service_data:
            entity_id: input_select.mobile_dashboard
            option: Home
        styles:
          button:
            background-color: transparent
            border-radius: 10px
            font-size: 1.2rem
            padding: 8px
          icon:
            "--mdc-icon-size": 40px
            color: white
        state_styles:
          Home:
            button:
              background-color: "#252a38"
            ripple:
              color: orange
      - icon: mdi:car
        name: false
        tap_action:
          action: call-service
          service: input_select.select_option
          service_data:
            entity_id: input_select.mobile_dashboard
            option: Auto
        styles:
          button:
            background-color: transparent
            border-radius: 10px
            font-size: 1.2rem
            padding: 8px
          icon:
            "--mdc-icon-size": 40px
            color: white
        state_styles:
          Auto:
            button:
              background-color: "#252a38"
6

Yes, just add the other states to the state_styles for each button

An example:

type: custom:paper-buttons-row
buttons:
  - entity: input_select.mobile_dashboard
    icon: mdi:shopping
    name: false
    styles:
      button:
        border-radius: 10px
        font-size: 1.2rem
        padding: 8px
      icon:
        "--mdc-icon-size": 40px
        color: white
    state_styles:
      Einkauf:
        button:
          background-color: red
      Auto:
        button:
          background-color: grey
      Home:
        button:
          background-color: grey