<html lang="en"> <head> <title> {{ title }} </title> <style> ul { list-style-type: none; font-family: monospace; } li { border: 1px solid slategray; margin-bottom: 1px; } li:hover { filter: brightness(85%); } li.log-test { background-color: cyan; } li.log-node0 { background-color: lightblue; } li.log-node1 { background-color: lightgreen; } li.log-node2 { background-color: lightsalmon; } li.log-node3 { background-color: lightyellow; } </style> </head> <body> <ul> {% for event in log_events %} <li class="log-{{ event.source }}"> {{ event.source }} {{ event.timestamp }} {{event.event}}</li> {% endfor %} </ul> </body> </html>