fix(skill): align upload tooltip with Figma design

Replace animated pulse background with static progress bar using
design tokens and increase upload icon to 24px.
This commit is contained in:
yyh 2026-01-28 15:58:49 +08:00
parent 543802cc65
commit a784121070
No known key found for this signature in database

View File

@ -57,7 +57,13 @@ const UploadStatusTooltip: FC<UploadStatusTooltipProps> = ({ fallback }) => {
)}
>
{uploadStatus === 'uploading' && (
<div className="absolute inset-[-0.5px] animate-pulse bg-state-accent-hover-alt opacity-60" />
<>
<div className="absolute inset-[-0.5px] bg-components-progress-bar-bg" />
<div
className="absolute bottom-[-0.5px] left-[-0.5px] top-[-0.5px] border-r-[1.5px] border-components-progress-bar-progress-highlight bg-components-progress-bar-progress"
style={{ width: uploadProgress.total > 0 ? `${(uploadProgress.uploaded / uploadProgress.total) * 100}%` : '0%' }}
/>
</>
)}
{uploadStatus === 'success' && (
<div className="absolute inset-[-0.5px] bg-toast-success-bg opacity-40" />
@ -68,7 +74,7 @@ const UploadStatusTooltip: FC<UploadStatusTooltipProps> = ({ fallback }) => {
<div className="relative z-10 shrink-0">
{uploadStatus === 'uploading' && (
<RiUploadCloud2Line className="size-5 text-text-accent" />
<RiUploadCloud2Line className="size-6 text-text-accent" />
)}
{uploadStatus === 'success' && (
<RiCheckboxCircleFill className="size-5 text-text-success" />