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.
26 lines
892 B
Elixir
26 lines
892 B
Elixir
defmodule ServerWeb.DashboardNav do
|
|
@moduledoc "Top navigation bar rendered inside authenticated LiveViews."
|
|
|
|
use Phoenix.Component
|
|
use ServerWeb, :verified_routes
|
|
|
|
attr :active, :atom, required: true, values: [:overview, :vms, :admin, :other]
|
|
|
|
def nav(assigns) do
|
|
~H"""
|
|
<nav class="nav">
|
|
<span class="brand">proxmox-monitor</span>
|
|
<span class="links">
|
|
<.link navigate={~p"/"} class={link_cls(@active, :overview)}>overview</.link>
|
|
<.link navigate={~p"/vms"} class={link_cls(@active, :vms)}>vms</.link>
|
|
<.link navigate={~p"/admin/hosts"} class={link_cls(@active, :admin)}>admin</.link>
|
|
</span>
|
|
<span class="spacer"></span>
|
|
<.link href={~p"/logout"} method="delete" class="signout">sign out</.link>
|
|
</nav>
|
|
"""
|
|
end
|
|
|
|
defp link_cls(active, key) when active == key, do: "active"
|
|
defp link_cls(_, _), do: nil
|
|
end
|