wehub-resource-sync
37 lines
1.1 KiB
TypeScript
37 lines
1.1 KiB
TypeScript
import { LightBulbIcon } from "@heroicons/react/20/solid";
|
|
import { ClipboardIcon } from "lucide-react";
|
|
import { MainCenteredContainer } from "~/components/layout/AppLayout";
|
|
import { Header2 } from "~/components/primitives/Headers";
|
|
import {
|
|
SimpleTooltip,
|
|
Tooltip,
|
|
TooltipContent,
|
|
TooltipProvider,
|
|
TooltipTrigger,
|
|
} from "~/components/primitives/Tooltip";
|
|
|
|
export default function Story() {
|
|
return (
|
|
<MainCenteredContainer className="flex flex-col gap-4">
|
|
<div className="flex gap-4">
|
|
<Header2>Rich Tooltip:</Header2>
|
|
<TooltipProvider>
|
|
<Tooltip>
|
|
<TooltipTrigger>
|
|
<ClipboardIcon className="h-5 w-5" />
|
|
</TooltipTrigger>
|
|
<TooltipContent className="flex items-center gap-1">
|
|
<LightBulbIcon className="h-4 w-4 text-yellow-400" />
|
|
Copy
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
</div>
|
|
<div className="flex gap-4">
|
|
<Header2>Simple Tooltip:</Header2>
|
|
<SimpleTooltip button={<ClipboardIcon className="h-5 w-5" />} content="Copy" />
|
|
</div>
|
|
</MainCenteredContainer>
|
|
);
|
|
}
|