You will find all the styles for these components instyles/jss/nextjs-material-kit-pro/tooltipsStyle.js.
Hover over the links below to see tooltips:
Tight pants next level keffiyeh you probably haven't heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney's fixie sustainable quinoa 8-bit american apparel have a terry richardson vinyl chambray. Beard stumptown, cardigans banh mi lomo thundercats. Tofu biodiesel williamsburg marfa, four loko mcsweeney's cleanse vegan chambray. A really ironic artisan whatever keytar, scenester farm-to-table banksy Austin twitter handle freegan cred raw denim single-origin coffee viral.
Hover over the buttons below to see their tooltips.
import React from 'react';
// @material-ui/core components
import { makeStyles } from "@material-ui/core/styles";
import Tooltip from "@material-ui/core/Tooltip";
// core components
import Button from "components/CustomButtons/Button.js";
import tooltipsStyle from "styles/jss/nextjs-material-kit-pro/tooltipsStyle.js";
const useStyles = makeStyles(tooltipsStyle);
export default function Tooltips() {
const { classes } = props;
return (
<div>
<Tooltip
id="tooltip-left"
title="Tooltip on left"
placement="left"
classes={{ tooltip: classes.tooltip }}
>
<Button>On left</Button>
</Tooltip>
<Tooltip
id="tooltip-top"
title="Tooltip on top"
placement="top"
classes={{ tooltip: classes.tooltip }}
>
<Button>On top</Button>
</Tooltip>
<Tooltip
id="tooltip-bottom"
title="Tooltip on bottom"
placement="bottom"
classes={{ tooltip: classes.tooltip }}
>
<Button>On bottom</Button>
</Tooltip>
<Tooltip
id="tooltip-right"
title="Tooltip on right"
placement="right"
classes={{ tooltip: classes.tooltip }}
>
<Button>On right</Button>
</Tooltip>
</div>
);
}For more details please refer to material-ui.