Le code :
type: vertical-stack
cards:
- color: auto
color_type: icon
icon: 'mdi:gas-station-outline'
layout: icon_name
name: SP95
show_icon: true
show_label: false
show_last_changed: false
show_name: true
show_state: false
styles:
card:
- border-radius: 10px
- height: 50px
- width: 200px
- margin: 5px 5px 0px 0px
- padding: 0px 0px
- background-color: 'rgba(0,0,0,0)'
- box-shadow: none
grid:
- position: relative
icon:
- position: absolute
- left: 25px
- width: 30%
- top: 0px
- color: var(--sp95-color)
name:
- position: absolute
- left: '-20px'
- font-size: 20px
tap_action:
action: none
type: 'custom:button-card'
- color_type: icon
custom_fields:
price: |
[[[
return `
<span style="color: var(--text-color-sensor);">${states['sensor.essence_sp95_intermarche'].state}</span>`
]]]
name: Intermarché
show_icon: false
show_last_changed: false
show_name: true
styles:
card:
- border: 2px solid var(--primary-color)
- border-radius: 5px
- height: 1em
custom_fields:
price:
- background-color: 'rgba(0, 0, 0, 0)'
- position: absolute
- bottom: '-10px'
- right: 5px
- font-size: 15px
- line-height: 20px
- '--text-color-sensor': |
[[[
if ( (states['sensor.essence_sp95_best_price'].state == 'intermarche') ) return 'green';
else return 'var(--primary-color)';
]]]
grid:
- position: relative
name:
- font-variant: small-caps
- justify-self: start
- padding: 0 15px
- color: |
[[[
if ( (states['sensor.essence_sp95_best_price'].state == 'intermarche') ) return 'green';
else return 'var(--primary-color)';
]]]
type: 'custom:button-card'
color_type: icon
icon: 'mdi:gas-station-outline'
layout: icon_name
name: SP95
show_icon: true
show_label: false
show_last_changed: false
show_name: true
show_state: false
styles:
card:
- border-radius: 10px
- height: 50px
- width: 200px
- margin: 5px 5px 0px 0px
- padding: 0px 0px
- background-color: 'rgba(0,0,0,0)'
- box-shadow: none
grid:
- position: relative
icon:
- position: absolute
- left: 25px
- width: 30%
- top: 0px
- color: var(--sp95-color)
name:
- position: absolute
- left: '-20px'
- font-size: 20px
tap_action:
action: none
type: 'custom:button-card'
- color_type: icon
custom_fields:
price: |
[[[
return `
<span style="color: var(--text-color-sensor);">${states['sensor.essence_sp95_carrefour'].state}</span>`
]]]
name: Carrefour
show_icon: false
show_last_changed: false
show_name: true
styles:
card:
- border: 2px solid var(--primary-color)
- border-radius: 5px
- height: 1em
custom_fields:
price:
- background-color: 'rgba(0, 0, 0, 0)'
- position: absolute
- bottom: '-10px'
- right: 5px
- font-size: 15px
- line-height: 20px
- '--text-color-sensor': |
[[[
if ( (states['sensor.essence_sp95_best_price'].state == 'carrefour') ) return 'green';
else return 'var(--primary-color)';
]]]
grid:
- position: relative
name:
- font-variant: small-caps
- justify-self: start
- padding: 0 15px
- color: |
[[[
if ( (states['sensor.essence_sp95_best_price'].state == 'carrefour') ) return 'green';
else return 'var(--primary-color)';
]]]
type: 'custom:button-card'