Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$
Metronic 8 - React - tooltip
I added this to my metronic 8 react mode but it does not work any help ?
<span
className="bg-transparent border-0"
data-bs-toggle="tooltip"
data-bs-placement="right"
data-bs-custom-class="tooltip-dark"
title="Tooltip text"
>
<i className="bi bi-exclamation-circle fs-2 text-danger"></i>
</span>Replies (1)
Hi,
Thank you for reaching out to us.
In Metronic React version tooltips should be used differently.
import {OverlayTrigger, Tooltip} from "react-bootstrap";
<OverlayTrigger
placement="right"
delay={{ show: 250, hide: 400 }}
overlay={(props) => (
<Tooltip id="button-tooltip" {...props}>
Tooltip text
</Tooltip>
)}
>
<span
className="bg-transparent border-0"
>
<i className="bi bi-exclamation-circle fs-2 text-danger"></i>
</span>
</OverlayTrigger>You can find more tooltip usage examples React Bootstrap official docs. https://react-bootstrap.github.io/components/overlays/
Regards,
Lauris Stepanovs,
Keenthemes Support Team
