diff --git a/src/Highbyte.Wrighty.Web/Assets/wrighty.css b/src/Highbyte.Wrighty.Web/Assets/wrighty.css index b1e0bcc..23cf993 100644 --- a/src/Highbyte.Wrighty.Web/Assets/wrighty.css +++ b/src/Highbyte.Wrighty.Web/Assets/wrighty.css @@ -431,24 +431,23 @@ input::placeholder, textarea::placeholder { color: var(--muted); } .agent-table th, .agent-table td { text-align: left; } .agent-table-header { color: var(--muted); font-size: .66rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; } .agent-table-header th { padding: .15rem .6rem; } -.agent-table-row > th, .agent-table-row > td { height: 3rem; padding: .35rem .6rem; background: color-mix(in srgb, var(--surface) 76%, transparent); } +.agent-table-row > th, .agent-table-row > td { height: 3rem; padding: .35rem .6rem; background: color-mix(in srgb, var(--surface) 76%, transparent); vertical-align: middle; } .agent-table-row > :first-child { border: 1px solid transparent; border-right: 0; border-radius: .45rem 0 0 .45rem; } .agent-table-row > :last-child { border: 1px solid transparent; border-left: 0; border-radius: 0 .45rem .45rem 0; } .agent-table-row.needs-attention > :first-child { border-color: color-mix(in srgb, #a36a00 42%, var(--line)); } .agent-table-row.needs-attention > :last-child { border-color: color-mix(in srgb, #a36a00 42%, var(--line)); } .agent-table-row form { margin: 0; } -.agent-name-cell { display: grid; min-width: 0; } +.agent-name-cell { min-width: 0; } +.agent-name-content { display: grid; min-width: 0; } .agent-name-cell strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .agent-name-cell small { color: var(--muted); font-size: .65rem; } .agent-state { display: inline-flex; width: fit-content; padding: .08rem .4rem; border-radius: 999px; background: var(--surface-2); color: var(--muted); font-size: .68rem; font-weight: 700; white-space: nowrap; } .agent-state.state-current { color: var(--success); } .agent-state.state-warning { color: var(--warning); } .agent-state.state-muted { color: var(--muted); } -.agent-capacity-cell { display: flex; align-items: center; gap: .35rem; } +.agent-capacity-content, .agent-action-content { display: flex; align-items: center; gap: .35rem; } .button-link-compact { min-height: auto; padding: .1rem .2rem; border-color: transparent; background: transparent; color: var(--accent-text); font-size: .68rem; } -.agent-action-cell { align-items: center; gap: .35rem; } -.agent-action-cell > form, .agent-action-cell > button { margin-right: .35rem; } -.agent-action-cell form { display: flex; } +.agent-action-content form { display: flex; } .agent-enable-switch { display: inline-flex; align-items: center; gap: .35rem; min-height: 1.65rem; padding: .15rem .35rem; border-color: transparent; background: transparent; color: var(--muted); font-size: .68rem; } .agent-enable-switch > span:first-child { position: relative; width: 1.7rem; height: .9rem; border-radius: 999px; background: var(--line); } .agent-enable-switch > span:first-child::after { position: absolute; top: .13rem; left: .13rem; width: .64rem; height: .64rem; border-radius: 50%; background: var(--muted); content: ""; transition: transform .12s ease; } diff --git a/src/Highbyte.Wrighty.Web/Pages/Shared/_Agents.cshtml b/src/Highbyte.Wrighty.Web/Pages/Shared/_Agents.cshtml index 52581ec..a787ea2 100644 --- a/src/Highbyte.Wrighty.Web/Pages/Shared/_Agents.cshtml +++ b/src/Highbyte.Wrighty.Web/Pages/Shared/_Agents.cshtml @@ -166,8 +166,10 @@ - @agent.AgentLabel - @agent.Agent + + @agent.AgentLabel + @agent.Agent +
- @capacityLabel - @if (agent.Capacity?.Simulated == true) - { - Simulated - } - @if (agent.Detected && agent.Capacity is not null) - { - - @Html.AntiForgeryToken() - - - -
- } +
+ @capacityLabel + @if (agent.Capacity?.Simulated == true) + { + Simulated + } + @if (agent.Detected && agent.Capacity is not null) + { +
+ @Html.AntiForgeryToken() + + + +
+ } +
@skillLabel - @if (agent.Skill is not null) - { - @if (canUpdateSkill) +
+ @if (agent.Skill is not null) { -
- @Html.AntiForgeryToken() - - -
+ @if (canUpdateSkill) + { +
+ @Html.AntiForgeryToken() + + +
+ } + } - - } +
@if (agent.Skill is { } skill) diff --git a/tests/Highbyte.Wrighty.UnitTests/Web/WrightyWebServerTests.cs b/tests/Highbyte.Wrighty.UnitTests/Web/WrightyWebServerTests.cs index ca110cf..ded14c4 100644 --- a/tests/Highbyte.Wrighty.UnitTests/Web/WrightyWebServerTests.cs +++ b/tests/Highbyte.Wrighty.UnitTests/Web/WrightyWebServerTests.cs @@ -272,6 +272,9 @@ public async Task Agents_inventory_is_compact_expandable_and_persists_enablement Assert.Contains("Agents on this computer", html); Assert.Contains("hx-sync=\"#agents-region:replace\"", html); Assert.Contains("", html); + Assert.Contains("class=\"agent-name-content\"", html); + Assert.Contains("class=\"agent-capacity-content\"", html); + Assert.Contains("class=\"agent-action-content\"", html); Assert.Contains("data-agent-details-toggle=\"agent-details-codex\"", html); Assert.Contains("aria-label=\"Disable Copilot\"", html); Assert.Contains("name=\"enabled\" value=\"false\"", html); @@ -5744,6 +5747,15 @@ public void Header_and_item_panel_layout_contracts_are_embedded() Assert.Contains(".connection-tools { display: grid; justify-items: end;", stylesheet); Assert.Contains(".access-link-button { min-height: 0; padding: 0; border: 0;", stylesheet); Assert.Contains(".agents-menu.has-current > summary", stylesheet); + Assert.Contains( + ".agent-table-row > th, .agent-table-row > td { height: 3rem; padding: .35rem .6rem; background: color-mix(in srgb, var(--surface) 76%, transparent); vertical-align: middle; }", + stylesheet); + Assert.Contains(".agent-name-content { display: grid; min-width: 0; }", stylesheet); + Assert.Contains( + ".agent-capacity-content, .agent-action-content { display: flex; align-items: center; gap: .35rem; }", + stylesheet); + Assert.DoesNotContain(".agent-name-cell { display:", stylesheet); + Assert.DoesNotContain(".agent-capacity-cell { display:", stylesheet); Assert.Contains(".board-filter-menu { position: relative; align-self: end; width: 7.25rem; }", stylesheet); Assert.Contains(".board-filter-menu > summary { display: flex; align-items: center; justify-content: space-between;", stylesheet); Assert.Contains(".board-filter-heading-actions { display: flex; align-items: center; gap: .25rem; }", stylesheet);