88091936c5
The page-top chrome was inconsistent: most nested views used the breadcrumb
kicker + page-title pattern, but plugin sub-pages used ad-hoc "← back" links,
~11 pages stacked a breadcrumb AND a redundant ancestor back button, and two
(monitors/edit, hosts/uptime) had a back button but no breadcrumb. The
settings/plugin_detail page stacked all of it at once.
Unify on the breadcrumb-led model:
- settings/_tabs.html: drop the hardcoded "Settings" h1; the breadcrumb
("Settings › …") plus the tab strip is the header.
- settings/plugin_detail: drop the "← Plugins" back button.
- docker container_detail/swarm/disk + snmp/device: replace ad-hoc back links
with the standard crumbs() breadcrumb.
- host_agent, ansible/*, alerts/maintenance: remove redundant ancestor back
buttons (the breadcrumb's parent crumbs already link there); keep lateral
shortcuts (Inventory/Schedules/Browse/Targets/Groups/New).
- monitors/edit, hosts/uptime: add the missing breadcrumb, drop the back link.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_016Jg27rgypiW2efULXJDtMC
62 lines
2.7 KiB
HTML
62 lines
2.7 KiB
HTML
{% extends "base.html" %}
|
||
{% from "_macros.html" import crumbs %}
|
||
{% block title %}Inventory Targets — Steward{% endblock %}
|
||
{% block breadcrumb %}{{ crumbs([("Ansible", "/ansible/"), ("Inventory", "/ansible/inventory/targets"), ("Targets", "")]) }}{% endblock %}
|
||
{% block content %}
|
||
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;">
|
||
<h1 class="page-title" style="margin-bottom:0;">Inventory Targets</h1>
|
||
<div style="display:flex;gap:0.5rem;">
|
||
<a href="/ansible/inventory/groups" class="btn btn-ghost btn-sm">Groups</a>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="card" style="margin-bottom:1.5rem;">
|
||
<h3 class="section-title">New Target</h3>
|
||
<form method="post" action="/ansible/inventory/targets" style="display:flex;gap:0.75rem;align-items:flex-end;">
|
||
<div class="form-group" style="flex:1;margin:0;">
|
||
<label>Name <span style="color:var(--text-muted);font-weight:normal;font-size:0.82rem;">(used as Ansible hostname)</span></label>
|
||
<input type="text" name="name" placeholder="webserver-01" required>
|
||
</div>
|
||
<div class="form-group" style="flex:1;margin:0;">
|
||
<label>Address <span style="color:var(--text-muted);font-weight:normal;font-size:0.82rem;">(IP or DNS)</span></label>
|
||
<input type="text" name="address" placeholder="192.168.1.10" required>
|
||
</div>
|
||
<button type="submit" class="btn">Add</button>
|
||
</form>
|
||
</div>
|
||
|
||
{% if not targets %}
|
||
<div class="card">
|
||
<p style="color:var(--text-muted);">No targets yet. Add one above.</p>
|
||
</div>
|
||
{% else %}
|
||
<div class="card-flush">
|
||
<table class="table">
|
||
<thead>
|
||
<tr><th>Name</th><th>Address</th><th>Groups</th><th></th></tr>
|
||
</thead>
|
||
<tbody>
|
||
{% for tgt in targets %}
|
||
<tr>
|
||
<td><strong>{{ tgt.name }}</strong></td>
|
||
<td style="font-family:ui-monospace,monospace;font-size:0.88rem;">{{ tgt.address }}</td>
|
||
<td style="font-size:0.82rem;color:var(--text-muted);">
|
||
{% for grp in tgt.groups %}
|
||
<span style="background:var(--bg-elevated);border-radius:3px;padding:0.1em 0.4em;margin-right:0.25rem;">{{ grp.name }}</span>
|
||
{% endfor %}
|
||
</td>
|
||
<td class="td-actions">
|
||
<a href="/ansible/inventory/targets/{{ tgt.id }}" class="btn btn-sm btn-ghost">Edit</a>
|
||
<form method="post" action="/ansible/inventory/targets/{{ tgt.id }}/delete" style="display:inline;">
|
||
<button type="submit" class="btn btn-sm btn-danger"
|
||
onclick="return confirm('Delete target {{ tgt.name }}?')">×</button>
|
||
</form>
|
||
</td>
|
||
</tr>
|
||
{% endfor %}
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
{% endif %}
|
||
{% endblock %}
|