Watch
0
0
Fork
You've already forked hyperhive
0

swarm-ui: give every tab the wide body

The shell had two body widths, a 60em readable column and a 90em wide body
that a short list of table routes opted into. Every route now gets the
90em body, and the opt-in route list, its modifier class and its test go
away.
This commit is contained in:
iris 2026-10-15 18:34:59 +02:00
commit 89efda5ea2

View file

@ -35,7 +35,7 @@ import { SettingsMenu } from "@hive/shared/settings-menu.js";
import { HideDebugSetting } from "@hive/shared/hide-debug-setting.js";
import { useApplyThemeOverride } from "@hive/shared/theme-apply.js";
import { useApplyMotionOverride } from "@hive/shared/motion-apply.js";
import { isFullBleedRoute, isWideBodyRoute } from "./routes.js";
import { isFullBleedRoute } from "./routes.js";
import { useDynamicTabs } from "./useDynamicTabs.js";
import { useSwarmName } from "./useSwarmName.js";
import "./Shell.css";
@ -136,8 +136,7 @@ function NavLink({
// One open agent-terminal tab (`useDynamicTabs`) — deliberately
// its own small component, not folded into `NavLink` above: dynamic tabs
// don't ride the sliding `.shell-nav-indicator` (there's no fixed set to
// hop between — see `WIDE_BODY_ROUTE_PATTERN`'s own comment on why they
// can't share `NAV_ITEMS`'s Set-based route list either), so "active"
// hop between, so they can't share `NAV_ITEMS`'s fixed route list either), so "active"
// here is a plain class toggle, not a measured position. The close ×
// is a real sibling button, not nested inside the `<Link>` — a button
// inside an `<a>` is invalid HTML and (worse) means a click anywhere on
@ -418,15 +417,10 @@ export function Shell({ children }: { children: ComponentChildren }) {
</div>
</header>
{/* Keyed by route so it remounts (and replays its entrance
animation) on every navigation — see the file-top comment.
`shell-body-wide` is additive (see `WIDE_BODY_ROUTES` above),
not a swap — `.shell-body`'s padding/animation rules still
apply, only the max-width cap changes. */}
animation) on every navigation — see the file-top comment. */}
<div
class={
"shell-body" +
(isWideBodyRoute(location) ? " shell-body-wide" : "") +
(isFullBleedRoute(location) ? " shell-body-full" : "")
"shell-body" + (isFullBleedRoute(location) ? " shell-body-full" : "")
}
key={location}
>