product/Nano-Banana-AI-Image-Editor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

优化 整体风格统一化调整

Browse Source
This commit is contained in:
yuantao
2025-09-16 13:05:57 +08:00
parent b910110b6d
commit e0600f5d50
7 changed files with 63 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/components/PromptComposer.tsx
View File

@@ -138,10 +138,10 @@ export const PromptComposer: React.FC = () => {
if (!showPromptPanel) {
return (
<div className="w-8 bg-white border-r border-gray-200 flex flex-col items-center justify-center">
<div className="w-8 bg-white flex flex-col items-center justify-center rounded-l-xl">
<button
onClick={() => setShowPromptPanel(true)}
className="w-6 h-16 bg-gray-100 hover:bg-gray-200 rounded-r-lg border border-l-0 border-gray-300 flex items-center justify-center transition-colors group"
className="w-6 h-16 bg-gray-100 hover:bg-gray-200 rounded-r-lg flex items-center justify-center transition-colors group"
title="显示提示面板"
>
<div className="flex flex-col space-y-1">
@@ -156,7 +156,7 @@ export const PromptComposer: React.FC = () => {
return (
<>
<div className="w-72 h-full bg-white border-r border-gray-200 p-4 flex flex-col space-y-5 overflow-y-auto shadow-lg">
<div className="w-72 h-full bg-white p-4 flex flex-col space-y-5 overflow-y-auto">
<div>
<div className="flex items-center justify-between mb-2">
<h3 className="text-xs font-medium text-gray-500 uppercase tracking-wide">模式</h3>
@@ -165,7 +165,7 @@ export const PromptComposer: React.FC = () => {
variant="ghost"
size="icon"
onClick={() => setShowHintsModal(true)}
className="h-6 w-6 text-gray-400 hover:text-gray-600 hover:bg-gray-100"
className="h-6 w-6 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-full card"
>
<HelpCircle className="h-3.5 w-3.5" />
</Button>
@@ -173,7 +173,7 @@ export const PromptComposer: React.FC = () => {
variant="ghost"
size="icon"
onClick={() => setShowPromptPanel(false)}
className="h-6 w-6 text-gray-400 hover:text-gray-600 hover:bg-gray-100"
className="h-6 w-6 text-gray-400 hover:text-gray-600 hover:bg-gray-100 rounded-full card"
title="隐藏面板"
>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round">
@@ -255,7 +255,7 @@ export const PromptComposer: React.FC = () => {
variant="outline"
size="sm"
onClick={() => fileInputRef.current?.click()}
className="mt-1"
className="mt-1 card"
disabled={
(selectedTool === 'generate' && uploadedImages.length >= 2) ||
(selectedTool === 'edit' && editReferenceImages.length >= 2)
@@ -335,7 +335,7 @@ export const PromptComposer: React.FC = () => {
<div className="flex gap-2">
<Button
onClick={() => selectedTool === 'generate' ? cancelGeneration() : cancelEdit()}
className="flex-1 h-12 text-sm font-medium bg-red-500 hover:bg-red-600 rounded-lg"
className="flex-1 h-12 text-sm font-medium bg-red-500 hover:bg-red-600 rounded-lg card"
>
<div className="animate-spin rounded-full h-4 w-4 border-b-2 border-white mr-2" />
中断
@@ -345,7 +345,7 @@ export const PromptComposer: React.FC = () => {
<Button
onClick={handleGenerate}
disabled={!currentPrompt.trim()}
className="w-full h-12 text-sm font-medium rounded-lg shadow-sm hover:shadow-md transition-shadow"
className="w-full h-12 text-sm font-medium rounded-lg shadow-sm hover:shadow-md transition-shadow card"
>
<Wand2 className="h-4 w-4 mr-2" />
{selectedTool === 'generate' ? '生成图像' : '应用编辑'}
@@ -415,7 +415,7 @@ export const PromptComposer: React.FC = () => {
variant="destructive"
size="sm"
onClick={handleClearSession}
className="flex-1 h-8 text-xs"
className="flex-1 h-8 text-xs card"
>
确认
</Button>
@@ -423,7 +423,7 @@ export const PromptComposer: React.FC = () => {
variant="outline"
size="sm"
onClick={() => setShowClearConfirm(false)}
className="flex-1 h-8 text-xs border-gray-200"
className="flex-1 h-8 text-xs border-gray-200 card"
>
取消
</Button>