Finally made my first marquee (on a custom: button-card)

marquee alerts

After @mayker showed me the way and @ludeeus added his to Custom Header template showcase and discussion I had a lot of trial and tribulations…

finally made it to this today, and, whilst still simple, and open to a lot of improvement, I am quite happy with the result so far. Glad to share and give some back now!

this is the code:

type: conditional
conditions:
  - entity: binary_sensor.alerts #package package_hassio_pi4_system
    state: 'on'
card:
  type: custom:button-card
  name: >
    [[[return `<div style='display: flex;display: -webkit-flex;'>
       <div>Ha&nbspRpi4 alerts:&nbsp;</div>
       <marquee>
       <span style='color: red;'>
       Inside temperature: ${states['sensor.temperatuur_living'].state},&nbsp
       Outside temperature: ${states['sensor.temp_current'].state},&nbsp
       </span>
       <span style='color: var(--primary-color);'> 
       System alerts: ${states['sensor.marquee_alerts'].state}&nbsp</span>
       <span style='color: green;'>
       Summary - ${states['sensor.dark_sky_summary'].state},&nbsp
       Daily - ${states['sensor.dark_sky_daily_summary'].state}&nbsp
       Hourly - ${states['sensor.dark_sky_hourly_summary'].state}
       </span>
       </marquee>`]]]

next up the list is replacing the hard coded variable sensors in the card it self to card variables so I can easily change things. also the colors need to be using builtin colors like var(–primary–color) etc.

Please let me know if you can use this, and how to build on it!