36 lines
1.3 KiB
TypeScript
36 lines
1.3 KiB
TypeScript
/**
|
|
* Chat Agent Component
|
|
* @description Fixed chat agent button positioned at bottom right corner
|
|
*/
|
|
|
|
// Chat icon from Figma design
|
|
const chatIcon = 'https://www.figma.com/api/mcp/asset/34915bcc-807b-45a6-82a2-2806ff0d1d6b';
|
|
|
|
/**
|
|
* ChatAgent component
|
|
* @description Floating chat agent button matching Figma design exactly
|
|
* @returns ChatAgent element
|
|
*/
|
|
export function ChatAgent() {
|
|
return (
|
|
<button
|
|
className="fixed bottom-0 right-0 flex items-center justify-center gap-2 md:gap-3 px-4 py-3 md:px-8 md:py-6 rounded-tl-xl md:rounded-tl-3xl text-white shadow-[-4px_-3px_10px_0px_rgba(123,64,129,0.25)] transition-all hover:opacity-90 z-50 min-h-[44px]"
|
|
style={{
|
|
backgroundImage:
|
|
'linear-gradient(13.793546193113684deg, rgba(0, 27, 47, 1) 10.549%, rgba(6, 38, 168, 1) 30.146%, rgba(3, 154, 152, 1) 77.418%)',
|
|
}}
|
|
aria-label="Chat Agent"
|
|
>
|
|
<img
|
|
src={chatIcon}
|
|
alt="Chat"
|
|
className="w-5 h-5 md:w-6 md:h-6 shrink-0"
|
|
/>
|
|
<span className="text-[0.875rem] md:text-[1.25rem] font-medium leading-tight whitespace-nowrap text-center hidden md:inline">
|
|
Chat Agent
|
|
</span>
|
|
</button>
|
|
);
|
|
}
|
|
|