feat: move status bar below navbar as fixed bar
This commit is contained in:
parent
a1e5cd2f4a
commit
cf737b3804
2 changed files with 37 additions and 31 deletions
|
|
@ -295,7 +295,7 @@ a:hover { color: #fff; text-shadow: 0 0 10px var(--accent-glow); }
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: calc(var(--nav-height) + 2rem) 2rem 2rem;
|
||||
padding: calc(var(--nav-height) + 40px + 2rem) 2rem 2rem;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
|
|
@ -754,13 +754,18 @@ a:hover { color: #fff; text-shadow: 0 0 10px var(--accent-glow); }
|
|||
BOTTOM STATUS BAR
|
||||
============================ */
|
||||
.hud-bottom-bar {
|
||||
grid-column: 1 / -1;
|
||||
position: fixed;
|
||||
top: var(--nav-height);
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 0.75rem 1rem;
|
||||
border: 1px solid var(--border);
|
||||
background: rgba(10, 14, 20, 0.6);
|
||||
padding: 0.6rem 1.5rem;
|
||||
border-bottom: 1px solid var(--border);
|
||||
background: rgba(10, 14, 20, 0.95);
|
||||
backdrop-filter: blur(10px);
|
||||
gap: 1rem;
|
||||
}
|
||||
|
||||
|
|
|
|||
53
index.html
53
index.html
|
|
@ -82,6 +82,33 @@
|
|||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Status Bar -->
|
||||
<div class="hud-bottom-bar">
|
||||
<div class="hud-bottom-left">
|
||||
<span class="hud-id">JAE-001X</span>
|
||||
<span class="hud-dot-online">● ONLINE</span>
|
||||
</div>
|
||||
<div class="hud-bottom-stats">
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">STATUS</span>
|
||||
<span class="hud-bstat-value hud-online">● OPERATIONAL</span>
|
||||
</div>
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">UPTIME</span>
|
||||
<span class="hud-bstat-value" id="uptime">0d 00h 00m</span>
|
||||
</div>
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">COORDS</span>
|
||||
<span class="hud-bstat-value">53.48°N // 2.24°W</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hud-bottom-right">
|
||||
<span class="hud-scan-label">SCANNING...</span>
|
||||
<div class="hud-scan-bar"><div class="hud-scan-fill" id="scanFill"></div></div>
|
||||
<span class="hud-scan-pct" id="scanPct">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="hero" id="home">
|
||||
<div class="hero-hud-grid">
|
||||
|
|
@ -278,32 +305,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bottom Status Bar -->
|
||||
<div class="hud-bottom-bar">
|
||||
<div class="hud-bottom-left">
|
||||
<span class="hud-id">JAE-001X</span>
|
||||
<span class="hud-dot-online">● ONLINE</span>
|
||||
</div>
|
||||
<div class="hud-bottom-stats">
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">STATUS</span>
|
||||
<span class="hud-bstat-value hud-online">● OPERATIONAL</span>
|
||||
</div>
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">UPTIME</span>
|
||||
<span class="hud-bstat-value" id="uptime">0d 00h 00m</span>
|
||||
</div>
|
||||
<div class="hud-bstat">
|
||||
<span class="hud-bstat-label">COORDS</span>
|
||||
<span class="hud-bstat-value">53.48°N // 2.24°W</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hud-bottom-right">
|
||||
<span class="hud-scan-label">SCANNING...</span>
|
||||
<div class="hud-scan-bar"><div class="hud-scan-fill" id="scanFill"></div></div>
|
||||
<span class="hud-scan-pct" id="scanPct">0%</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div class="scan-line"></div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue