un tout petit peu plus :
type: custom:button-card
aspect_ratio: 4/3
custom_fields:
fond:
card:
type: custom:button-card
styles:
card:
- background-color: rgba(255,255,255,0.0)
- border: none
tap_action:
action: none
hold_action:
action: none
ncarte:
card:
type: custom:button-card
name: Maison
styles:
name:
- font-size: 1.4em
- font-weight: bold
- justify-self: start
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.0)
- border: none
tap_action:
action: none
hold_action:
action: none
ngarage:
card:
type: custom:button-card
name: 'Garage :'
aspect_ratio: 10/0.9
styles:
name:
- font-size: 1.0em
- font-weight: bold
- justify-self: start
- padding-left: 4%
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.5)
tap_action:
action: none
hold_action:
action: none
garage:
card:
type: custom:button-card
aspect_ratio: 10/0.9
show_icon: false
name: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'off' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on')
return "(fermé)";
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return "(ouvert)";
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return "(en mouvement)";
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'off')
return "(partiellement ouvert)";
]]]
styles:
name:
- font-size: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'off' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on')
return '1.0em';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return '1.0em';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return '0.9em';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'off')
return '0.8em';
]]]
- font-weight: bold
- align-self: end
- color: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'off' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on')
return 'rgba(0,128,0,0.7)';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return 'rgba(255,0,0,0.7)';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return 'rgba(255,140,0,0.7)';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'off')
return 'rgba(255,140,0,0.7)';
]]]
- animation: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return 'blink 2s ease infinite';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return 'blink 2s ease infinite';
]]]
card:
- background-color: rgba(255,255,255,0.0)
- border: none
- padding-left: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'off' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on')
return '20%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return '20%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return '25%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'off')
return '30%';
]]]
- padding-top: |
[[[
if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'off' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on')
return '8.2%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'off')
return '8%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'on')
return '8%';
else if (states['binary_sensor.garage_detecteur_de_fermeture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_d_ouverture_porte_du_garage_contact'].state == 'on' && states['binary_sensor.garage_detecteur_de_vibration_porte_du_garage_vibration'].state == 'off')
return '7.8%';
]]]
tap_action:
action: none
hold_action:
action: none
nportail:
card:
type: custom:button-card
name: 'Portail :'
aspect_ratio: 10/0.9
styles:
name:
- font-size: 1.0em
- font-weight: bold
- justify-self: start
- padding-left: 4%
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.7)
tap_action:
action: none
hold_action:
action: none
portail:
card:
type: custom:button-card
aspect_ratio: 10/0.9
show_icon: false
name: (fermé)
styles:
name:
- font-size: 1.0em ]]]
- font-weight: bold
- align-self: end
- color: rgba(0,128,0,0.7)
- animation: ''
card:
- background-color: rgba(255,255,255,0.0)
- border: none
- padding-left: 20%
- padding-top: 8.5%
tap_action:
action: none
hold_action:
action: none
nlampe:
card:
type: custom:button-card
name: Lampe extérieure
styles:
name:
- font-size: 0.7em
- font-weight: bold
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.0)
- border: none
tap_action:
action: none
hold_action:
action: none
lampe:
card:
type: custom:button-card
size: 75%
entity: light.entree_lampe_exterieure_lumiere
icon: phu:wall-fuzo
show_name: false
state:
- value: 'off'
styles:
icon:
- color: dimgray
card:
- box-shadow: none
- border-radius: 50%
- background-color: rgba(242,242,242,0.7)
- width: 48px
- height: 48px
- value: 'on'
styles:
icon:
- color: rgb(255,255,128)
card:
- border-radius: 50%
- box-shadow: 0px 0px 6px 3px rgba(255,255,128,0.8)
- background-color: rgba(0,0,0,0.5)
- width: 48px
- height: 48px
nyann:
card:
type: custom:button-card
name: Yannick
styles:
name:
- font-size: 0.7em
- font-weight: bold
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.0)
- border: none
tap_action:
action: none
hold_action:
action: none
yann:
card:
type: custom:button-card
aspect_ratio: 1/1
size: 100%
entity: device_tracker.yannick_lecorvaisier
show_icon: false
show_entity_picture: true
show_name: false
styles:
card:
- border-radius: 50%
- background-color: rgba(255,255,255,0.7)
- width: 48px
- height: 48px
state:
- value: home
entity_picture: /local/images/yannick_home.png
styles:
entity_picture:
- opacity: 0.8
- value: not_home
entity_picture: /local/images/yannick_out.png
styles:
entity_picture:
- opacity: 0.8
tap_action:
action: none
hold_action:
action: none
nvero:
card:
type: custom:button-card
name: Véronique
styles:
name:
- font-size: 0.7em
- font-weight: bold
- color: rgba(0,0,0,0.6)
card:
- background-color: rgba(255,255,255,0.0)
- border: none
tap_action:
action: none
hold_action:
action: none
vero:
card:
type: custom:button-card
aspect_ratio: 1/1
size: 90%
entity: device_tracker.veronique_lecorvaisier
show_icon: false
show_entity_picture: true
show_name: false
styles:
card:
- border-radius: 50%
- background-color: rgba(255,255,255,0.7)
- width: 48px
- height: 48px
state:
- value: home
entity_picture: /local/images/vero_home.png
styles:
entity_picture:
- opacity: 0.8
- value: not_home
entity_picture: /local/images/vero_out.png
styles:
entity_picture:
- opacity: 0.8
tap_action:
action: none
hold_action:
action: none
garageup:
card:
type: custom:button-card
show_name: false
styles:
card:
- background-color: rgba(255,255,255,0.0)
- background-image: url(/local/images/icones/garage_ouvrir.png)
- background-size: cover
- border: none
- height: 48px
- width: 48px
tap_action:
action: call-service
service: script.garage_porte_du_garage_ouvrir
garagestop:
card:
type: custom:button-card
show_name: false
styles:
card:
- background-color: rgba(255,255,255,0.0)
- background-image: url(/local/images/icones/garage_stopper.png)
- background-size: cover
- border: none
- height: 48px
- width: 48px
tap_action:
action: call-service
service: script.garage_porte_du_garage_arreter
garagedown:
card:
type: custom:button-card
show_name: false
styles:
card:
- background-color: rgba(255,255,255,0.0)
- background-image: url(/local/images/icones/garage_fermer.png)
- background-size: cover
- border: none
- height: 48px
- width: 48px
tap_action:
action: call-service
service: script.garage_porte_du_garage_fermer
port_open:
card:
type: custom:button-card
show_name: false
styles:
card:
- background-color: rgba(255,255,255,0.0)
- background-image: url(/local/images/icones/portail_ouvrir.png)
- background-size: cover
- border: none
- height: 48px
- width: 48px
tap_action:
action: call-service
service: script.ouvrir_portail
port_close:
card:
type: custom:button-card
show_name: false
styles:
card:
- background-color: rgba(255,255,255,0.0)
- background-image: url(/local/images/icones/portail_fermer.png)
- background-size: cover
- border: none
- height: 48px
- width: 48px
tap_action:
action: call-service
service: script.fermer_portail
ncourrier:
card:
type: custom:button-card
entity: input_boolean.maison_courrier
show_icon: false
name: 'Courrier :'
styles:
name:
- font-size: 0.7em
- font-weight: bold
- color: rgba(0,0,0,0.6)
state:
- value: 'off'
styles:
card:
- background-color: rgba(255,255,255,0.0)
- border: none
name:
- color: rgba(0,0,0,0.6)
- value: 'on'
styles:
card:
- background-color: rgba(255,0,0,0.7)
- border: 1px solid lightgray
name:
- color: rgba(255,255,255,1.0)
tap_action:
action: none
hold_action:
action: none
courrier:
card:
type: custom:button-card
entity: input_boolean.maison_courrier
show_name: false
show_icon: false
styles:
card:
- background-color: rgba(255,255,255,1.0)
- background-image: url(/local/images/icones/courrier.png)
- background-size: cover
- border-radius: 50%
- border: none
- height: 48px
- width: 48px
state:
- value: 'off'
styles:
card:
- background-color: rgba(255,255,255,1.0)
- value: 'on'
styles:
card:
- background-color: rgba(255,0,0,1.0)
- animation: shadowcolorswap 3s linear infinite
extra_styles: |
@keyframes shadowcolorswap {
0% {
box-shadow: none;
}
25% {
box-shadow: 0px 0px 6px 3px rgba(255,0,0,0.8);
}
50% {
box-shadow: none;
}
75% {
box-shadow: 0px 0px 6px 3px rgba(255,0,0,0.8);
}
100% {
box-shadow: none;
}
tap_action:
action: call-service
service: script.reinitialiser_courrier
styles:
custom_fields:
fond:
- background-image: url(/local/images/maison.png)
- position: absolute
- left: 0
- top: 0
- width: 100%
- height: 100%
- background-size: cover
- background-position: center
- opacity: 0.5
ncarte:
- position: absolute
- left: 10px
- top: '-3px'
ngarage:
- width: 60%
- position: absolute
- left: 33%
- top: 14%
garage:
- width: 60%
- position: absolute
- left: 33%
- top: 14%
nportail:
- width: 60%
- position: absolute
- left: 33%
- top: 47%
portail:
- width: 60%
- position: absolute
- left: 33%
- top: 47%
nlampe:
- position: absolute
- left: 5%
- top: 28%
lampe:
- position: absolute
- left: 10%
- top: 35%
garageup:
- position: absolute
- left: 54%
- top: 23%
garagestop:
- position: absolute
- left: 68%
- top: 23%
garagedown:
- position: absolute
- left: 82%
- top: 23%
port_open:
- position: absolute
- left: 56%
- top: 57%
port_close:
- position: absolute
- left: 70%
- top: 57%
nyann:
- width: 15%
- position: absolute
- left: 5%
- top: 72%
yann:
- border-radius: 50%
- position: absolute
- left: 7%
- top: 78%
nvero:
- width: 20%
- position: absolute
- left: 20%
- top: 72%
vero:
- border-radius: 50%
- width: 60px
- position: absolute
- left: 24%
- top: 78%
ncourrier:
- border-radius: 50%
- width: 60px
- position: absolute
- left: 82.5%
- top: 72%
courrier:
- border-radius: 50%
- width: 60px
- position: absolute
- left: 84%
- top: 80%