style(组件): 优化摘要按钮样式

- 移除 Tooltip 包装,改用原生 title 属性
- 调整按钮为图标 + 文字的布局形式
- 统一按钮样式与其他操作按钮一致
- 简化已有摘要指示器的样式
This commit is contained in:
gaoziman 2025-12-28 17:29:26 +08:00
parent e7de47d0d9
commit e415ff5787

View File

@ -4,7 +4,6 @@ import { useState } from 'react';
import { Sparkles } from 'lucide-react'; import { Sparkles } from 'lucide-react';
import { SummaryModal } from './SummaryModal'; import { SummaryModal } from './SummaryModal';
import type { SummaryMessage } from './types'; import type { SummaryMessage } from './types';
import { Tooltip } from '@/components/ui/Tooltip';
interface SummaryButtonProps { interface SummaryButtonProps {
conversationId: string; conversationId: string;
@ -39,21 +38,20 @@ export function SummaryButton({
return ( return (
<> <>
<Tooltip content="智能摘要" position="bottom">
<button <button
type="button" type="button"
onClick={handleClick} onClick={handleClick}
className={`relative p-2 rounded text-[var(--color-text-secondary)] hover:bg-[var(--color-bg-secondary)] hover:text-[var(--color-primary)] transition-all duration-150 ${className}`} className={`relative flex items-center gap-2 px-3 py-1.5 text-sm text-[var(--color-text-secondary)] hover:bg-[var(--color-bg-hover)] rounded-[4px] transition-colors ${className}`}
aria-label="生成智能摘要" title="生成智能摘要"
> >
<Sparkles size={18} /> <Sparkles size={16} />
<span></span>
{/* 已有摘要指示器 */} {/* 已有摘要指示器 */}
{hasSummary && ( {hasSummary && (
<span className="absolute top-1 right-1 w-2 h-2 bg-[var(--color-primary)] rounded-full border-2 border-[var(--color-bg-primary)] animate-pulse" /> <span className="absolute top-0.5 right-0.5 w-1.5 h-1.5 bg-[var(--color-primary)] rounded-full" />
)} )}
</button> </button>
</Tooltip>
{/* 摘要 Modal */} {/* 摘要 Modal */}
<SummaryModal <SummaryModal