New design language:
- dark background, system sans for UI, monospace for data
- single green accent, amber/red for warn/critical
- square-bordered panels + tables, no rounded cards or shadows
- status conveyed via left-border on overview cards + badges
Changes:
- new app.css defines CSS vars + component classes (.panel, .tbl,
.card, .btn, .input, .badge with [data-status=*])
- new ServerWeb.DashboardNav function component for a shared top nav
with active-link highlighting; replaces per-view navigation clutter
- strip the Phoenix welcome scaffold (logo, version badge, twitter/GH
links) from layouts/app.html.heex; leaves only flash + content
- root.html.heex title suffix switched to 'Proxmox Monitor', body
loses the Tailwind-white background
- rewrite render/1 in all four LiveViews + login template to use the
new classes; admin form now uses <.form for={@form}> and properly
clears on success
- login page redesigned to a single tight panel matching the rest
All 58 tests still pass; 'mix compile --warnings-as-errors' is clean.
37 lines
1.2 KiB
Text
37 lines
1.2 KiB
Text
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
|
<meta name="csrf-token" content={Phoenix.Controller.get_csrf_token()} />
|
|
<title>Sign in · Proxmox Monitor</title>
|
|
<link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
|
|
</head>
|
|
<body>
|
|
<div class="login">
|
|
<div class="panel">
|
|
<header><span>proxmox-monitor</span><span class="mono dim">sign in</span></header>
|
|
<div class="body">
|
|
<%= if @error do %>
|
|
<div class="callout err">{@error}</div>
|
|
<% end %>
|
|
<form method="post" action="/login" class="stack sm">
|
|
<input type="hidden" name="_csrf_token" value={Phoenix.Controller.get_csrf_token()} />
|
|
<input
|
|
name="password"
|
|
type="password"
|
|
required
|
|
autofocus
|
|
autocomplete="current-password"
|
|
placeholder="password"
|
|
class="input"
|
|
/>
|
|
<button type="submit" class="btn primary" style="justify-content: center;">
|
|
sign in
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</body>
|
|
</html>
|