Skip to content

Commit 728f312

Browse files
author
Datanoise
committed
style: add tooltips to bottom bar icons and fix layout jumping
1 parent f91d158 commit 728f312

2 files changed

Lines changed: 17 additions & 16 deletions

File tree

‎server/templates/admin.html‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -69,7 +69,7 @@
6969
.bottom-stats-bar { position: fixed; bottom: 0; right: 0; left: 240px; background: rgba(22, 27, 44, 0.7); backdrop-filter: blur(16px); border-top: 1px solid var(--border); padding: 0.5rem 1.5rem; display: flex; align-items: center; justify-content: space-between; z-index: 900; transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); height: 40px; }
7070
.bottom-stats-bar.collapsed { transform: translateY(40px); }
7171
.stats-items { display: flex; gap: 1.5rem; align-items: center; overflow-x: auto; flex: 1; }
72-
.stats-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.75rem; color: var(--text-dim); white-space: nowrap; }
72+
.stats-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.75rem; color: var(--text-dim); white-space: nowrap; min-width: 100px; }
7373
.stats-item strong { color: var(--primary); font-weight: 700; }
7474
.stats-toggle-tongue { position: absolute; top: -24px; right: 2rem; background: rgba(22, 27, 44, 0.7); backdrop-filter: blur(16px); border: 1px solid var(--border); border-bottom: none; padding: 4px 12px; border-radius: 8px 8px 0 0; cursor: pointer; color: var(--text-dim); display: flex; align-items: center; justify-content: center; height: 24px; box-sizing: border-box; }
7575
.stats-toggle-tongue:hover { color: var(--text); background: var(--surface-hover); }
@@ -574,36 +574,36 @@ <h2>Top Connection Scanners (404s)</h2>
574574

575575
<!-- Fixed Bottom Stats Bar -->
576576
<div class="bottom-stats-bar" id="bottom-stats-bar">
577-
<div class="stats-toggle-tongue" onclick="toggleStatsBar()">
577+
<div class="stats-toggle-tongue" onclick="toggleStatsBar()" title="Toggle Stats Bar">
578578
<i data-lucide="chevron-down" id="stats-toggle-icon" style="width: 16px; height: 16px;"></i>
579579
</div>
580580
<div class="stats-items">
581-
<div class="stats-item">
582-
<i data-lucide="users" style="width: 14px; height: 14px;"></i>
581+
<div class="stats-item" style="min-width: 110px;">
582+
<i data-lucide="users" style="width: 14px; height: 14px;" title="Current Listeners"></i>
583583
<span>Listeners: <strong id="global-listeners">0</strong></span>
584584
</div>
585-
<div class="stats-item">
586-
<i data-lucide="tower-control" style="width: 14px; height: 14px;"></i>
585+
<div class="stats-item" style="min-width: 160px;">
586+
<i data-lucide="tower-control" style="width: 14px; height: 14px;" title="Active Broadcasting Sources"></i>
587587
<span>Sources: <strong id="global-sources">0</strong></span>
588588
<span style="font-size: 0.7rem; opacity: 0.7;">(<span id="stat-streamers" style="color: var(--success)">0</span> / <span id="stat-relays" style="color: var(--warning)">0</span>)</span>
589589
</div>
590-
<div class="stats-item">
591-
<i data-lucide="arrow-down-circle" style="width: 14px; height: 14px; color: var(--success);"></i>
590+
<div class="stats-item" style="min-width: 100px;">
591+
<i data-lucide="arrow-down-circle" style="width: 14px; height: 14px; color: var(--success);" title="Total Data Received"></i>
592592
<span>In: <strong id="global-mb-in">0.00</strong> MB</span>
593593
</div>
594-
<div class="stats-item">
595-
<i data-lucide="arrow-up-circle" style="width: 14px; height: 14px; color: var(--primary);"></i>
594+
<div class="stats-item" style="min-width: 100px;">
595+
<i data-lucide="arrow-up-circle" style="width: 14px; height: 14px; color: var(--primary);" title="Total Data Sent"></i>
596596
<span>Out: <strong id="global-mb-out">0.00</strong> MB</span>
597597
</div>
598598

599599
<!-- Debug Stats (only visible in ?debug mode) -->
600600
<div class="debug-items" id="debug-stats-bar" style="display: none;">
601-
<div class="stats-item" title="System RAM"><i data-lucide="cpu"></i> <span id="debug-ram">0 B</span></div>
602-
<div class="stats-item" title="Heap Alloc"><i data-lucide="database"></i> <span id="debug-heap">0 B</span></div>
603-
<div class="stats-item" title="Goroutines"><i data-lucide="layers"></i> <span id="debug-goroutines">0</span></div>
604-
<div class="stats-item" title="GC Cycles"><i data-lucide="refresh-cw"></i> <span id="debug-gc">0</span></div>
605-
<div class="stats-item" title="Total Dropped"><i data-lucide="trash"></i> <span id="debug-loss">0 B</span></div>
606-
<div class="stats-item" title="Uptime"><i data-lucide="clock"></i> <span id="debug-uptime">0s</span></div>
601+
<div class="stats-item" style="min-width: 80px;"><i data-lucide="cpu" title="System RAM Usage"></i> <span id="debug-ram">0 B</span></div>
602+
<div class="stats-item" style="min-width: 80px;"><i data-lucide="database" title="Heap Memory Allocation"></i> <span id="debug-heap">0 B</span></div>
603+
<div class="stats-item" style="min-width: 70px;"><i data-lucide="layers" title="Active Goroutines"></i> <span id="debug-goroutines">0</span></div>
604+
<div class="stats-item" style="min-width: 70px;"><i data-lucide="refresh-cw" title="Garbage Collection Cycles"></i> <span id="debug-gc">0</span></div>
605+
<div class="stats-item" style="min-width: 90px;"><i data-lucide="trash" title="Total Dropped Bytes"></i> <span id="debug-loss">0 B</span></div>
606+
<div class="stats-item" style="min-width: 80px;"><i data-lucide="clock" title="Server Uptime"></i> <span id="debug-uptime">0s</span></div>
607607
</div>
608608
</div>
609609
</div>

‎tinyice.pid‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
35556

0 commit comments

Comments
 (0)