Files
sprintpadawan/templates/index.html
T
2026-04-23 22:33:33 -06:00

151 lines
6.4 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Dashboard &mdash; SprintPadawan</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="/static/styles/main.css" />
<script src="https://unpkg.com/htmx.org@2.0.4" defer></script>
</head>
<body class="app-body">
<div class="app-shell">
<!-- sidebar -->
<aside class="sidebar">
<div class="sidebar-logo">
<div class="logo-icon"></div>
<span class="logo-text"><span>Sprint</span>Padawan</span>
</div>
<nav class="sidebar-nav">
<a href="/" class="nav-item active">
<svg
xmlns="http://www.w3.org/2000/svg"
width="16"
height="16"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
>
<rect x="3" y="3" width="7" height="7" />
<rect x="14" y="3" width="7" height="7" />
<rect x="3" y="14" width="7" height="7" />
<rect x="14" y="14" width="7" height="7" />
</svg>
Dashboard
</a>
</nav>
<div class="sidebar-footer">
<div class="user-row">
<div class="user-avatar">{{slice .Username 0 1}}</div>
<div class="user-info">
<span class="user-name">{{.Username}}</span>
<span class="user-role">Member</span>
</div>
</div>
<form method="POST" action="/logout">
<button class="sign-out-btn" type="submit">
<svg
xmlns="http://www.w3.org/2000/svg"
width="14"
height="14"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
>
<path
d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"
/>
<polyline points="16 17 21 12 16 7" />
<line x1="21" y1="12" x2="9" y2="12" />
</svg>
Sign Out
</button>
</form>
</div>
</aside>
<!-- main -->
<div class="main-content">
<header class="topbar">
<span class="topbar-title">Dashboard</span>
</header>
<main class="page-content">
<!-- greeting -->
<div class="welcome-hero">
<p class="welcome-greeting">
Welcome back, <span>{{.Username}}</span>
</p>
<p class="welcome-sub">
Here's what's happening with your server.
</p>
</div>
<!-- stat cards -->
<div class="dashboard-grid">
<div class="dash-card">
<div class="dash-card-label">Runtime</div>
<div class="dash-card-value">Go</div>
</div>
<div class="dash-card">
<div class="dash-card-label">Reactivity</div>
<div class="dash-card-value">HTMX</div>
</div>
<div class="dash-card">
<div class="dash-card-label">Port</div>
<div class="dash-card-value">:8080</div>
</div>
</div>
<!-- ping section -->
<div class="welcome-hero">
<p class="welcome-greeting" style="font-size: 1.1rem">
Server Health
</p>
<p class="welcome-sub" style="margin-bottom: 1.25rem">
Ping the server to check it's alive.
</p>
<button
class="ping-btn"
hx-get="/api/ping-partial"
hx-target="#ping-result"
hx-swap="innerHTML"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="15"
height="15"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2.5"
stroke-linecap="round"
stroke-linejoin="round"
>
<path d="M22 12h-4l-3 9L9 3l-3 9H2" />
</svg>
Ping Server
</button>
<div id="ping-result" style="margin-top: 1.25rem"></div>
</div>
</main>
</div>
</div>
</body>
</html>