lunanting/ai-chatbot
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: shrink canvas toolbar and restore chat banner
Some checks failed
Lint / build (20) (push) Has been cancelled
Details
Playwright Tests / test (push) Has been cancelled
Details

Browse Source
This commit is contained in:
Your Name 2026-01-24 22:03:17 +08:00
parent 1ad0bc8db6
commit 39c726b5af
2 changed files with 30 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

40
app/canvas/[id]/page.tsx
View File

@ -659,7 +659,7 @@ export default function CanvasEditorPage({ params }: PageProps) {
{/* 5. Floating Bottom Toolbar (Left) */}
<div className="absolute left-4 top-1/2 -translate-y-1/2 z-20">
<div className="flex flex-col items-center gap-3 p-2 rounded-2xl border bg-background/80 backdrop-blur-md shadow-2xl">
<div className="flex flex-col items-center gap-2 p-1.5 rounded-2xl border bg-background/80 backdrop-blur-md shadow-2xl">
{/* Tools: Select, Pan, Add Text, Add Image, Add Video */}
<Tooltip>
<TooltipTrigger asChild>
@ -667,9 +667,9 @@ export default function CanvasEditorPage({ params }: PageProps) {
variant={tool === 'select' ? 'secondary' : 'ghost'}
size="icon"
onClick={() => setTool('select')}
className={cn("rounded-xl h-10 w-10", tool === 'select' && "bg-primary text-primary-foreground hover:bg-primary/90")}
className={cn("rounded-xl h-9 w-9", tool === 'select' && "bg-primary text-primary-foreground hover:bg-primary/90")}
>
<MousePointer className="h-5 w-5" />
<MousePointer className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">选择 (V)</TooltipContent>
@ -681,20 +681,20 @@ export default function CanvasEditorPage({ params }: PageProps) {
variant={tool === 'pan' ? 'secondary' : 'ghost'}
size="icon"
onClick={() => setTool('pan')}
className={cn("rounded-xl h-10 w-10", tool === 'pan' && "bg-primary text-primary-foreground hover:bg-primary/90")}
className={cn("rounded-xl h-9 w-9", tool === 'pan' && "bg-primary text-primary-foreground hover:bg-primary/90")}
>
<Hand className="h-5 w-5" />
<Hand className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">平移 (H)</TooltipContent>
</Tooltip>
<Separator orientation="horizontal" className="w-6 my-1" />
<Separator orientation="horizontal" className="w-5 my-0.5" />
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddTextNode} className="rounded-xl h-10 w-10">
<Type className="h-5 w-5" />
<Button variant="ghost" size="icon" onClick={handleAddTextNode} className="rounded-xl h-9 w-9">
<Type className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加文本</TooltipContent>
@ -702,8 +702,8 @@ export default function CanvasEditorPage({ params }: PageProps) {
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddImageNode} className="rounded-xl h-10 w-10">
<ImagePlus className="h-5 w-5" />
<Button variant="ghost" size="icon" onClick={handleAddImageNode} className="rounded-xl h-9 w-9">
<ImagePlus className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加图片</TooltipContent>
@ -711,19 +711,19 @@ export default function CanvasEditorPage({ params }: PageProps) {
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={handleAddVideoNode} className="rounded-xl h-10 w-10">
<Video className="h-5 w-5" />
<Button variant="ghost" size="icon" onClick={handleAddVideoNode} className="rounded-xl h-9 w-9">
<Video className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">添加视频</TooltipContent>
</Tooltip>
<Separator orientation="horizontal" className="w-6 my-1" />
<Separator orientation="horizontal" className="w-5 my-0.5" />
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={undo} disabled={!canUndo} className="rounded-xl h-10 w-10">
<Undo2 className="h-5 w-5" />
<Button variant="ghost" size="icon" onClick={undo} disabled={!canUndo} className="rounded-xl h-9 w-9">
<Undo2 className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">撤销</TooltipContent>
@ -731,25 +731,25 @@ export default function CanvasEditorPage({ params }: PageProps) {
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={redo} disabled={!canRedo} className="rounded-xl h-10 w-10">
<Redo2 className="h-5 w-5" />
<Button variant="ghost" size="icon" onClick={redo} disabled={!canRedo} className="rounded-xl h-9 w-9">
<Redo2 className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent side="right">重做</TooltipContent>
</Tooltip>
<Separator orientation="horizontal" className="w-6 my-1" />
<Separator orientation="horizontal" className="w-5 my-0.5" />
{/* Zoom Controls */}
<div className="flex flex-col items-center gap-1">
<Button variant="ghost" size="icon" onClick={zoomIn} className="h-8 w-8 rounded-lg">
<ZoomIn className="h-4 w-4" />
<ZoomIn className="h-3.5 w-3.5" />
</Button>
<span className="text-[10px] w-10 text-center tabular-nums font-medium">
{Math.round(viewport.zoom * 100)}%
</span>
<Button variant="ghost" size="icon" onClick={zoomOut} className="h-8 w-8 rounded-lg">
<ZoomOut className="h-4 w-4" />
<ZoomOut className="h-3.5 w-3.5" />
</Button>
</div>
</div>

11
components/canvas/CanvasChatPanel.tsx
View File

@ -309,7 +309,16 @@ export function CanvasChatPanel({ chatId, initialMessages = [] }: CanvasChatPane
{/* Refresh - Removed */}
{/* Banner - Removed */}
{/* Banner */}
<div className="bg-blue-50 dark:bg-blue-900/20 text-blue-600 dark:text-blue-300 p-3 rounded-xl text-sm flex items-center justify-between">
<div className="flex items-center gap-2">
<div className="p-1 bg-blue-100 dark:bg-blue-800 rounded">
<Box className="h-4 w-4" />
</div>
<span>升级会员, Nano Banana Pro 免费365天!</span>
</div>
<X className="h-4 w-4 cursor-pointer opacity-50 hover:opacity-100" />
</div>
</div>
)}