Example-Lovelace.yaml

title: Home Assistant


resources:


# Copy the .js file to the path below in your config dir

  - url: /local/js/color-lite-card.js?v=0.348
    type: js
    


views:
        
  - path: floorplan
    title: Main Floor
    background: "#000000"  
    panel: true    
    cards:
      - type: picture-elements
        image: /local/floorplan/house.jpg  
          
        elements:
        
        
        #  This is the light card
        
        
          - type: custom:color-lite-card
            entity: light.living_room_lamp   
            image:
              /local/floorplan/Lamp.png   
            color_image:
              /local/floorplan/LampColor.png           
            style:
              top: 50%
              left: 50%
              width: 100%  


    
    
    
    
        #  This is the control card.  
        #  Make sure it is after *all* full screen light cards so its on top.
    
    
          - type: image
            entity: light.living_room_lamp
            tap_action:
              action: toggle
            state_image:
              'on': /local/lite.png
              'off': /local/liteoff.png 

        #  Adjust top/left position so its over the light fixture 
            style:
              top: 73.1%
              left: 42.4%
              width: 12%