mirror of
https://github.com/idanoo/autobrr
synced 2025-07-23 08:49:13 +00:00
195b2929e0
* make sure fields are validated on page load * make red border only show if useRegex enabled * ensure tooltips have higher z-index in RegexField removed z-index in customtooltip.tsx as its causing issues with tooltips in other components * improved regex validation return false for cases that are unsupported by Go * improved check for unsupported conditionals thanks nuxen
27 lines
No EOL
1 KiB
TypeScript
27 lines
No EOL
1 KiB
TypeScript
import { PlacesType, Tooltip } from "react-tooltip";
|
|
import "./CustomTooltip.css";
|
|
|
|
|
|
interface CustomTooltipProps {
|
|
anchorId: string;
|
|
children?: React.ReactNode;
|
|
clickable?: boolean;
|
|
place?: PlacesType;
|
|
}
|
|
|
|
export const CustomTooltip = ({
|
|
anchorId,
|
|
children,
|
|
clickable = true,
|
|
place = "top"
|
|
}: CustomTooltipProps) => {
|
|
const id = `${anchorId}-tooltip`;
|
|
return (
|
|
<div className="flex items-center">
|
|
<svg id={id} className="ml-1 w-4 h-4 text-gray-500 dark:text-gray-400 fill-current" viewBox="0 0 72 72"><path d="M32 2C15.432 2 2 15.432 2 32s13.432 30 30 30s30-13.432 30-30S48.568 2 32 2m5 49.75H27v-24h10v24m-5-29.5a5 5 0 1 1 0-10a5 5 0 0 1 0 10"/></svg>
|
|
<Tooltip style= {{ maxWidth: "350px", fontSize: "12px", textTransform: "none", fontWeight: "normal", borderRadius: "0.375rem", backgroundColor: "#34343A", color: "#fff", opacity: "1" }} delayShow={100} delayHide={150} place={place} anchorId={id} data-html={true} clickable={clickable}>
|
|
{children}
|
|
</Tooltip>
|
|
</div>
|
|
);
|
|
}; |