diff --git a/site/source/design-system/tooltip/Tooltip.tsx b/site/source/design-system/tooltip/Tooltip.tsx index 966917ed5..7b86e0b6b 100644 --- a/site/source/design-system/tooltip/Tooltip.tsx +++ b/site/source/design-system/tooltip/Tooltip.tsx @@ -15,13 +15,11 @@ export const Tooltip = ({ tooltip, className, style, - hasArrow = false, }: { children: ReactNode tooltip: ReactNode className?: string style?: CSSProperties - hasArrow?: boolean }) => { const [isHovered, setIsHovered] = useState(false) const [isFocused, setIsFocused] = useState(false) @@ -74,7 +72,6 @@ export const Tooltip = ({ left: x ?? 0, width: 'max-content', }} - $hasArrow={hasArrow} > {tooltip} @@ -83,7 +80,7 @@ export const Tooltip = ({ ) } -const StyledTooltip = styled.span<{ $hasArrow: boolean }>` +const StyledTooltip = styled.span` max-width: 20rem; opacity: 1 !important; @@ -101,21 +98,6 @@ const StyledTooltip = styled.span<{ $hasArrow: boolean }>` * { color: ${({ theme }) => theme.colors.extended.grey[100]}; } - /* Flèche (https://coderpad.io/blog/development/react-tooltip-a-how-to-guide/) : */ - &::after { - ${({ $hasArrow, theme }) => - $hasArrow && - ` - content: " "; - position: absolute; - top: 100%; - left: 50%; - margin-left: -${theme.spacings.xs}; - border-width: ${theme.spacings.xs}; - border-style: solid; - border-color: ${theme.colors.extended.grey[800]} transparent transparent transparent; - `} - } ` const StyledButtonAsText = styled.button` diff --git a/site/source/pages/simulateurs/reduction-generale/RéductionGénéraleMoisParMois.tsx b/site/source/pages/simulateurs/reduction-generale/RéductionGénéraleMoisParMois.tsx index 63a6a644f..37f24c196 100644 --- a/site/source/pages/simulateurs/reduction-generale/RéductionGénéraleMoisParMois.tsx +++ b/site/source/pages/simulateurs/reduction-generale/RéductionGénéraleMoisParMois.tsx @@ -139,7 +139,7 @@ export default function RéductionGénéraleMoisParMois({ )}-${monthName}`} > {data[monthIndex].réductionGénérale ? ( - + {formatValue( { @@ -164,10 +164,7 @@ export default function RéductionGénéraleMoisParMois({ data[monthIndex].rémunérationBrute, }} > - } - hasArrow={true} - > + }> {t('Attention')}