Teste ça :
type: custom:button-card
entity: switch.volet_maison
icon: mdi:window-shutter-settings
show_name: false
styles:
icon:
- color: |
[[[
let volets = [
'cover.volet_bureau_cover_0',
'cover.volet_salon_cover_0',
'cover.volet_cuisine_cover_0',
'cover.volet_parents_cover_0',
'cover.volet_salle_a_manger_cover_0',
'cover.volet_teo_cover_0',
'cover.volet_laly_cover_0'
];
let positions = volets.map(e => states[e]?.attributes?.current_position);
if (positions.every(p => p === 0)) {
return "#404040"; // Fermé (gris)
} else if (positions.every(p => p === 100)) {
return "blue"; // Ouvert (bleu)
} else {
return "yellow"; // Intermédiaire (jaune)
}
]]]
- width: 25px
- height: 25px
card:
- background-color: |
[[[
let volets = [
'cover.volet_bureau_cover_0',
'cover.volet_salon_cover_0',
'cover.volet_cuisine_cover_0',
'cover.volet_chambre_cover_0',
'cover.volet_sdb_cover_0',
'cover.volet_garage_cover_0',
'cover.volet_buanderie_cover_0'
];
let positions = volets.map(e => states[e]?.attributes?.current_position);
if (positions.every(p => p === 0)) {
return "rgba(64, 64, 64, 0.5)"; // Fermé (gris foncé)
} else if (positions.every(p => p === 100)) {
return "rgba(0, 191, 255, 0.5)"; // Ouvert (bleu)
} else {
return "rgba(255, 255, 0, 0.5)"; // Intermédiaire (jaune)
}
]]]
- border-radius: 50%
- width: 40px
- height: 40px
- display: flex
- align-items: center
- justify-content: center
- backdrop-filter: blur(4px)
- box-shadow: 0 0 10px rgba(0, 0, 0, 0.1)
Essaye avec une nouvelle carte, sélectionne « Manuel » et copie le code tel quel.