Field tooltip title with link fixed

unicef · Jul 4, 2022 · 4bf9dad · 4bf9dad
1 parent 92d9360
commit 4bf9dad
Showing 1 changed file with 11 additions and 1 deletion.
diff --git a/src/components/Shared/InputLabelHelp.js b/src/components/Shared/InputLabelHelp.js
@@ -22,6 +22,11 @@ const useStyles = makeStyles(theme => ({
   linkHelpLabel: {
     paddingLeft: theme.spacing(0.5),
   },
+  tooltipPopper: {
+    '& a': {
+      color: theme.palette.common.white,
+    },
+  },
 }))
 
 export default function InputLabelHelp({
@@ -38,7 +43,12 @@ export default function InputLabelHelp({
     <Fragment>
       <span>{inputLabel}</span>
       {type === 'tooltip' ? (
-        <Tooltip title={tooltipTitle} placement={tooltipPlacement}>
+        <Tooltip
+          interactive
+          title={<div dangerouslySetInnerHTML={{ __html: tooltipTitle }} />}
+          placement={tooltipPlacement}
+          classes={{ popper: classes.tooltipPopper }}
+        >
           <span className={classes.root}>
             {icon ? icon : <HelpIcon />}
             {label ? (