Skip to content
This repository was archived by the owner on Jul 28, 2026. It is now read-only.

Commit 9458155

Browse files
committed
refactor: replace all inline SVGs with Lucide icons
1 parent de0327c commit 9458155

3 files changed

Lines changed: 110 additions & 79 deletions

File tree

public/index.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
<link rel="stylesheet" href="/css/style.css" />
1212
<script src="https://cdn.jsdelivr.net/npm/cap-widget@0.1.56"></script>
1313
<script src="https://cdn.jsdelivr.net/npm/chart.js@4.4.7/dist/chart.umd.min.js"></script>
14+
<script src="https://unpkg.com/lucide@latest"></script>
1415
</head>
1516
<body>
1617

public/js/admin.js

Lines changed: 25 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1+
function initIcons() { if (window.lucide) lucide.createIcons(); }
2+
13
const ADMIN_STORAGE_KEY = 'zh_admin_token';
24

35
const adminState = {
@@ -197,23 +199,23 @@ function renderAdminLayout() {
197199
</div>
198200
<div class="admin-navbar-center">
199201
<a class="admin-nav-link" data-page="dashboard" href="/admin/dashboard">
200-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/></svg>
202+
<i data-lucide="grid-3x3" style="width:18px;height:18px"></i>
201203
Dashboard
202204
</a>
203205
<a class="admin-nav-link" data-page="servers" href="/admin/servers">
204-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><circle cx="6" cy="6" r="1" fill="currentColor"/><circle cx="6" cy="18" r="1" fill="currentColor"/></svg>
206+
<i data-lucide="server" style="width:18px;height:18px"></i>
205207
Servers
206208
</a>
207209
<a class="admin-nav-link" data-page="users" href="/admin/users">
208-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 0 0-3-3.87"/><path d="M16 3.13a4 4 0 0 1 0 7.75"/></svg>
210+
<i data-lucide="users" style="width:18px;height:18px"></i>
209211
Users
210212
</a>
211213
<a class="admin-nav-link" data-page="activity" href="/admin/activity">
212-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M22 12h-4l-3 9L9 3l-3 9H2"/></svg>
214+
<i data-lucide="activity" style="width:18px;height:18px"></i>
213215
Activity
214216
</a>
215217
<a class="admin-nav-link" data-page="settings" href="/admin/settings">
216-
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.68 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.68a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06A1.65 1.65 0 0 0 19.4 9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
218+
<i data-lucide="settings" style="width:18px;height:18px"></i>
217219
Settings
218220
</a>
219221
</div>
@@ -254,6 +256,7 @@ function renderAdminLayout() {
254256
});
255257

256258
initAdminDateTooltip();
259+
initIcons();
257260

258261
const path = window.location.pathname.replace('/admin/', '').split('/');
259262
const basePage = path[0] || 'dashboard';
@@ -408,6 +411,7 @@ async function renderAdminServers() {
408411
const tbody = $a('#admin-servers-tbody');
409412
if (tbody) tbody.innerHTML = `<tr><td colspan="6" style="text-align:center;padding:32px;color:var(--accent-red)">Error: ${err.message}</td></tr>`;
410413
}
414+
initIcons();
411415
}
412416

413417
async function renderAdminServerDetail(serverId) {
@@ -435,7 +439,7 @@ async function renderAdminServerDetail(serverId) {
435439
detailPage.innerHTML = ahtml`
436440
<div class="page-header">
437441
<a href="/admin/servers" onclick="event.preventDefault();adminNavigateTo('servers')" class="btn btn-ghost btn-sm" style="display:inline-flex;width:auto;margin-bottom:16px">
438-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
442+
<i data-lucide="arrow-left" style="width:14px;height:14px"></i>
439443
Back to Servers
440444
</a>
441445
<div style="display:flex;align-items:center;gap:16px;flex-wrap:wrap">
@@ -511,6 +515,7 @@ async function renderAdminServerDetail(serverId) {
511515

512516
initAdminTabs();
513517
initAdminActions(serverId);
518+
initIcons();
514519
} catch (err) {
515520
detailPage.innerHTML = ahtml`
516521
<div class="page-header">
@@ -918,6 +923,7 @@ async function renderAdminUsers() {
918923
const tbody = $a('#admin-users-tbody');
919924
if (tbody) tbody.innerHTML = `<tr><td colspan="7" style="text-align:center;padding:32px;color:var(--accent-red)">Error: ${err.message}</td></tr>`;
920925
}
926+
initIcons();
921927
}
922928

923929
// ─── User Detail ────────────────────────────────────────
@@ -938,7 +944,7 @@ async function renderAdminUserDetail(userId) {
938944
el.innerHTML = ahtml`
939945
<div class="page-header">
940946
<a href="/admin/users" onclick="event.preventDefault();adminNavigateTo('users')" class="btn btn-ghost btn-sm" style="display:inline-flex;width:auto;margin-bottom:16px">
941-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
947+
<i data-lucide="arrow-left" style="width:14px;height:14px"></i>
942948
Back to Users
943949
</a>
944950
<div style="display:flex;align-items:center;gap:16px;flex-wrap:wrap">
@@ -1053,6 +1059,7 @@ async function renderAdminUserDetail(userId) {
10531059

10541060
initUserTabs();
10551061
initUserActions(userId);
1062+
initIcons();
10561063
} catch (err) {
10571064
el.innerHTML = ahtml`
10581065
<div class="page-header">
@@ -1250,14 +1257,15 @@ async function renderAdminSettings() {
12501257
<div class="settings-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px">
12511258
<div class="card settings-card" style="cursor:pointer;padding:24px;transition:var(--transition);border:1px solid var(--border);border-radius:var(--radius-md)" id="settings-eggs-entry" onmouseover="this.style.borderColor='var(--accent-1)'" onmouseout="this.style.borderColor='var(--border)'">
12521259
<div style="font-size:1.5rem;margin-bottom:8px">
1253-
<svg width="32" height="32" viewBox="0 0 24 24" fill="none" stroke="var(--accent-1)" stroke-width="2"><path d="M12 2a8 8 0 0 0-8 8c0 3.5 2 6.5 4 8.5S11 22 12 22s2-1.5 4-3.5 4-5 4-8.5a8 8 0 0 0-8-8z"/><circle cx="12" cy="12" r="3"/></svg>
1260+
<i data-lucide="egg" style="width:32px;height:32px;color:var(--accent-1)"></i>
12541261
</div>
12551262
<h2 class="card-title" style="margin-bottom:4px">Eggs Settings</h2>
12561263
<p style="color:var(--text-secondary);font-size:0.85rem;margin:0">Manage nests, eggs, and per-egg resource overrides</p>
12571264
</div>
12581265
</div>
12591266
`;
12601267
$a('#settings-eggs-entry')?.addEventListener('click', () => adminNavigateTo('settings/eggs'));
1268+
initIcons();
12611269
}
12621270

12631271
// ─── Eggs Settings: Nests List ──────────────────────────
@@ -1269,8 +1277,8 @@ async function renderAdminEggsSettings() {
12691277
el.innerHTML = ahtml`
12701278
<div class="page-header">
12711279
<a href="/admin/settings" onclick="event.preventDefault();adminNavigateTo('settings')" class="btn btn-ghost btn-sm" style="display:inline-flex;width:auto;margin-bottom:16px">
1272-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
1273-
Back to Settings
1280+
<i data-lucide="arrow-left" style="width:14px;height:14px"></i>
1281+
Back to Settings
12741282
</a>
12751283
<div style="display:flex;align-items:center;gap:16px;flex-wrap:wrap">
12761284
<h1 class="page-title" style="margin-bottom:0">Eggs Settings</h1>
@@ -1344,8 +1352,8 @@ async function renderAdminNestEggs(nestId) {
13441352
el.innerHTML = ahtml`
13451353
<div class="page-header">
13461354
<a href="/admin/settings/eggs" onclick="event.preventDefault();adminNavigateTo('settings/eggs')" class="btn btn-ghost btn-sm" style="display:inline-flex;width:auto;margin-bottom:16px">
1347-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
1348-
Back to Nests
1355+
<i data-lucide="arrow-left" style="width:14px;height:14px"></i>
1356+
Back to Nests
13491357
</a>
13501358
<h1 class="page-title" style="margin-bottom:0">Eggs</h1>
13511359
<p class="page-subtitle">Nest ID: ${nestId}</p>
@@ -1399,6 +1407,7 @@ async function renderAdminNestEggs(nestId) {
13991407
const tbody = $a('#admin-eggs-tbody');
14001408
if (tbody) tbody.innerHTML = `<tr><td colspan="5" style="text-align:center;padding:32px;color:var(--accent-red)">Error: ${err.message}</td></tr>`;
14011409
}
1410+
initIcons();
14021411
}
14031412

14041413
// ─── Eggs Settings: Egg Resource Configuration ──────────
@@ -1410,8 +1419,8 @@ async function renderAdminEggSettings(nestId, eggId) {
14101419
el.innerHTML = ahtml`
14111420
<div class="page-header">
14121421
<a href="/admin/settings/eggs/${nestId}" onclick="event.preventDefault();adminNavigateTo('settings/eggs/${nestId}')" class="btn btn-ghost btn-sm" style="display:inline-flex;width:auto;margin-bottom:16px">
1413-
<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M19 12H5M12 19l-7-7 7-7"/></svg>
1414-
Back to Eggs
1422+
<i data-lucide="arrow-left" style="width:14px;height:14px"></i>
1423+
Back to Eggs
14151424
</a>
14161425
<h1 class="page-title" style="margin-bottom:0">Egg Resources</h1>
14171426
<p class="page-subtitle" id="admin-egg-name">Loading...</p>
@@ -1509,6 +1518,8 @@ async function renderAdminEggSettings(nestId, eggId) {
15091518
}
15101519
});
15111520

1521+
initIcons();
1522+
15121523
$a('#btn-save-egg-resources-all')?.addEventListener('click', async () => {
15131524
if (!confirm('Apply these resources to ALL existing servers using this egg? This will update their limits on the panel.')) return;
15141525
const btn = $a('#btn-save-egg-resources-all');

0 commit comments

Comments
 (0)