style(host-detail): polish buttons, back link and port list

- Save changes / Add port: add btn-primary class for consistent blue accent
- Back button: stacked above page title, styled as a small bordered button
- Port list: remove row background, replace full border with bottom separator only

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-05-16 02:26:40 +02:00
parent 2a6d925e59
commit 577a655aee
2 changed files with 25 additions and 15 deletions

View File

@@ -170,7 +170,7 @@ pub fn HostDetailPage() -> impl IntoView {
// ── Page header ──────────────────────────────────
<div class="page-header">
<div class="page-header__left">
<a class="back-link" href="/hosts">"← Hosts"</a>
<a class="back-btn" href="/hosts">"← Hosts"</a>
<h1>{move || name_sig.get()}</h1>
</div>
<button
@@ -236,6 +236,7 @@ pub fn HostDetailPage() -> impl IntoView {
<div class="form-actions">
<button
class="btn-primary"
type="button"
on:click=move |_| {
update_action.dispatch(UpdateHost {
@@ -278,6 +279,7 @@ pub fn HostDetailPage() -> impl IntoView {
on:input=move |e| new_port.set(event_target_value(&e))
/>
<button
class="btn-primary"
type="button"
on:click=move |_| {
let raw = new_port.get_untracked();