type: vertical-stack
cards:
  - type: conditional
    conditions:
      - entity: input_boolean.washer_washing
        state: 'on'
    card:
      type: picture-elements
      elements:
        - entity: sensor.washer
          icon: 'mdi:power'
          style:
            left: 35%
            top: 8%
          type: state-icon
        - attribute: remain_time
          entity: sensor.washer
          style:
            color: white
            font-size: 2em
            right: 19%
            top: 9%
          type: state-label
        - attribute: run_state
          entity: sensor.washer
          style:
            bottom: 5%
            font-size: 2em
            left: 50%
          type: state-label
      image: local/washer_washing.gif
  - type: conditional
    conditions:
      - entity: input_boolean.washer_drying
        state: 'on'
    card:
      type: picture-elements
      elements:
        - entity: sensor.washer
          icon: 'mdi:power'
          style:
            left: 35%
            top: 8%
          type: state-icon
        - attribute: remain_time
          entity: sensor.washer
          style:
            color: white
            font-size: 2em
            right: 19%
            top: 9%
          type: state-label
        - attribute: run_state
          entity: sensor.washer
          style:
            bottom: 5%
            font-size: 2em
            left: 50%
          type: state-label
      image: local/washer_drying.gif
  - type: conditional
    conditions:
      - entity: input_boolean.washer_spinning
        state: 'on'
    card:
      type: picture-elements
      elements:
        - entity: sensor.washer
          icon: 'mdi:power'
          style:
            left: 35%
            top: 8%
          type: state-icon
        - attribute: remain_time
          entity: sensor.washer
          style:
            color: white
            font-size: 2em
            right: 19%
            top: 9%
          type: state-label
        - attribute: run_state
          entity: sensor.washer
          style:
            bottom: 5%
            font-size: 2em
            left: 50%
          type: state-label
      image: local/washer_spin.gif
  - type: conditional
    conditions:
      - entity: sensor.washer
        state: 'off'
    card:
      type: picture-elements
      elements:
        - entity: sensor.washer
          icon: 'mdi:power'
          style:
            left: 35%
            top: 8%
          type: state-icon
        - attribute: remain_time
          entity: sensor.washer
          style:
            color: white
            font-size: 2em
            right: 19%
            top: 9%
          type: state-label
        - attribute: run_state
          entity: sensor.washer
          style:
            bottom: 5%
            font-size: 2em
            left: 50%
          type: state-label
      image: local/washer.png