Basic features done
This commit is contained in:
+50
-56
@@ -3,7 +3,7 @@
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Dashboard — SprintPadawan</title>
|
||||
<title>Dashboard — SprintPadawan</title>
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
||||
<link
|
||||
@@ -11,12 +11,13 @@
|
||||
rel="stylesheet"
|
||||
/>
|
||||
<link rel="stylesheet" href="/static/styles/main.css" />
|
||||
<script src="https://unpkg.com/htmx.org@2.0.4" defer></script>
|
||||
<script src="/static/js/htmx.min.js" defer></script>
|
||||
</head>
|
||||
<body class="app-body">
|
||||
<div class="app-shell">
|
||||
<div id="sidebar-backdrop" class="sidebar-backdrop" onclick="document.getElementById('app-sidebar').classList.remove('open'); document.getElementById('sidebar-backdrop').classList.remove('open')"></div>
|
||||
<!-- sidebar -->
|
||||
<aside class="sidebar">
|
||||
<aside class="sidebar" id="app-sidebar">
|
||||
<div class="sidebar-logo">
|
||||
<div class="logo-icon">⚡</div>
|
||||
<span class="logo-text"><span>Sprint</span>Padawan</span>
|
||||
@@ -40,7 +41,7 @@
|
||||
<rect x="3" y="14" width="7" height="7" />
|
||||
<rect x="14" y="14" width="7" height="7" />
|
||||
</svg>
|
||||
Dashboard
|
||||
Rooms
|
||||
</a>
|
||||
</nav>
|
||||
|
||||
@@ -77,74 +78,67 @@
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- main -->
|
||||
<div class="main-content">
|
||||
<header class="topbar">
|
||||
<span class="topbar-title">Dashboard</span>
|
||||
<div style="display: flex; align-items: center; gap: 1rem;">
|
||||
<button class="mobile-menu-btn" onclick="document.getElementById('app-sidebar').classList.toggle('open'); document.getElementById('sidebar-backdrop').classList.toggle('open')">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||
<line x1="3" y1="12" x2="21" y2="12"></line>
|
||||
<line x1="3" y1="6" x2="21" y2="6"></line>
|
||||
<line x1="3" y1="18" x2="21" y2="18"></line>
|
||||
</svg>
|
||||
</button>
|
||||
<span class="topbar-title">Planning Rooms</span>
|
||||
</div>
|
||||
<button class="btn-primary" style="width: auto; padding: 0.5rem 1rem;" hx-get="/rooms/new" hx-target="body" hx-swap="beforeend">
|
||||
<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">
|
||||
<line x1="12" y1="5" x2="12" y2="19"></line>
|
||||
<line x1="5" y1="12" x2="19" y2="12"></line>
|
||||
</svg>
|
||||
Create Room
|
||||
</button>
|
||||
</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.
|
||||
Create or join a planning room to start estimating.
|
||||
</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>
|
||||
{{if .Rooms}}
|
||||
<div class="rooms-grid">
|
||||
{{range .Rooms}}
|
||||
<a href="/rooms/{{.ID}}" class="room-card">
|
||||
<div class="room-header">
|
||||
<span class="room-name">{{.Name}}</span>
|
||||
<div style="display: flex; gap: 0.5rem; align-items: center;">
|
||||
{{if .IsOwner}}
|
||||
<span class="room-owner-badge" style="position: static; margin: 0; padding: 0.2rem 0.5rem;">Owner</span>
|
||||
{{end}}
|
||||
<span class="room-code">{{.Code}}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="room-meta">
|
||||
<span class="room-scale">{{.Scale}}</span>
|
||||
<span class="room-members">{{.MemberCount}} members</span>
|
||||
</div>
|
||||
</a>
|
||||
{{end}}
|
||||
</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>
|
||||
{{else}}
|
||||
<div class="empty-state">
|
||||
<p>No rooms yet. Create one to get started.</p>
|
||||
</div>
|
||||
{{end}}
|
||||
</main>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- modal container -->
|
||||
<div id="modal-container"></div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
Reference in New Issue
Block a user