Keep Web5 card actions at the bottom when neighbours grow

This commit is contained in:
archipelago
2026-10-06 04:36:25 -04:00
parent f4fa575fa0
commit c78b6021c3
5 changed files with 55 additions and 10 deletions
+29
View File
@@ -205,3 +205,32 @@ Yaya-only catalog is prepared with one Sovereign Music banner and a 90-day
expiry. No catalog has been signed or installed, and the original Portainer expiry. No catalog has been signed or installed, and the original Portainer
stack/data remain unchanged. Signature, managed installation, data migration, stack/data remain unchanged. Signature, managed installation, data migration,
wrong-node rejection and physical companion acceptance remain open. wrong-node rejection and physical companion acceptance remain open.
### Web5 footer alignment and continued qualification
The operator added bottom-aligned Monitoring/card actions to the backlog.
Monitoring, Federation and Identities now use growing card columns with footer
space above the actions. No fixed card height or absolute-positioned button is
introduced. Connected Nodes, Node Visibility and Nostr Relays already use growing
content or automatic footer margins.
A headless browser with the source candidate and authenticated local backend
passed all six card/viewport cases (three cards at 390px and 1440px), measuring
bottom padding while adjacent content expands and shrinks. Seven relevant
component tests pass. Evidence: `/tmp/archy-card-footer-browser.log` and
`/tmp/archy-card-footer-unit.log`. These are candidate checks; node deployment
and operator acceptance remain pending.
The integrated dashboard suite before this footer-only change passed 1,262 tests
in 158 files, and its production build passed. The isolated backend suite is
still compiling. A candidate-production V4V browser run passed mobile hidden
playback, bottom-bar pause/resume, reopen of the same frame and stop. Desktop
currently times out clicking Close and remains under investigation.
The alternate-port preview correctly failed V4V's dashboard-origin restriction.
Candidate HTML substituted at the normal origin also needed Chromium's explicit
local-network permission because synthetic responses lack normal address-space
metadata. That permission is confined to the isolated loopback test context;
no app origin policy or live browser settings were weakened. These fixture
results cannot replace final deployed-node/companion acceptance.
+12
View File
@@ -360,3 +360,15 @@ with standard MeshCore clients on the selected UK RF plan. Two Archipelago radio
agreeing with each other on a private/custom channel is not acceptance. Custom agreeing with each other on a private/custom channel is not acceptance. Custom
channel creation/configuration is deferred to later work and must not be added channel creation/configuration is deferred to later work and must not be added
as a substitute for repairing the standard public-channel experience. as a substitute for repairing the standard public-channel experience.
## 16. Web5 card footer alignment
- Keep Monitoring buttons anchored to the bottom of their card when adjacent
cards grow, including search/loading/results changes. Apply the same footer
behaviour to matching cards without changing the design system or adding
unnecessary minimum height.
- Preserve normal document flow and space between content and actions; avoid
absolute positioning that overlaps content. Verify tall neighbours, shrinking
results, long labels, keyboard access and mobile/desktop layouts.
- Record actual browser geometry checks and deployment acceptance separately.
+2 -2
View File
@@ -1,6 +1,6 @@
<template> <template>
<!-- Federation Summary --> <!-- Federation Summary -->
<div class="glass-card p-6"> <div class="glass-card p-6 flex flex-col">
<div class="flex items-center justify-between mb-4"> <div class="flex items-center justify-between mb-4">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="flex-shrink-0 w-10 h-10 rounded-lg bg-white/10 flex items-center justify-center"> <div class="flex-shrink-0 w-10 h-10 rounded-lg bg-white/10 flex items-center justify-center">
@@ -72,7 +72,7 @@
</div> </div>
</div> </div>
<div class="web5-card-actions-bottom-grid mt-6 grid-cols-2 gap-3"> <div class="web5-card-actions-bottom-grid mt-auto pt-6 grid-cols-2 gap-3">
<RouterLink to="/dashboard/server/federation" class="mobile-card-action glass-button rounded-lg text-sm font-medium text-white/90 hover:text-white transition-colors no-underline"> <RouterLink to="/dashboard/server/federation" class="mobile-card-action glass-button rounded-lg text-sm font-medium text-white/90 hover:text-white transition-colors no-underline">
Connect with Nodes Connect with Nodes
</RouterLink> </RouterLink>
+6 -4
View File
@@ -1,6 +1,6 @@
<template> <template>
<!-- Identity Management --> <!-- Identity Management -->
<div class="glass-card p-6 identities-card"> <div class="glass-card p-6 identities-card flex flex-col">
<!-- Desktop: side-by-side --> <!-- Desktop: side-by-side -->
<div class="hidden md:flex items-center justify-between mb-4"> <div class="hidden md:flex items-center justify-between mb-4">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
@@ -220,9 +220,11 @@
</div> </div>
</div> </div>
<button @click="showCreateIdentityModal = true" class="web5-card-actions-bottom mt-4 mobile-card-action glass-button rounded-lg text-sm font-medium"> <div class="mt-auto pt-4">
Create <button @click="showCreateIdentityModal = true" class="web5-card-actions-bottom mobile-card-action glass-button rounded-lg text-sm font-medium">
</button> Create
</button>
</div>
</div> </div>
<!-- Create Identity Modal --> <!-- Create Identity Modal -->
+6 -4
View File
@@ -1,6 +1,6 @@
<template> <template>
<!-- System Monitoring Summary --> <!-- System Monitoring Summary -->
<div class="glass-card p-6"> <div class="glass-card p-6 flex flex-col">
<div class="flex items-center justify-between mb-4"> <div class="flex items-center justify-between mb-4">
<div class="flex items-center gap-3"> <div class="flex items-center gap-3">
<div class="flex-shrink-0 w-10 h-10 rounded-lg bg-white/10 flex items-center justify-center"> <div class="flex-shrink-0 w-10 h-10 rounded-lg bg-white/10 flex items-center justify-center">
@@ -65,9 +65,11 @@
</div> </div>
</div> </div>
<RouterLink to="/dashboard/monitoring" class="web5-card-actions-bottom mt-6 mobile-card-action glass-button rounded-lg text-sm font-medium text-white/90 hover:text-white transition-colors shrink-0 no-underline"> <div class="mt-auto pt-6">
Details <RouterLink to="/dashboard/monitoring" class="web5-card-actions-bottom mobile-card-action glass-button rounded-lg text-sm font-medium text-white/90 hover:text-white transition-colors shrink-0 no-underline">
</RouterLink> Details
</RouterLink>
</div>
</div> </div>
</template> </template>