feat(clients): live online dot + last-online tooltip on offline

Two small UX cues on the clients table online column:

- a pulsing green dot next to the Online tag so an active client reads as
  live at a glance (honors prefers-reduced-motion).
- hovering the Offline tag shows the client's last-online timestamp from
  record.traffic.lastOnline, formatted with the panel's calendar setting
  (or "-" when the client has never connected).
This commit is contained in:
MHSanaei
2026-06-01 06:17:30 +02:00
parent b67c4c2f81
commit c8df1b19ff
2 changed files with 30 additions and 3 deletions
@@ -62,6 +62,26 @@
.dot-orange { background: var(--ant-color-warning); }
.dot-gray { background: var(--ant-color-text-quaternary); }
.online-dot {
display: inline-block;
width: 7px;
height: 7px;
border-radius: 50%;
margin-inline-end: 5px;
vertical-align: middle;
background: var(--ant-color-success);
animation: online-blink 1.1s ease-in-out infinite;
}
@keyframes online-blink {
0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(82, 196, 26, 0.55); }
50% { opacity: 0.35; box-shadow: 0 0 0 4px rgba(82, 196, 26, 0); }
}
@media (prefers-reduced-motion: reduce) {
.online-dot { animation: none; }
}
.status-tag {
margin: 0 0 0 4px;
font-size: 11px;