Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
---
url: /community_plugin/lovelace-card-mod/card-mod.js
type: js
icon: 'mdi:floor-plan'
id: 0
title: Floorplan
cards:
- type: vertical-stack
cards:
- type: picture-elements
image: /local/Floor0V.png
style: |
ha-card {
--car-back: {% if is_state('sensor.car_back', 'on') %} 34% {% else %} 200% {% endif %};
--car-center: {% if is_state('sensor.car_center', 'on') %} 45.5% {% else %} 200% {% endif %};
--car-front: {% if is_state('sensor.car_front', 'on') %} 61.0% {% else %} 150% {% endif %};
}
elements:
# garage Car detection
- image: /local/garage/bluecar_f.PNG
style:
left: 70%
top: var(--car-back)
width: 34.0%
transition-property: top
transition-duration: 10s
transition-timing-function: ease-in-out
tap_action:
action: none
type: image
- image: /local/garage/bluecar_f.PNG
style:
left: 70%
top: var(--car-center)
width: 34.0%
transition-property: top
transition-duration: 10s
transition-timing-function: ease-in-out
tap_action:
action: none
type: image
- image: /local/garage/greencar_b.PNG
style:
left: 70%
top: var(--car-front)
width: 34.0%
transition-property: top
transition-duration: 10s
transition-timing-function: ease-in-out
tap_action: none
type: image
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.