fix: remove logo from canvas chat panel greeting
Some checks failed
Lint / build (20) (push) Has been cancelled
Playwright Tests / test (push) Has been cancelled

This commit is contained in:
Your Name 2026-01-24 21:57:55 +08:00
parent 601900f933
commit 1ad0bc8db6
2 changed files with 45 additions and 77 deletions

View File

@ -369,7 +369,7 @@ export default function CanvasEditorPage({ params }: PageProps) {
</div>
{/* 2. Floating Header (Top Left) */}
<div className="absolute top-24 left-4 z-20 flex items-center gap-2 bg-background/80 backdrop-blur-md border rounded-xl p-1.5 shadow-sm">
<div className="absolute top-16 left-4 z-20 flex items-center gap-2 bg-background/80 backdrop-blur-md border rounded-xl p-1.5 shadow-sm">
<Tooltip>
<TooltipTrigger asChild>
<Button variant="ghost" size="icon" onClick={() => router.push('/')} className="rounded-lg h-8 w-8">
@ -436,34 +436,36 @@ export default function CanvasEditorPage({ params }: PageProps) {
</div>
{/* 3. Floating Actions (Top Right) */}
<div className="absolute top-24 right-4 z-20 flex items-center gap-2">
<div className="bg-background/80 backdrop-blur-md border rounded-xl p-1.5 shadow-sm flex items-center gap-1">
{/* Panel Toggle */}
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="ghost"
size="icon"
onClick={() => setIsPanelOpen(!isPanelOpen)}
className={cn("rounded-lg h-8 w-8", isPanelOpen && "bg-muted")}
>
{isPanelOpen ? <PanelRightClose className="h-4 w-4" /> : <PanelRight className="h-4 w-4" />}
</Button>
</TooltipTrigger>
<TooltipContent>{isPanelOpen ? "隐藏面板" : "显示面板"}</TooltipContent>
</Tooltip>
</div>
</div>
{!isPanelOpen && (
<div className="absolute top-16 right-4 z-20 flex items-center gap-2">
<div className="bg-background/80 backdrop-blur-md border rounded-xl p-1.5 shadow-sm flex items-center gap-1">
{/* Panel Toggle */}
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="ghost"
size="icon"
onClick={() => setIsPanelOpen(!isPanelOpen)}
className="rounded-lg h-8 w-8"
>
<PanelRight className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent>显示面板</TooltipContent>
</Tooltip>
</div>
</div>
)}
{/* 4. Floating Sidebar (Right) */}
<div className={cn(
"absolute top-40 right-4 bottom-4 z-10 w-[400px] transition-all duration-300 ease-in-out",
"absolute top-16 right-4 bottom-4 z-10 w-[400px] transition-all duration-300 ease-in-out",
isPanelOpen ? "translate-x-0 opacity-100" : "translate-x-[120%] opacity-0"
)}>
<div className="h-full w-full rounded-2xl border bg-background/95 backdrop-blur-md shadow-2xl overflow-hidden flex flex-col">
<Tabs defaultValue="chat" className="flex flex-col h-full">
<div className="px-4 pt-4 pb-2 bg-muted/30 border-b">
<TabsList className="grid w-full grid-cols-2">
<div className="px-4 pt-4 pb-2 bg-muted/30 border-b flex items-center justify-between">
<TabsList className="grid w-[calc(100%-40px)] grid-cols-2">
<TabsTrigger value="chat" className="text-xs">
<MessageSquare className="h-3.5 w-3.5 mr-1.5" />
AI 对话
@ -473,6 +475,21 @@ export default function CanvasEditorPage({ params }: PageProps) {
快捷工具
</TabsTrigger>
</TabsList>
{/* Integrated Close Button */}
<Tooltip>
<TooltipTrigger asChild>
<Button
variant="ghost"
size="icon"
onClick={() => setIsPanelOpen(false)}
className="h-8 w-8 rounded-lg hover:bg-background/50"
>
<PanelRightClose className="h-4 w-4" />
</Button>
</TooltipTrigger>
<TooltipContent>隐藏面板</TooltipContent>
</Tooltip>
</div>
{/* AI 对话标签页 */}

View File

@ -27,24 +27,8 @@ interface CanvasChatPanelProps {
initialMessages?: ChatMessage[];
}
// 建议卡片数据
const SUGGESTIONS = [
{
title: "Wine List",
desc: "Mimic this effect to genera...",
image: "https://images.unsplash.com/photo-1510812431401-41d2bd2722f3?w=300&h=200&fit=crop"
},
{
title: "Coffee Shop Branding",
desc: "you are a brand design...",
image: "https://images.unsplash.com/photo-1509042239860-f550ce710b93?w=300&h=200&fit=crop"
},
{
title: "Story Board",
desc: "I NEED A STORY BOARD...",
image: "https://images.unsplash.com/photo-1626785774573-4b799314346d?w=300&h=200&fit=crop"
}
];
// 建议卡片数据 - 已移除
const SUGGESTIONS: { title: string; desc: string; image: string }[] = [];
// 从消息中提取图片 URL
function extractImageUrls(text: string): string[] {
@ -317,48 +301,15 @@ export function CanvasChatPanel({ chatId, initialMessages = [] }: CanvasChatPane
<div className="flex flex-col h-full pt-4">
{/* Greeting */}
<div className="mb-8">
<div className="w-12 h-12 bg-black rounded-full flex items-center justify-center mb-4">
<span className="text-white font-bold text-xl">-L°</span>
</div>
<h1 className="text-2xl font-bold mb-2">Hi, 我是你的AI设计师</h1>
<p className="text-muted-foreground">让我们开始今天的创作吧!</p>
</div>
{/* Suggestions */}
<div className="space-y-3 mb-8">
{SUGGESTIONS.map((item, i) => (
<div
key={i}
className="flex items-center justify-between p-3 bg-card rounded-xl border hover:shadow-md transition-all cursor-pointer group"
onClick={() => setInput(prev => prev || item.desc)}
>
<div className="flex-1 min-w-0 mr-3">
<h3 className="font-medium text-sm mb-1 group-hover:text-primary transition-colors">{item.title}</h3>
<p className="text-xs text-muted-foreground truncate">{item.desc}</p>
</div>
<div className="w-16 h-12 rounded-lg overflow-hidden shrink-0">
<img src={item.image} alt={item.title} className="w-full h-full object-cover" />
</div>
</div>
))}
</div>
{/* Suggestions - Removed */}
{/* Refresh - Removed */}
{/* Refresh */}
<div className="flex items-center gap-1 text-xs text-muted-foreground mb-4 cursor-pointer hover:text-foreground w-fit">
<RefreshCw className="h-3 w-3" />
<span>切换</span>
</div>
{/* 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>
{/* Banner - Removed */}
</div>
)}