root/wireguard-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Restyle UI with Tailwind CSS: consistent cards, forms, tables and badges across all pages

Browse Source 
Co-authored-by: factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>
This commit is contained in:
lofyer
2026-07-04 07:54:22 +08:00
co-authored by factory-droid[bot] <138933559+factory-droid[bot]@users.noreply.github.com>
parent 628246c5c5
commit 08b32d2aa9
9 changed files with 466 additions and 277 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/static/status.js
+11 -9
View File
@@ -40,21 +40,23 @@ async function refresh() {
const tbody = document.querySelector("#peer-table tbody");
if (!tbody) return;
const badgeBase = "rounded-full px-2 py-0.5 text-xs font-medium";
tbody.innerHTML = "";
for (const p of data.peers) {
const tr = document.createElement("tr");
tr.className = "hover:bg-slate-50";
const badge = p.online
? '<span class="badge ok">online</span>'
? `<span class="${badgeBase} bg-emerald-100 text-emerald-700">online</span>`
: p.enabled
? '<span class="badge muted">offline</span>'
: '<span class="badge err">disabled</span>';
? `<span class="${badgeBase} bg-slate-100 text-slate-500">offline</span>`
: `<span class="${badgeBase} bg-red-100 text-red-700">disabled</span>`;
tr.innerHTML =
`<td><a href="/peers/${p.id}"></a></td>` +
`<td>${p.address}</td>` +
`<td>${badge}</td>` +
`<td>${fmtHandshake(p.latest_handshake)}</td>` +
`<td>${fmtBytes(p.rx_bytes)}</td>` +
`<td>${fmtBytes(p.tx_bytes)}</td>`;
`<td class="px-4 py-3"><a href="/peers/${p.id}" class="font-medium text-blue-600 hover:underline"></a></td>` +
`<td class="px-4 py-3 font-mono text-xs">${p.address}</td>` +
`<td class="px-4 py-3">${badge}</td>` +
`<td class="px-4 py-3 text-slate-500">${fmtHandshake(p.latest_handshake)}</td>` +
`<td class="px-4 py-3 text-slate-500">${fmtBytes(p.rx_bytes)}</td>` +
`<td class="px-4 py-3 text-slate-500">${fmtBytes(p.tx_bytes)}</td>`;
tr.querySelector("a").textContent = p.name;
tbody.appendChild(tr);
}