Files
igny8/frontend/src/pages/Settings/UiElements/Tooltips.tsx
2025-11-09 10:27:02 +00:00

35 lines
1.3 KiB
TypeScript

import ComponentCard from "../../../components/common/ComponentCard";
import PageMeta from "../../../components/common/PageMeta";
import { Tooltip } from "../../../components/ui/tooltip";
import Button from "../../../components/ui/button/Button";
export default function Tooltips() {
return (
<>
<PageMeta
title="React.js Tooltips Dashboard | TailAdmin - React.js Admin Dashboard Template"
description="This is React.js Tooltips Dashboard page for TailAdmin - React.js Tailwind CSS Admin Dashboard Template"
/>
<div className="space-y-5 sm:space-y-6">
<ComponentCard title="Tooltip Placements">
<div className="flex flex-wrap items-center gap-6">
<Tooltip text="Tooltip Top" placement="top">
<Button>Tooltip Top</Button>
</Tooltip>
<Tooltip text="Tooltip Right" placement="right">
<Button>Tooltip Right</Button>
</Tooltip>
<Tooltip text="Tooltip Bottom" placement="bottom">
<Button>Tooltip Bottom</Button>
</Tooltip>
<Tooltip text="Tooltip Left" placement="left">
<Button>Tooltip Left</Button>
</Tooltip>
</div>
</ComponentCard>
</div>
</>
);
}