AmirReza Jamali
da250b805d
This commit introduces the `react-tooltip` library to improve user interface clarity and provide a better user experience. Tooltips have been added to the action icons (Edit, Delete, Change Status) in the Admins table. This provides users with clear, on-hover information about the function of each icon, enhancing usability and reducing ambiguity. The implementation involved: - Adding `react-tooltip` as a project dependency. - Importing the required CSS in the root layout. - Integrating the `Tooltip` component within the Admins table.
19 lines
404 B
TypeScript
19 lines
404 B
TypeScript
import { CSSProperties } from "react";
|
|
import { VariantType } from "react-tooltip";
|
|
|
|
export const _TooltipDefaultParams = ({
|
|
id,
|
|
variant = id === "delete" ? "error" : "info",
|
|
styles,
|
|
}: {
|
|
id: string;
|
|
variant?: VariantType;
|
|
styles?: CSSProperties;
|
|
}) => ({
|
|
id,
|
|
delayShow: 500,
|
|
delayHide: 500,
|
|
variant,
|
|
style: { backgroundColor: variant === "error" ? "#F23030" : "", ...styles },
|
|
});
|