fix: site: landing and templates render a different top header than docs, changelog and gallery

.agents/skills/codeatlas-ui/API.md

@@ -1119,6 +1119,27 @@ Parts: `ca-dnd-indicator` `ca-dnd-overlay`
 
 Data attributes: `data-axis` (`x` `y`), `data-dnd-active`, `data-dnd-dragging`, `data-dnd-item`, `data-dnd-over`, `data-dnd-pressing`, `data-dnd-zone`
 
+## DocsHeader
+
+`import { DocsHeader } from "@codeatlasdev/ui"`
+
+| Prop | Type | Default | Notes |
+|---|---|---|---|
+| `sections` | `DocsSection[]` |  |  |
+| `active?` | `string` |  | `id` of the current section. |
+| `groups?` | `DocsNavGroup[]` | `[]` | Sidebar tree of the current section, shown in the phone menu. |
+| `pathname` | `string` |  | Current pathname, to mark the current page in the phone menu tree. |
+| `searchIndex` | `DocsSearchEntry[] \| (() => Promise<DocsSearchEntry[]>)` |  |  |
+| `onnavigate` | `(href: string) => void` |  |  |
+| `brandHref?` | `string` | `'/'` | Link target of the brand (default "/"). |
+| `brandLabel?` | `string` |  |  |
+
+Snippets: `brand`: Brand mark + name inside the header link.; `actions`: Extra header actions on the right (e.g. a GitHub link). Keep to 1–2 icon buttons.; `menuFooter`: Content below the sidebar tree inside the mobile Sheet (e.g. external links).
+
+Parts: `ca-docs-actions` `ca-docs-brand` `ca-docs-header` `ca-docs-header__inner` `ca-docs-icon` `ca-docs-search-btn` `ca-docs-search-btn__label` `ca-docs-section` `ca-docs-sections` `ca-docs-sheet-sections` `ca-docs-spacer` `ca-docs-theme` `ca-rail-btn`
+
+Variables: `--ca-docs-header-h` `--ca-docs-max-w`
+
 ## DocsNav
 
 `import { DocsNav } from "@codeatlasdev/ui"`
@@ -1174,7 +1195,7 @@ Tokens: `--ca-dialog-split-columns` `--ca-dialog-split-height` `--ca-dialog-spli
 
 Snippets: `brand`: Brand mark + name inside the header link.; `actions`: Extra header actions on the right (e.g. a GitHub link). Keep to 1–2 icon buttons.; `menuFooter`: Content below the sidebar tree inside the mobile Sheet (e.g. external links).; `children`
 
-Parts: `ca-docs` `ca-docs--bare` `ca-docs-actions` `ca-docs-brand` `ca-docs-header` `ca-docs-header__inner` `ca-docs-icon` `ca-docs-main` `ca-docs-pager` `ca-docs-pager__link` `ca-docs-pager__link--next` `ca-docs-pager__text` `ca-docs-pager__title` `ca-docs-search-btn` `ca-docs-search-btn__label` `ca-docs-section` `ca-docs-sections` `ca-docs-sheet-sections` `ca-docs-sidebar` `ca-docs-spacer` `ca-docs-theme` `ca-docs-toc` `ca-docs-toc-inline` `ca-rail-btn`
+Parts: `ca-docs` `ca-docs--bare` `ca-docs-main` `ca-docs-pager` `ca-docs-pager__link` `ca-docs-pager__link--next` `ca-docs-pager__text` `ca-docs-pager__title` `ca-docs-sidebar` `ca-docs-toc` `ca-docs-toc-inline`
 
 Variables: `--ca-docs-header-h` `--ca-docs-max-w` `--ca-docs-sidebar-w` `--ca-docs-toc-w`
 

.changeset/docs-header-standalone.md

@@ -0,0 +1,5 @@
+---
+"@codeatlasdev/ui": minor
+---
+
+`DocsHeader` is the top bar of `DocsShell` as its own component, so the pages of a site that are not a docs frame (a landing page, a template gallery) render the same header as the docs: one height, container width, brand position, section tabs with an underline for the current one, search (⌘K), actions and theme toggle, and the same phone menu. The bar is now opaque (it was an 82% translucent fill with a blur), so content scrolled under it no longer shows through.

AGENTS.md

@@ -523,7 +523,7 @@ import { DataTable, createCaTable, createCaColumnHelper, caTableFeatures } from
 `Tabs` · `TabsList` · `TabsTrigger` · `TabsContent` · `Breadcrumb` · `Pagination` · `Stepper`
 
 ### Docs (documentation sites)
-`DocsShell` (header + sidebar + page index; on mobile a compact header and menu in a `Sheet`) · `DocsNav` · `TableOfContents` (`variant="rail" | "inline"`) · `DocsSearch` + `searchDocs` · `CodeTabs`/`CodeTab` (copy, `sync` across groups) · `Callout` · `Steps` · `LinkCard` · `CardGrid` · `MethodBadge`. Markdown typography: wrap the HTML in `<div class="ca-prose">`; tables in `.ca-table-wrap`, code in `.ca-code` (shiki dual theme). Syntax highlighting is up to the consumer (shiki at build).
+`DocsShell` (header + sidebar + page index; on mobile a compact header and menu in a `Sheet`) · `DocsHeader` (that header alone, so a landing or template page shares one top bar with the docs; opaque, no `<main>`) · `DocsNav` · `TableOfContents` (`variant="rail" | "inline"`) · `DocsSearch` + `searchDocs` · `CodeTabs`/`CodeTab` (copy, `sync` across groups) · `Callout` · `Steps` · `LinkCard` · `CardGrid` · `MethodBadge`. Markdown typography: wrap the HTML in `<div class="ca-prose">`; tables in `.ca-table-wrap`, code in `.ca-code` (shiki dual theme). Syntax highlighting is up to the consumer (shiki at build).
 
 ```svelte
 <DocsShell {sections} active="api" {groups} {pathname} {headings}

packages/ui/src/lib/components/Docs/DocsHarness.test.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import { createRawSnippet } from 'svelte';
+  import DocsHeader from './DocsHeader.svelte';
   import DocsShell from './DocsShell.svelte';
   import CodeTabs from './CodeTabs.svelte';
   import CodeTab from './CodeTab.svelte';
@@ -15,7 +16,7 @@
     searchIndex,
     ...rest
   }: {
-    kind: 'shell' | 'codetabs' | 'codetabs-pair' | 'steps' | 'callout' | 'cardgrid';
+    kind: 'shell' | 'header' | 'codetabs' | 'codetabs-pair' | 'steps' | 'callout' | 'cardgrid';
     onnavigate?: (href: string) => void;
     searchIndex?: DocsSearchEntry[] | (() => Promise<DocsSearchEntry[]>);
     [k: string]: unknown;
@@ -29,7 +30,18 @@
   const brand = createRawSnippet(() => ({ render: () => `<span>Atlas Docs</span>` }));
 </script>
 
-{#if kind === 'shell'}
+{#if kind === 'header'}
+  <DocsHeader
+    sections={[{ id: 'guide', label: 'Guide', href: '/guide' }, { id: 'api', label: 'API', href: '/api' }]}
+    active="guide"
+    pathname="/guide/start"
+    searchIndex={searchIndex ?? index}
+    {onnavigate}
+    {brand}
+    {...rest}
+  />
+  <div style="height:2000px">page</div>
+{:else if kind === 'shell'}
   <DocsShell
     sections={[{ id: 'guide', label: 'Guide', href: '/guide' }, { id: 'api', label: 'API', href: '/api' }]}
     active="guide"