refactor: drop ellipsis dots on active tool labels, use opacity only
Ellipsis dots after tool names were visually noisy. Replace with a subtle opacity dip (100% -> 70% with 200ms transition) while the tool is active.
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { BusyDots } from './BusyDots';
|
import { cn } from '@/lib/utils';
|
||||||
|
|
||||||
const MAX_BUSY_DURATION_MS = 5 * 60 * 1000; // 5 minutes cap
|
const MAX_BUSY_DURATION_MS = 5 * 60 * 1000; // 5 minutes cap
|
||||||
|
|
||||||
@@ -80,9 +80,12 @@ export const MinDurationShineText: React.FC<MinDurationShineTextProps> = ({
|
|||||||
}, [active, minDurationMs, isBusy]);
|
}, [active, minDurationMs, isBusy]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<span className={className} style={style} title={title}>
|
<span
|
||||||
|
className={cn('transition-opacity duration-200', isBusy && 'opacity-70', className)}
|
||||||
|
style={style}
|
||||||
|
title={title}
|
||||||
|
>
|
||||||
{children}
|
{children}
|
||||||
{isBusy ? <BusyDots /> : null}
|
|
||||||
</span>
|
</span>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user