added action-tooltip and transparent mode-toggle
This commit is contained in:
parent
f41829fa41
commit
7d9c652d3f
37
components/action-tooltip.tsx
Normal file
37
components/action-tooltip.tsx
Normal file
@ -0,0 +1,37 @@
|
|||||||
|
"user client"
|
||||||
|
|
||||||
|
import {
|
||||||
|
Tooltip,
|
||||||
|
TooltipContent,
|
||||||
|
TooltipProvider,
|
||||||
|
TooltipTrigger,
|
||||||
|
} from "@/components/ui/tooltip";
|
||||||
|
|
||||||
|
interface ActionTooltipProps {
|
||||||
|
label: string;
|
||||||
|
children: React.ReactNode;
|
||||||
|
side?: "top" | "right" | "bottom" | "left";
|
||||||
|
align?: "start" | "center" | "end";
|
||||||
|
}
|
||||||
|
|
||||||
|
export const ActionTooltip = ({
|
||||||
|
label,
|
||||||
|
children,
|
||||||
|
side,
|
||||||
|
align,
|
||||||
|
}: ActionTooltipProps) => {
|
||||||
|
return (
|
||||||
|
<TooltipProvider>
|
||||||
|
<Tooltip delayDuration={50}>
|
||||||
|
<TooltipTrigger asChild>
|
||||||
|
{children}
|
||||||
|
</TooltipTrigger>
|
||||||
|
<TooltipContent side={side} align={align}>
|
||||||
|
<p className="font-semibold text-sm capitalize">
|
||||||
|
{label.toLowerCase()}
|
||||||
|
</p>
|
||||||
|
</TooltipContent>
|
||||||
|
</Tooltip>
|
||||||
|
</TooltipProvider>
|
||||||
|
)
|
||||||
|
}
|
Loading…
x
Reference in New Issue
Block a user