feat(hosts): a host's health tiles span the card and the gaps match; Add host is a dialog on the list (#5290, #5291)
#5290 "Host page: the health tiles span the card's width; even spacing above Ansible": the four tiles take equal quarters (halves on a phone) and their sparklines stretch across them; the Monitors + Agent row drops the Agent card's own margin, so the gap above Ansible is 1rem like every other. #5291 "Add host opens as a dialog over the Hosts list": a native <dialog> on /hosts/, opened by Add host or /hosts/?add=1. A name clash re-renders the list with it open, the error and what was typed. GET /hosts/new is gone; hosts/form.html is Edit only. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -1,41 +1,34 @@
|
||||
{% extends "base.html" %}
|
||||
{% from "_macros.html" import crumbs, page_header %}
|
||||
{# Add a host (host is none) or edit one; `values` holds what was typed when
|
||||
an error sends the form back. Laid out like the add-monitor form (#5283). #}
|
||||
{% block title %}{{ "Edit " ~ host.name if host else "Add host" }} — Steward{% endblock %}
|
||||
{% block breadcrumb %}
|
||||
{%- if host -%}
|
||||
{{ crumbs([("Hosts", "/hosts/"), (host.name, "/hosts/" ~ host.id), ("Edit", "")]) }}
|
||||
{%- else -%}
|
||||
{{ crumbs([("Hosts", "/hosts/"), ("Add host", "")]) }}
|
||||
{%- endif -%}
|
||||
{% endblock %}
|
||||
{# Edit a host; `values` holds what was typed when a clash sends the form back.
|
||||
Adding one is a dialog on the Hosts list (#5291). #}
|
||||
{% block title %}Edit {{ host.name }} — Steward{% endblock %}
|
||||
{% block breadcrumb %}{{ crumbs([("Hosts", "/hosts/"), (host.name, "/hosts/" ~ host.id), ("Edit", "")]) }}{% endblock %}
|
||||
{% block content %}
|
||||
{% set v = values or {} %}
|
||||
{{ page_header("Edit host" if host else "Add host") }}
|
||||
{{ page_header("Edit host") }}
|
||||
|
||||
<div class="card" style="max-width:760px;">
|
||||
{% if error %}<p class="field-error" role="alert">{{ error }}</p>{% endif %}
|
||||
<form method="post" action="{{ '/hosts/' ~ host.id if host else '/hosts/' }}" style="display:grid;gap:0.6rem;">{{ csrf_field() }}
|
||||
<form method="post" action="/hosts/{{ host.id }}" style="display:grid;gap:0.6rem;">{{ csrf_field() }}
|
||||
<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:0.6rem;align-items:end;">
|
||||
<div>
|
||||
<label class="field-label" for="h-name">Name <span class="tone-crit" aria-hidden="true">*</span></label>
|
||||
<input type="text" id="h-name" name="name" value="{{ v.name if v.name is defined else (host.name if host else '') }}"
|
||||
<input type="text" id="h-name" name="name" value="{{ v.name if v.name is defined else host.name }}"
|
||||
placeholder="nas, web-1, …" autocomplete="off" required autofocus class="input">
|
||||
</div>
|
||||
<div>
|
||||
<label class="field-label" for="h-address">Address</label>
|
||||
<input type="text" id="h-address" name="address" value="{{ v.address if v.address is defined else (host.address if host else '') }}"
|
||||
<input type="text" id="h-address" name="address" value="{{ v.address if v.address is defined else host.address }}"
|
||||
placeholder="hostname or IP; empty resolves by name" autocomplete="off" class="input">
|
||||
</div>
|
||||
</div>
|
||||
<p class="field-hint" style="margin:0;">
|
||||
{% if host %}Renaming carries the host's agent and container history, and the alert rules on it, to the new name.
|
||||
{% else %}Next, on the host's page: add monitors, install its agent, and link an Ansible target.{% endif %}
|
||||
Renaming carries the host's agent and container history, and the alert rules on it, to the new name.
|
||||
</p>
|
||||
<div style="display:flex;gap:0.5rem;">
|
||||
<button type="submit" class="btn btn-sm">{{ "Save" if host else "Add host" }}</button>
|
||||
<a href="{{ '/hosts/' ~ host.id if host else '/hosts/' }}" class="btn btn-sm btn-ghost">Cancel</a>
|
||||
<button type="submit" class="btn btn-sm">Save</button>
|
||||
<a href="/hosts/{{ host.id }}" class="btn btn-sm btn-ghost">Cancel</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user