feat: enlève la flèche sur les tooltip

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}
 				</StyledTooltip>
@@ -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`

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 ? (
-											<Tooltip tooltip={tooltip} hasArrow={true}>
+											<Tooltip tooltip={tooltip}>
 												<StyledDiv>
 													{formatValue(
 														{
@@ -164,10 +164,7 @@ export default function RéductionGénéraleMoisParMois({
 															data[monthIndex].rémunérationBrute,
 													}}
 												>
-													<Tooltip
-														tooltip={<WarningSalaireTrans />}
-														hasArrow={true}
-													>
+													<Tooltip tooltip={<WarningSalaireTrans />}>
 														<span className="sr-only">{t('Attention')}</span>
 														<StyledWarningIcon aria-label={t('Attention')} />
 													</Tooltip>