style(组件): 优化摘要按钮样式
- 移除 Tooltip 包装,改用原生 title 属性 - 调整按钮为图标 + 文字的布局形式 - 统一按钮样式与其他操作按钮一致 - 简化已有摘要指示器的样式
This commit is contained in:
parent
e7de47d0d9
commit
e415ff5787
@ -4,7 +4,6 @@ import { useState } from 'react';
|
||||
import { Sparkles } from 'lucide-react';
|
||||
import { SummaryModal } from './SummaryModal';
|
||||
import type { SummaryMessage } from './types';
|
||||
import { Tooltip } from '@/components/ui/Tooltip';
|
||||
|
||||
interface SummaryButtonProps {
|
||||
conversationId: string;
|
||||
@ -39,21 +38,20 @@ export function SummaryButton({
|
||||
|
||||
return (
|
||||
<>
|
||||
<Tooltip content="智能摘要" position="bottom">
|
||||
<button
|
||||
type="button"
|
||||
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}`}
|
||||
aria-label="生成智能摘要"
|
||||
>
|
||||
<Sparkles size={18} />
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleClick}
|
||||
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}`}
|
||||
title="生成智能摘要"
|
||||
>
|
||||
<Sparkles size={16} />
|
||||
<span>摘要</span>
|
||||
|
||||
{/* 已有摘要指示器 */}
|
||||
{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" />
|
||||
)}
|
||||
</button>
|
||||
</Tooltip>
|
||||
{/* 已有摘要指示器 */}
|
||||
{hasSummary && (
|
||||
<span className="absolute top-0.5 right-0.5 w-1.5 h-1.5 bg-[var(--color-primary)] rounded-full" />
|
||||
)}
|
||||
</button>
|
||||
|
||||
{/* 摘要 Modal */}
|
||||
<SummaryModal
|
||||
|
||||
Loading…
Reference in New Issue
Block a user