mirror of
https://github.com/windmill-labs/windmill.git
synced 2026-10-28 16:02:47 +00:00
Guilhem LemouelandClaude Opus 5
7e28a10eb2
The band publishes its width, so the pages filling it can answer it. Two tiers: under 1000px the breadcrumb keeps the workspace disc and its env badge and drops the name, and under PHONE_BAR (800) the trail stops yielding at 10rem — that floor is what makes the bar wrap, so a page's buttons take the line below rather than squeezing the name to an ellipsis. The band also draws the line between itself and the page, and only while something is scrolled under it. One capture listener on the window sees every scroller, since most pages scroll inside their own box and never move the layout's. An inset shadow, not a border: a border would move every page down a pixel the moment the line appeared. DetailPageLayout and InWorkspaceAppViewer drew that first line themselves; two lines would stack, so theirs go. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
42 lines
960 B
Svelte
42 lines
960 B
Svelte
<!--
|
|
@component
|
|
Fills the layout's page header from the route that mounts it: the breadcrumb (an item's path, or a
|
|
section name for a list) and the page's own buttons. Renders nothing itself.
|
|
|
|
Only a route page mounts this. An editor nested in a session pane or a drawer must not take over
|
|
the header, so nesting is decided by the caller rather than guessed from context.
|
|
-->
|
|
<script lang="ts">
|
|
import { onMount } from 'svelte'
|
|
import { pageHeader, type PageHeaderContent } from './pageHeaderRegistry.svelte'
|
|
|
|
let {
|
|
item,
|
|
section,
|
|
afterName,
|
|
actions,
|
|
actionsOrder,
|
|
actionsFlexible,
|
|
contexts,
|
|
actingWorkspaceId,
|
|
barRightInset,
|
|
fullBleed
|
|
}: PageHeaderContent = $props()
|
|
|
|
onMount(() => {
|
|
const id = pageHeader.register(() => ({
|
|
item,
|
|
section,
|
|
afterName,
|
|
actions,
|
|
actionsOrder,
|
|
actionsFlexible,
|
|
contexts,
|
|
actingWorkspaceId,
|
|
barRightInset,
|
|
fullBleed
|
|
}))
|
|
return () => pageHeader.release(id)
|
|
})
|
|
</script>
|