167b3ae251
The Host page was crowded (identity, codecs, ports, GPU, displays, compositors) and the virtual-display config surface is large enough to warrant its own home. - New **Virtual displays** nav section: `/displays` route + `sections/Displays` (moved DisplayCard out of `sections/Host`), a `MonitorPlay` sidebar entry after Host, and `nav_displays` i18n. Removed the displays card from the Host page/view. - On its own page the card splits into two: **Configuration** (presets + custom axes) and **Live displays** (the live list + arrangement table) — room to breathe. - Presets now render in a max-2-column grid (`sm:grid-cols-2`) with larger padding, a bigger section heading + preset titles (text-base semibold), roomier spacing, and bottom-aligned "what it sets" badges so the cards line up. web tsc + vite build + biome-lint green; deployed + verified on the Mutter box (.21). Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
23 lines
768 B
TypeScript
23 lines
768 B
TypeScript
import Section from "@unom/ui/section";
|
|
import type { FC } from "react";
|
|
import { useLocale } from "@/lib/i18n";
|
|
import { m } from "@/paraglide/messages";
|
|
import { DisplaySection } from "./DisplayCard";
|
|
|
|
/**
|
|
* The **Virtual displays** page (design/display-management.md): the host's virtual-display policy
|
|
* (presets + every axis) plus the live-display list + multi-monitor arrangement. Its own nav
|
|
* section — the config surface is large enough to warrant the room, and it kept the Host page busy.
|
|
*/
|
|
export const SectionDisplays: FC = () => {
|
|
useLocale();
|
|
return (
|
|
<Section maxWidth={false}>
|
|
<div className="flex flex-col gap-card">
|
|
<h1 className="text-2xl font-semibold">{m.nav_displays()}</h1>
|
|
<DisplaySection />
|
|
</div>
|
|
</Section>
|
|
);
|
|
};
|