Merge branch 'dhk-1' into 'master'
Dhk 1 See merge request knowledge-base-bj/deerflow-server!77
This commit is contained in:
commit
30410b0a93
4 files changed
+35
-5
No files matched your search
@@ -20,8 +20,11 @@ export function WorkspaceContainer({
|
|||||||
children,
|
children,
|
||||||
...props
|
...props
|
||||||
}: React.ComponentProps<"div">) {
|
}: React.ComponentProps<"div">) {
|
||||||
|
// h-full 而非 h-screen:本容器恒在 WorkspaceRoutes 的 SidebarInset(flex-1,确定高度)下,
|
||||||
|
// h-full 既跟随容器高度(无界等嵌套不再锁死整屏),又修掉原 h-screen=100vh 比可用区域
|
||||||
|
// 高出一个页头高度的溢出。
|
||||||
return (
|
return (
|
||||||
<div className={cn("flex h-screen w-full flex-col", className)} {...props}>
|
<div className={cn("flex h-full w-full flex-col", className)} {...props}>
|
||||||
{children}
|
{children}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -18,8 +18,11 @@ function PageLayout() {
|
|||||||
const { theme } = useTheme();
|
const { theme } = useTheme();
|
||||||
const isDark = theme === "dark";
|
const isDark = theme === "dark";
|
||||||
|
|
||||||
|
// h-full(100%)而非 h-screen(100vh):配合 globals.css 的 html/body/#root height:100%
|
||||||
|
// 高度链,根布局跟随容器高度。全屏下 100% 解析到视口,与 h-screen 等价;无界等嵌套
|
||||||
|
// 下容器不占满整屏时,高度才能正确收缩而非锁死整屏。
|
||||||
return (
|
return (
|
||||||
<div className="h-screen flex flex-col bg-muted/20">
|
<div className="h-full flex flex-col bg-muted/20">
|
||||||
{sidebarEnabled && <Header collapsed={collapsed} />}
|
{sidebarEnabled && <Header collapsed={collapsed} />}
|
||||||
<div className="flex flex-1 overflow-hidden">
|
<div className="flex flex-1 overflow-hidden">
|
||||||
{sidebarEnabled && (
|
{sidebarEnabled && (
|
||||||
|
|||||||
@@ -71,15 +71,27 @@ export function WorkspaceLayout({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<SidebarProvider
|
<SidebarProvider
|
||||||
className="h-full w-full overflow-x-hidden [&_[data-slot=sidebar-container]]:left-[var(--page-sidebar-width)]"
|
// 关键:把 workspace 侧栏从「锚定视口(fixed)」改成「锚定本布局容器(absolute)」。
|
||||||
|
// 原 shadcn 原语用 fixed + left:var(--page-sidebar-width) + top:var(--header-height)
|
||||||
|
// 把侧栏钉在视口坐标上 —— 在无界等「DOM 挂主文档、容器不占满整屏」的嵌套场景下,
|
||||||
|
// fixed 会逃逸到整屏左侧、高度锁死为视口高度(即超出父元素 / 高度写死的根因)。
|
||||||
|
//
|
||||||
|
// 改 absolute 后侧栏改以本 wrapper(relative)为定位基准;又因外层 main 已经
|
||||||
|
// pl-[--page-sidebar-width] 让开了页面侧栏、且 main 的 pl 恒等于 --page-sidebar-width,
|
||||||
|
// 故这里 left/top 归零即与原 fixed 视觉位置逐像素一致;高度则跟随容器而非视口。
|
||||||
|
// 作用域仅限本 SidebarProvider 实例(不动全局 ui/sidebar 原语),不影响 artifacts 等其它侧栏。
|
||||||
|
className={[
|
||||||
|
"relative h-full w-full overflow-x-hidden",
|
||||||
|
"[&_[data-slot=sidebar-container]]:absolute",
|
||||||
|
"[&_[data-slot=sidebar-container]]:left-0",
|
||||||
|
"[&_[data-slot=sidebar-container]]:top-0",
|
||||||
|
].join(" ")}
|
||||||
style={
|
style={
|
||||||
{
|
{
|
||||||
"--page-sidebar-width": pageSidebarWidth,
|
"--page-sidebar-width": pageSidebarWidth,
|
||||||
"--header-height": headerHidden ? "0rem" : "4rem",
|
"--header-height": headerHidden ? "0rem" : "4rem",
|
||||||
} as CSSProperties
|
} as CSSProperties
|
||||||
}
|
}
|
||||||
// Keep the fixed workspace sidebar aligned to the outer page sidebar width.
|
|
||||||
// This lets it slide together when the outer sidebar collapses or expands.
|
|
||||||
data-page-sidebar-collapsed={pageSidebarCollapsed}
|
data-page-sidebar-collapsed={pageSidebarCollapsed}
|
||||||
defaultOpen
|
defaultOpen
|
||||||
>
|
>
|
||||||
|
|||||||
@@ -324,6 +324,18 @@
|
|||||||
@apply bg-background text-foreground;
|
@apply bg-background text-foreground;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 打通高度链:html/body/#root 取满父级高度,使下游用 h-full(100%) 的根布局
|
||||||
|
(PageRoutes 的 PageLayout)跟随容器尺寸而非视口。
|
||||||
|
- 全屏:100% 逐级解析到视口,与原先的 h-screen 等价,无视觉变化;
|
||||||
|
- 无界(wujie)等嵌套:wujie 会把子应用的 html/body 选择器作用到 <wujie-app>
|
||||||
|
容器,于是高度收缩到容器而非整屏 —— 这正是「高度对齐容器」所需。
|
||||||
|
只设 height、不设 overflow,因此不影响 Landing 等需要自然滚动的页面。 */
|
||||||
|
html,
|
||||||
|
body,
|
||||||
|
#root {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
[data-sidebar="menu-button"][data-active="true"] {
|
[data-sidebar="menu-button"][data-active="true"] {
|
||||||
box-shadow: inset 3px 0 0 var(--primary);
|
box-shadow: inset 3px 0 0 var(--primary);
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|||||||
Reference in new issue
Block a user