Watch
0
0
Fork
You've already forked hyperhive
0
Commit graph hyperhive/frontend/packages/swarm-ui/src/shell/LinksMenu.css
Author SHA1 Message Date
iris
7c15cd46d2 swarm-ui: don't break at a narrow viewport
Closes #3447.

- Shell.css: .shell-header and .shell-nav wrap onto a second line
  below a breakpoint instead of forcing horizontal overflow — no
  hamburger/collapse menu, per mara's own 'don't break, don't
  over-invest' scoping.
- LinksMenu.css: bumped .links-menu-button and .links-menu-item to the
  same 2.75em (~44px, WCAG 2.5.5) touch-target floor the shared ui/
  kit's form controls and buttons already carry — this trigger is
  bespoke, not built from that kit, but the floor applies regardless.
- Table.tsx/.css: wrapped the table in a .ui-table-scroll container
  (overflow-x: auto) so a wide table scrolls within its own box on a
  narrow viewport instead of forcing the whole page to overflow
  horizontally — not named in the issue's two concrete spots, but the
  same 'should not break' failure mode, and fixing it at the shared
  Table primitive covers every future caller.

.create-agent-input's fixed width -> max-width was already fixed as
part of #3448's form kit.

Verified: tsc clean, build succeeds, screenshotted at 320px (hives
nav wraps, table scrolls internally, page itself doesn't overflow)
and 480px (create-agent form fields fit).
2026-08-18 22:44:24 +02:00
iris
8542f2ca42 swarm-ui: header links menu for swarm-wide services (hyperhive#3289)
Single 🔗 button in the Shell header (direction 1 of 3 proposed on the
issue) — one fixed element regardless of link count, so it can't
clutter as the list grows, and visible on every route since Shell
wraps all of them. Opens a popover listing whatever GET /api/links
returns (icon + label, opens in a new tab); hidden entirely when the
list is empty, same "don't render a dead affordance" rule the old
dashboard's H0M3 tiles follow for Forge/Matrix.

Docs: docs/swarm/ui.md gets a short section on the feature + the
contribute-your-own-entry idiom.

Verified: npm run build + npm run typecheck clean, headless-chromium
screenshots of both the closed and (temporarily forced open for the
screenshot only) open states, pixel-sampled to confirm the popover is
actually using the dark theme vars and not just looking that way in a
downscaled preview.
2026-08-15 14:24:52 +02:00