#icon: mdi:home-variant-outline
title: Haus
path: floor
icon: 'mdi:floor-plan'
panel: true
cards:
  - type: picture-elements
    image: /local/images/floorplan/groundfloor.jpg
    elements:

      # This dims the background to make the lights show up better
      - type: image
        image: /local/images/floorplan/dim.png
        tap_action:
          action: none
        style:
          top: 50%
          left: 50%
          width: 100%
          opacity: .7

      # Küchen-Theke
      - type: custom:color-lite-card
        entity: light.kuchen_theke
        tap_action:
          action: none
        image:
          /local/images/floorplan/ground/kuchentheke.png
        style:
          top: 50%
          left: 50%
          width: 100%

      # Esstisch
      - type: custom:color-lite-card
        entity: light.esstisch
        tap_action:
          action: none
        image:
          /local/images/floorplan/ground/esstisch.png
        style:
          top: 50%
          left: 50%
          width: 100%

      # Stimmungslicht
      - type: custom:color-lite-card
        entity: light.stimmungslicht
        tap_action:
          action: none
        image:
          /local/images/floorplan/ground/stimmungslicht.png
        style:
          top: 50%
          left: 50%
          width: 100%

      # Clickables

      - type: image
        entity: light.kuchen_theke
        tap_action:
          action: toggle
        state_image:
          'on': /local/images/floorplan/lite.png
          'off': /local/images/floorplan/liteoff.png
        style:
          top: 66%
          left: 33%
          width: 5%

      - type: image
        entity: light.esstisch
        tap_action:
          action: toggle
        state_image:
          'on': /local/images/floorplan/lite.png
          'off': /local/images/floorplan/liteoff.png
        style:
          top: 60%
          left: 43%
          width: 5%

      - type: image
        entity: light.stimmungslicht
        tap_action:
          action: toggle
        state_image:
          'on': /local/images/floorplan/lite.png
          'off': /local/images/floorplan/liteoff.png
        style:
          top: 56%
          left: 55%
          width: 5%

    # cameras
      - type: image
        camera_image: camera.livingroom
        style:
          top: 10%
          left: 10%
          width: 15%
      - type: state-icon
        entity: switch.camera_livingroom_ir_lights
        tap_action:
          action: toggle
        style:
          top: 15%
          left: 25%
          width: 15%
      - type: state-icon
        entity: binary_sensor.motion_livingroom
        style:
          top: 12%
          left: 25%
          width: 15%

    # sensors
      - type: state-label
        entity: sensor.lumi_livingroom_temperature
        style:
          top: 50%
          left: 37%
          color: "#fff"
      - type: state-label
        entity: sensor.lumi_livingroom_humidity
        style:
          top: 50%
          left: 43%
          color: "#fff"

    # Now Playing
      - type: "custom:now-playing-poster"
        entity: media_player.spotify
        style:
          width: 7%
          top: 20%
          left: 32.3%
          transform: rotate(-28.5deg) rotateX(-50deg)