jae/jaeswift-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat: move status bar below navbar as fixed bar

Browse source
This commit is contained in:
jae 2026-03-31 23:18:37 +00:00
parent a1e5cd2f4a
commit cf737b3804
2 changed files with 37 additions and 31 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
css/style.css
View file

@ -295,7 +295,7 @@ a:hover { color: #fff; text-shadow: 0 0 10px var(--accent-glow); }
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: calc(var(--nav-height) + 2rem) 2rem 2rem; padding: calc(var(--nav-height) + 40px + 2rem) 2rem 2rem;
position: relative; position: relative;
} }
@ -754,13 +754,18 @@ a:hover { color: #fff; text-shadow: 0 0 10px var(--accent-glow); }
BOTTOM STATUS BAR BOTTOM STATUS BAR
============================ */ ============================ */
.hud-bottom-bar { .hud-bottom-bar {
grid-column: 1 / -1; position: fixed;
top: var(--nav-height);
left: 0;
right: 0;
z-index: 999;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
align-items: center; align-items: center;
padding: 0.75rem 1rem; padding: 0.6rem 1.5rem;
border: 1px solid var(--border); border-bottom: 1px solid var(--border);
background: rgba(10, 14, 20, 0.6); background: rgba(10, 14, 20, 0.95);
backdrop-filter: blur(10px);
gap: 1rem; gap: 1rem;
} }

53
index.html
View file

@ -82,6 +82,33 @@
</div> </div>
</nav> </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 --> <!-- Hero Section -->
<section class="hero" id="home"> <section class="hero" id="home">
<div class="hero-hud-grid"> <div class="hero-hud-grid">
@ -278,32 +305,6 @@
</div> </div>
</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>
<div class="scan-line"></div> <div class="scan-line"></div>