lunanting/lovart3
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use light gray background for canvas

Browse Source
This commit is contained in:
Your Name 2026-01-24 20:34:30 +08:00
parent 485d6c0615
commit 9a2d07426a
1 changed files with 5 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
components/canvas/CanvasWorkspace.tsx
View File

@ -215,7 +215,7 @@ export function CanvasWorkspace() {
<div
ref={containerRef}
className={cn(
"relative w-full h-full overflow-hidden bg-muted/30 dark:bg-[#1a1a2e]",
"relative w-full h-full overflow-hidden bg-[#f5f5f5] dark:bg-[#1a1a2e]",
tool === 'pan' && "cursor-grab",
isPanning && "cursor-grabbing"
)}
@ -226,18 +226,16 @@ export function CanvasWorkspace() {
onMouseLeave={handleMouseUp}
onWheel={handleWheel}
>
{/* 网格背景 - 支持浅色/深色模式 */}
{/* 网格背景 - 浅色模式 */}
<div
className="absolute inset-0 pointer-events-none dark:opacity-100"
className="absolute inset-0 pointer-events-none dark:hidden"
style={{
backgroundImage: `
linear-gradient(var(--grid-color, rgba(0,0,0,0.06)) 1px, transparent 1px),
linear-gradient(90deg, var(--grid-color, rgba(0,0,0,0.06)) 1px, transparent 1px)
linear-gradient(rgba(0,0,0,0.05) 1px, transparent 1px),
linear-gradient(90deg, rgba(0,0,0,0.05) 1px, transparent 1px)
`,
backgroundSize: `${20 * viewport.zoom}px ${20 * viewport.zoom}px`,
backgroundPosition: `${viewport.x}px ${viewport.y}px`,
// @ts-ignore CSS custom properties
'--grid-color': 'rgba(0,0,0,0.06)',
}}
/>
{/* 深色模式网格 */}