Home Assistant Söndag – Uppdaterar mina animerade Ikoner på min Dashboard som slutat fungera
Brukar sätta mig på söndagar och uppdatera saker som har slutat att fungera. I dag på min Home Assistant Söndag ska jag försöka få igång mina animerande ikoner som jag har på min Dashboard. De slutade att fungera vid en uppdatering för några veckor sedan och har inte riktigt haft energi att mecka med Dashboarden som i mina ögon bara är kosmetika.
Animerade Ikoner på Dashboarden
Jag har några ikoner på min Dashboard som jag har animerat för att få lite rörelse. T ex, Ventilationen olika lägen visas med olika fläkthastighet. Postlådan ändrar färg och ikonen ändras till ett brev samt gungar. När musik spelas hoppar högtalaren upp och ned och blir stilla när musiken pausas. Som sagt, bara kosmetiskt och har egentligen inga funktioner förutom att det är lite roligt.
Animeringen slutade att fungera
Vid något tillfälle efter en uppdatering slutade animeringen att fungera så idag har jag gjort om en del ikoner. Jag har nu bytt från Custom button card kortet till Mushroom.
Efter lite meckande har jag nu fungerande animationer igen och det tack vare Home Assistant Community. All information hittade jag på forumet och det är en användare: dimitri.landerloos som har lagt ned ett enormt arbete för att beskriva hur det går att modifiera Mushroom kortet.
Länk till all info där jag hittade informationen finns här: Mushroom Cards Card Mod Styling/Config Guide – Community Guides – Home Assistant Community (home-assistant.io)
Animerad fläkt
För att animera min ikon för fläkten så att den ändrar hastighet beroende på min ventilation har jag gjort så här. Som kort använder jag mushroom och i detta fallet mushroom template card.
type: custom:mushroom-template-card
primary: Vent
icon: mdi:fan
icon_color: blue
fill_container: true
layout: vertical
card_mod:
style: |
ha-state-icon {
--icon-symbol-size: 80px;
animation: {% if is_state('fan.hog', 'on') %} spin 1s linear infinite {% endif %};
}
ha-state-icon {
animation: {% if is_state('fan.lag', 'on') %} spin 5s linear infinite {% endif %};
}
ha-state-icon {
animation: {% if is_state('input_boolean.ventilation_normal', 'on') %} spin 2s linear infinite {% endif %};
}
}
Hoppande högtalaren
Den hoppande högtalaren använder mushroom template card.
type: custom:mushroom-template-card
primary: Musik!
icon: mdi:speaker
icon_color: red
layout: vertical
fill_container: true
card_mod:
style: |
ha-state-icon {
--icon-symbol-size: 80px;
animation: {% if is_state('media_player.sonos_kok', 'playing') or is_state('media_player.sonos_barbar', 'playing') or is_state('media_player.sonos_uterum', 'playing') %} jumping 1s linear infinite {% endif %};
}
@keyframes jumping {
0% { transform: translate(0,-5px); }
100% {transform: translate(0,5px); }
}
}
Läs mer om min Dashboard med Home Assistant: Dashboard med Home Assistant
