fix(canvas): align fixed design sidebars

This commit is contained in:
inman
2026-09-07 16:08:17 +08:00
parent e98603435d
commit 6a05992e18
10 changed files with 74 additions and 25 deletions

View File

@@ -11,14 +11,14 @@ export function DesignHistoryRail({ workspace }: { workspace: DesignWorkspace |
<aside
data-testid="image-workspace-history-rail"
aria-label="历史作品"
className="flex h-full min-h-0 w-[320px] shrink-0 flex-col border-l border-border/70 bg-background font-sans xl:w-[340px]"
className="flex h-full min-h-0 w-64 shrink-0 flex-col border-l border-border/70 bg-background font-sans"
>
<header
data-testid="image-workspace-history-header"
className={cn(
'flex h-12 shrink-0 items-center border-b border-border/70 px-4',
'flex h-10 shrink-0 items-center border-b border-border/70 px-4',
platform === 'darwin' && 'pr-[116px]',
platform === 'win32' && 'pr-[244px]',
platform === 'win32' && 'pr-[148px]',
)}
>
<div className="flex min-w-0 items-center gap-2">

View File

@@ -46,15 +46,15 @@ function LoadingWorkspace() {
return (
<div className="flex h-full min-h-0 bg-background" aria-label="正在加载 AI 设计">
<div className="flex min-w-0 flex-1 flex-col">
<div className="h-12 animate-pulse border-b border-border/60 bg-surface-subtle/60" />
<div className="h-10 animate-pulse border-b border-border/60 bg-surface-subtle/60" />
<div className="min-h-0 flex-1 space-y-4 bg-surface-subtle/35 p-6">
<div className="h-16 animate-pulse rounded-2xl bg-surface-subtle" />
<div className="ml-auto h-20 w-4/5 animate-pulse rounded-2xl bg-brand/[0.07]" />
<div className="h-48 w-5/6 animate-pulse rounded-2xl bg-surface-subtle" />
</div>
</div>
<div className="hidden h-full w-[320px] shrink-0 flex-col border-l border-border/70 bg-background lg:flex xl:w-[340px]">
<div className="h-12 animate-pulse border-b border-border/60 bg-surface-subtle/45" />
<div className="hidden h-full w-64 shrink-0 flex-col border-l border-border/70 bg-background lg:flex">
<div className="h-10 animate-pulse border-b border-border/60 bg-surface-subtle/45" />
<div className="space-y-3 p-3">
{[0, 1, 2].map((item) => (
<div key={item} className="h-16 animate-pulse rounded-xl bg-surface-subtle" />
@@ -159,7 +159,7 @@ export function ImageCanvas() {
<div data-testid="image-workspace" className="flex h-full min-h-0 overflow-hidden bg-background font-sans">
<div className="flex min-w-0 flex-1 flex-col">
<header data-testid="image-workspace-header" className={cn(
'flex h-12 shrink-0 items-center gap-3 border-b border-border/70 bg-background',
'flex h-10 shrink-0 items-center gap-3 border-b border-border/70 bg-background',
platform === 'darwin'
? 'pl-4 pr-[116px] sm:pl-5'
: platform === 'win32'