<!DOCTYPE html>
<html>
<head>
<title>Servers - Auth Framework Admin</title>
<style>
body {
font-family: system-ui, sans-serif;
margin: 0;
padding: 0;
background: #f5f5f5;
color: #333;
}
nav {
background: #1a1a2e;
padding: 0.75rem 1.5rem;
display: flex;
gap: 1.5rem;
align-items: center;
}
nav a {
color: #e0e0e0;
text-decoration: none;
font-size: 0.9rem;
}
nav a:hover {
color: #fff;
}
nav .brand {
font-weight: bold;
font-size: 1.1rem;
color: #fff;
margin-right: 1rem;
}
nav .active {
color: #fff;
border-bottom: 2px solid #4fc3f7;
}
.container {
max-width: 960px;
margin: 1.5rem auto;
padding: 0 1rem;
}
.card {
background: #fff;
border-radius: 6px;
padding: 1.25rem;
margin-bottom: 1rem;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}
h1 {
margin-top: 0;
}
.stat {
display: inline-block;
min-width: 160px;
margin-right: 1.5rem;
margin-bottom: 0.5rem;
}
.stat-value {
font-size: 1.25rem;
font-weight: bold;
}
.stat-label {
font-size: 0.85rem;
color: #777;
}
.status-running {
color: #2e7d32;
}
.status-stopped {
color: #c62828;
}
</style>
</head>
<body>
<nav>
<span class="brand">AuthFramework</span>
<a href="/">Dashboard</a>
<a href="/config">Config</a>
<a href="/users">Users</a>
<a href="/security">Security</a>
<a href="/servers" class="active">Servers</a>
<a href="/logs">Logs</a>
<a href="/logout">Logout</a>
</nav>
<div class="container">
<h1>Server Status</h1>
<div class="card">
<div class="stat">
<div class="stat-value {% if status.web_server_running %}status-running{% else %}status-stopped{% endif %}">
{% if status.web_server_running %}Running{% else %}Stopped{% endif %}
</div>
<div class="stat-label">Web Server</div>
</div>
<div class="stat">
<div class="stat-value">{% match status.web_server_port %}{% when Some with (port) %}{{ port }}{% when None
%}N/A{% endmatch %}</div>
<div class="stat-label">Port</div>
</div>
<div class="stat">
<div class="stat-value">{{ status.health }}</div>
<div class="stat-label">Health</div>
</div>
<div class="stat">
<div class="stat-value">{{ status.uptime }}</div>
<div class="stat-label">Uptime</div>
</div>
<div class="stat">
<div class="stat-value">{{ status.active_sessions }}</div>
<div class="stat-label">Active Sessions</div>
</div>
<div class="stat">
<div class="stat-value">{% match status.last_config_update %}{% when Some with (value) %}{{ value }}{% when None
%}Never{% endmatch %}</div>
<div class="stat-label">Last Config Update</div>
</div>
</div>
</div>
</body>
</html>