feat: live ping pill widget (dashboard + /ping/ page with threshold settings)

fablednetmon/templates/base.html

@@ -26,6 +26,23 @@
             border-radius: 4px; cursor: pointer; font-size: 0.95rem;
         }
         button[type=submit]:hover, .btn:hover { background: #5050c0; }
+        /* Ping pills */
+        .ping-card { padding: 0.75rem 1.25rem; }
+        .ping-row { display:flex; align-items:center; gap:1rem; padding:0.45rem 0; border-bottom:1px solid #161626; }
+        .ping-row:last-child { border-bottom:none; }
+        .ping-meta { min-width:160px; flex-shrink:0; }
+        .ping-name { font-size:0.9rem; }
+        .ping-addr { display:block; color:#505070; font-size:0.75rem; }
+        .ping-pills { display:flex; gap:2px; flex:1; align-items:center; }
+        .pill { display:inline-block; width:7px; height:22px; border-radius:2px; cursor:default; transition:opacity .1s; }
+        .pill:hover { opacity:.75; }
+        .pill-empty { background:#1a1a28; }
+        .ping-cur { min-width:72px; text-align:right; font-size:0.85rem; font-variant-numeric:tabular-nums; }
+        .ping-cur-good { color:#22aa44; }
+        .ping-cur-warn { color:#ccaa20; }
+        .ping-cur-bad  { color:#dd6020; }
+        .ping-cur-down { color:#cc2020; font-weight:bold; }
+        .ping-cur-nd   { color:#404060; }
     </style>
     {% block head %}{% endblock %}
 </head>
@@ -35,6 +52,7 @@
         <span class="brand">FabledNetMon</span>
         <a href="/">Dashboard</a>
         <a href="/hosts/">Hosts</a>
+        <a href="/ping/">Ping</a>
         <a href="/alerts/">Alerts</a>
         <a href="/ansible/">Ansible</a>
         {% if session.user_role == 'admin' %}