keith/bytegeist-portfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refine infrastructure status language

Browse Source
This commit is contained in:
Keith Casko
2026-10-02 10:05:04 -04:00
parent b28852652c
commit ddabe5b8c6
3 changed files with 80 additions and 116 deletions
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+78 -82
View File
@@ -3,7 +3,7 @@
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta name="description" content="ByteGeist infrastructure control plane — a live view into Keith Casko's self-hosted cloud environment." />
<meta name="description" content="ByteGeist infrastructure control plane — architecture, monitoring, delivery, security, and recovery evidence from Keith Casko's self-hosted cloud lab." />
<title>ByteGeist / Control Plane</title>
<link rel="icon" href="assets/images/bytegeist-logo.png" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -24,7 +24,7 @@
<div class="control-state">
<span class="status-dot"></span>
<span>INFRASTRUCTURE NOMINAL</span>
<span>LAB CONFIGURATION / VERIFIED OCT 2026</span>
</div>
<nav aria-label="Control plane navigation">
@@ -37,7 +37,7 @@
<div class="clock" aria-label="Current local time">
<span id="local-time">--:--:--</span>
<small>AMERICA / NEW YORK</small>
<small>AMERICA / DETROIT</small>
</div>
</header>
@@ -53,15 +53,14 @@
<div><dt>Provider</dt><dd>Hetzner</dd></div>
<div><dt>OS</dt><dd>Ubuntu 24.04</dd></div>
<div><dt>Runtime</dt><dd>Docker</dd></div>
<div><dt>Region</dt><dd>US-East</dd></div>
<div><dt>Region</dt><dd>EU-Central / HEL1</dd></div>
<div><dt>Ingress</dt><dd>NPM / TLS</dd></div>
<div><dt>Identity</dt><dd>Authentik</dd></div>
</dl>
<div class="rail-health">
<span>HOST HEALTH</span>
<div class="health-bar"><i style="--value: 92%"></i></div>
<strong>92%</strong>
<span>HOST TELEMETRY</span>
<strong>PROMETHEUS / NODE EXPORTER</strong>
</div>
<a href="https://wiki.casko.dev">OPEN RUNBOOKS <span>↗</span></a>
@@ -70,8 +69,8 @@
<div class="overview-console">
<div class="console-label">
<span>OVERVIEW / LIVE</span>
<span id="refresh-indicator">UPDATED 00s AGO</span>
<span>INFRASTRUCTURE OVERVIEW</span>
<span id="refresh-indicator">CONFIGURATION SNAPSHOT</span>
</div>
<div class="identity-block">
@@ -85,95 +84,92 @@
</p>
</div>
<div class="metric-board" aria-label="Infrastructure metrics">
<div class="metric-board" aria-label="Infrastructure capabilities">
<article class="metric metric-primary">
<span>SERVICES ONLINE</span>
<strong data-count="20">20</strong><small>/ 20</small>
<div class="spark-bars" aria-hidden="true">
<i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i><i></i>
</div>
<span>HOST METRICS</span>
<strong>PROMETHEUS</strong>
<p>NODE EXPORTER</p>
</article>
<article class="metric">
<span>UPTIME</span>
<strong>99.98</strong><small>%</small>
<p>30 DAY WINDOW</p>
<span>CONTAINER METRICS</span>
<strong>CADVISOR</strong>
<p>DOCKER TELEMETRY</p>
</article>
<article class="metric">
<span>CONTAINERS</span>
<strong data-count="26">26</strong>
<p>26 RUNNING / 0 DEGRADED</p>
<span>AVAILABILITY MONITORING</span>
<strong>KUMA</strong>
<p>ENDPOINT CHECKS</p>
</article>
<article class="metric">
<span>ACTIVE DOMAINS</span>
<strong data-count="11">11</strong>
<p>TLS VALID / PROXIED</p>
<span>LOGS</span>
<strong>LOKI</strong>
<p>CENTRALIZED LOGGING</p>
</article>
<article class="metric">
<span>CPU LOAD</span>
<strong>16.2</strong><small>%</small>
<div class="meter"><i style="--value: 16.2%"></i></div>
<span>DASHBOARDS</span>
<strong>GRAFANA</strong>
<p>OPERATIONS / ANALYSIS</p>
</article>
<article class="metric">
<span>MEMORY</span>
<strong>61.6</strong><small>%</small>
<div class="meter warning"><i style="--value: 61.6%"></i></div>
<span>IDENTITY</span>
<strong>AUTHENTIK</strong>
<p>OIDC / SSO / 2FA</p>
</article>
</div>
<div class="operations-window">
<div class="window-bar">
<span><i class="live-dot"></i> GRAFANA / BYTEGEIST OPERATIONS</span>
<span>GRAFANA / BYTEGEIST OPERATIONS</span>
<a href="assets/images/portfolio-grafana-operations.png" target="_blank">FULL RES ↗</a>
</div>
<img src="assets/images/portfolio-grafana-operations.png" alt="Grafana operations dashboard showing ByteGeist infrastructure health" />
<img src="assets/images/portfolio-grafana-operations.png" alt="Grafana operations dashboard screenshot from the ByteGeist monitoring stack" />
</div>
</div>
<aside class="activity-panel">
<div class="panel-title">
<span>EVENT STREAM</span>
<small>LIVE</small>
<span>OPERATIONAL CAPABILITIES</span>
<small>DOCUMENTED</small>
</div>
<ol class="event-list">
<li>
<time>22:14:08</time>
<span class="event-ok">DEPLOY</span>
<p>portfolio/main completed</p>
<p>Automated deployment through Woodpecker CI</p>
</li>
<li>
<time>21:48:32</time>
<span class="event-info">AUTH</span>
<p>OIDC session issued</p>
<p>OIDC authentication through Authentik</p>
</li>
<li>
<time>20:03:17</time>
<span class="event-ok">BACKUP</span>
<p>volume snapshot verified</p>
<p>Persistent data backup and documented recovery procedures</p>
</li>
<li>
<time>18:42:55</time>
<span class="event-warn">SEC</span>
<p>CrowdSec decision added</p>
<p>CrowdSec threat detection and decision evidence</p>
</li>
<li>
<span class="event-info">TLS</span>
<p>Certificate and HTTPS management through the reverse proxy</p>
</li>
<li>
<time>16:11:09</time>
<span class="event-info">DNS</span>
<p>certificate renewed</p>
<p>Domain routing and service exposure</p>
</li>
</ol>
<div class="deployment-status">
<span>LAST DEPLOYMENT</span>
<strong>SUCCESS</strong>
<p>Woodpecker pipeline #184</p>
<span>CI/CD WORKFLOW</span>
<strong>WOODPECKER</strong>
<p>Git-based build, verification, and deployment pipeline</p>
<div><i></i><i></i><i></i><i></i></div>
</div>
<div class="terminal-mini" aria-label="Recent terminal output">
<p><span>$</span> docker ps --format status</p>
<p class="terminal-output">26 containers running</p>
<p><span>$</span> systemctl is-system-running</p>
<p class="terminal-output">running<span class="cursor">_</span></p>
<div class="terminal-mini" aria-label="Operational stack summary">
<p><span>$</span> observability stack</p>
<p class="terminal-output">prometheus · loki · grafana · alloy</p>
<p><span>$</span> delivery stack</p>
<p class="terminal-output">gitea · woodpecker<span class="cursor">_</span></p>
</div>
</aside>
</section>
@@ -184,7 +180,7 @@
<span class="module-id">SYS.01</span>
<h2>Infrastructure topology</h2>
</div>
<p>Traffic, identity, workloads, telemetry, and recovery paths on the current host.</p>
<p>Traffic, identity, workloads, telemetry, and recovery paths documented for the Hetzner host.</p>
<div class="module-state"><i></i> DOCUMENTED</div>
</header>
@@ -203,7 +199,7 @@
<div>
<span>COMPUTE</span>
<strong>Docker Compose</strong>
<small>26 active containers</small>
<small>Containerized workloads</small>
</div>
<div>
<span>TELEMETRY</span>
@@ -230,7 +226,7 @@
<h2>Monitoring stack</h2>
</div>
<p>Host metrics, container telemetry, centralized logs, and independent uptime checks.</p>
<div class="module-state"><i></i> COVERAGE ACTIVE</div>
<div class="module-state"><i></i> STACK DOCUMENTED</div>
</header>
<div class="evidence-grid">
@@ -246,14 +242,14 @@
</figure>
<div class="coverage-matrix">
<div class="panel-title"><span>MONITORING COVERAGE</span><small>6 / 6</small></div>
<div class="panel-title"><span>MONITORING COVERAGE</span><small>CONFIGURED</small></div>
<ul>
<li><span>Host metrics</span><i>ACTIVE</i></li>
<li><span>Container metrics</span><i>ACTIVE</i></li>
<li><span>Application logs</span><i>ACTIVE</i></li>
<li><span>Endpoint uptime</span><i>ACTIVE</i></li>
<li><span>Resource alerts</span><i>ACTIVE</i></li>
<li><span>Security events</span><i>ACTIVE</i></li>
<li><span>Host metrics</span><i>CONFIGURED</i></li>
<li><span>Container metrics</span><i>CONFIGURED</i></li>
<li><span>Application logs</span><i>CONFIGURED</i></li>
<li><span>Endpoint uptime</span><i>CONFIGURED</i></li>
<li><span>Resource alerts</span><i>CONFIGURED</i></li>
<li><span>Security events</span><i>CONFIGURED</i></li>
</ul>
<div class="stack-list">
<span>Grafana</span><span>Prometheus</span><span>Loki</span>
@@ -269,8 +265,8 @@
<span class="module-id">APP.03</span>
<h2>Service inventory</h2>
</div>
<p>Core applications currently exposed through the internal service portal.</p>
<div class="module-state"><i></i> 20 ONLINE</div>
<p>Core applications represented in the internal service portal configuration.</p>
<div class="module-state"><i></i> LAST VERIFIED OCT 2026</div>
</header>
<div class="service-layout">
@@ -278,13 +274,13 @@
<div class="service-row service-head" role="row">
<span>Service</span><span>Role</span><span>Access</span><span>State</span>
</div>
<div class="service-row"><strong>Gitea</strong><span>Source control</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Wiki.js</strong><span>Documentation</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Dashy</strong><span>Service portal</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Vaultwarden</strong><span>Secrets</span><span>DIRECT</span><i>ONLINE</i></div>
<div class="service-row"><strong>Stirling PDF</strong><span>Document tools</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>IT Tools</strong><span>Utilities</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Uptime Kuma</strong><span>Availability</span><span>SSO</span><i>ONLINE</i></div>
<div class="service-row"><strong>Gitea</strong><span>Source control</span><span>SSO</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>Wiki.js</strong><span>Documentation</span><span>SSO</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>Dashy</strong><span>Service portal</span><span>SSO</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>Vaultwarden</strong><span>Secrets</span><span>DIRECT</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>Stirling PDF</strong><span>Document tools</span><span>SSO</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>IT Tools</strong><span>Utilities</span><span>SSO</span><i>CONFIGURED</i></div>
<div class="service-row"><strong>Uptime Kuma</strong><span>Availability</span><span>SSO</span><i>CONFIGURED</i></div>
</div>
<figure class="portal-shot">
@@ -306,7 +302,7 @@
<h2>Delivery pipeline</h2>
</div>
<p>Git-based workflows from repository change to automated deployment.</p>
<div class="module-state"><i></i> LAST RUN PASSED</div>
<div class="module-state"><i></i> PIPELINE EVIDENCE</div>
</header>
<div class="pipeline">
@@ -343,15 +339,15 @@
<span class="module-id">SEC.05</span>
<h2>Identity & perimeter</h2>
</div>
<p>Central authentication, protected services, and automated hostile-traffic decisions.</p>
<div class="module-state"><i></i> ENFORCING</div>
<p>Central authentication, protected services, and documented hostile-traffic detection controls.</p>
<div class="module-state"><i></i> CONTROLS DOCUMENTED</div>
</header>
<div class="security-layout">
<figure class="auth-shot">
<figcaption>
<span>AUTHENTIK</span>
<small>11 protected applications / 2FA enforced</small>
<small>Protected applications / OIDC / 2FA policy</small>
</figcaption>
<a href="assets/images/portfolio-authentik-applications.png" target="_blank">
<img src="assets/images/portfolio-authentik-applications.png" alt="Applications protected by Authentik" />
@@ -365,8 +361,8 @@
<small>KEY-ONLY SSH / SSO / TLS</small>
</div>
<ul>
<li><span>OIDC providers</span><strong>04</strong></li>
<li><span>Forward-auth apps</span><strong>07</strong></li>
<li><span>OIDC providers</span><strong>CONFIGURED</strong></li>
<li><span>Forward-auth apps</span><strong>CONFIGURED</strong></li>
<li><span>2FA policy</span><strong>ENFORCED</strong></li>
<li><span>Public SSH password</span><strong>DISABLED</strong></li>
</ul>
@@ -374,11 +370,11 @@
<figure class="crowdsec-shot">
<figcaption>
<span>CROWDSEC / ACTIVE DECISIONS</span>
<small>Automated hostile source blocking</small>
<span>CROWDSEC / SECURITY EVIDENCE</span>
<small>Threat detection and firewall-decision history</small>
</figcaption>
<a href="assets/images/portfolio-crowdsec-decisions.png" target="_blank">
<img src="assets/images/portfolio-crowdsec-decisions.png" alt="CrowdSec active firewall decisions" />
<img src="assets/images/portfolio-crowdsec-decisions.png" alt="CrowdSec firewall decision evidence" />
</a>
</figure>
</div>
@@ -391,7 +387,7 @@
<h2>Recovery state</h2>
</div>
<p>Configuration in Git, persistent data backups, and an explicit rebuild sequence.</p>
<div class="module-state"><i></i> RUNBOOK CURRENT</div>
<div class="module-state"><i></i> RUNBOOK DOCUMENTED</div>
</header>
<div class="recovery-layout">
@@ -416,7 +412,7 @@
<div><strong>BYTEGEIST</strong><span>KEITH CASKO / INFRASTRUCTURE LAB</span></div>
</div>
<p>PLAIN HTML / CSS / JAVASCRIPT</p>
<p>STATUS: <span class="status-text">OPERATIONAL</span></p>
<p>VERIFICATION: <span class="status-text">OCT 2026</span></p>
</footer>
</body>
</html>
script.js
+1 -28
View File
@@ -1,11 +1,9 @@
const timeElement = document.querySelector("#local-time");
const refreshElement = document.querySelector("#refresh-indicator");
const counters = document.querySelectorAll("[data-count]");
function updateClock() {
const now = new Date();
timeElement.textContent = new Intl.DateTimeFormat("en-US", {
timeZone: "America/New_York",
timeZone: "America/Detroit",
hour: "2-digit",
minute: "2-digit",
second: "2-digit",
@@ -13,30 +11,5 @@ function updateClock() {
}).format(now);
}
let secondsSinceRefresh = 0;
function updateRefreshState() {
refreshElement.textContent = `UPDATED ${String(secondsSinceRefresh).padStart(2, "0")}s AGO`;
secondsSinceRefresh = (secondsSinceRefresh + 1) % 60;
}
function animateCounters() {
counters.forEach((counter) => {
const target = Number(counter.dataset.count);
let current = 0;
const increment = Math.max(1, Math.ceil(target / 18));
const timer = window.setInterval(() => {
current = Math.min(target, current + increment);
counter.textContent = current;
if (current === target) window.clearInterval(timer);
}, 45);
});
}
updateClock();
updateRefreshState();
animateCounters();
window.setInterval(updateClock, 1000);
window.setInterval(updateRefreshState, 1000);
style.css
+1 -6
View File
@@ -459,18 +459,13 @@ h1 {
.event-list li {
display: grid;
grid-template-columns: 58px 48px 1fr;
grid-template-columns: 54px 1fr;
gap: 7px;
padding: 13px 0;
border-bottom: 1px dotted var(--line);
font-family: var(--mono);
}
.event-list time {
color: var(--dim);
font-size: .55rem;
}
.event-list li > span {
font-size: .55rem;
}