From 61d55808caffbc5ca5bb5b8f418a55c3d027eea7 Mon Sep 17 00:00:00 2001
From: Alice Dahan <lilice.dhn@gmail.com>
Date: Tue, 21 Jan 2025 15:57:34 +0100
Subject: [PATCH] =?UTF-8?q?feat(rgcp):=20remplacement=20de=20l'ic=C3=B4ne?=
 =?UTF-8?q?=20loupe=20par=20un=20oeil?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../RéductionDeCotisations/Montant.tsx        |  7 +++--
 .../design-system/icons/index.stories.tsx     |  1 +
 site/source/design-system/icons/index.tsx     | 30 ++++++++++++++-----
 3 files changed, 27 insertions(+), 11 deletions(-)

diff --git a/site/source/components/RéductionDeCotisations/Montant.tsx b/site/source/components/RéductionDeCotisations/Montant.tsx
index 6a32f78b3..6739db08c 100644
--- a/site/source/components/RéductionDeCotisations/Montant.tsx
+++ b/site/source/components/RéductionDeCotisations/Montant.tsx
@@ -6,7 +6,7 @@ import { styled } from 'styled-components'
 import { Condition } from '@/components/EngineValue/Condition'
 import Répartition from '@/components/RéductionDeCotisations/Répartition'
 import { FlexCenter } from '@/design-system/global-style'
-import { SearchIcon, WarningIcon } from '@/design-system/icons'
+import { EyeIcon, WarningIcon } from '@/design-system/icons'
 import { Tooltip } from '@/design-system/tooltip'
 import {
 	RéductionDottedName,
@@ -60,7 +60,7 @@ export default function Montant({
 							language,
 						}
 					)}
-					<StyledSearchIcon />
+					<StyledEyeIcon />
 				</FlexDiv>
 			</StyledTooltip>
 		) : (
@@ -104,7 +104,8 @@ const FlexDiv = styled.div<{ $alignment: 'end' | 'center' }>`
 	${FlexCenter}
 	justify-content: ${({ $alignment }) => $alignment};
 `
-const StyledSearchIcon = styled(SearchIcon)`
+const StyledEyeIcon = styled(EyeIcon)`
+	fill: ${({ theme }) => theme.colors.extended.grey[100]};
 	margin-left: ${({ theme }) => theme.spacings.sm};
 `
 const StyledWarningIcon = styled(WarningIcon)`
diff --git a/site/source/design-system/icons/index.stories.tsx b/site/source/design-system/icons/index.stories.tsx
index 059da693a..9f8734a75 100644
--- a/site/source/design-system/icons/index.stories.tsx
+++ b/site/source/design-system/icons/index.stories.tsx
@@ -22,6 +22,7 @@ export {
 	EditIcon,
 	ErrorIcon,
 	ExternalLinkIcon,
+	EyeIcon,
 	GithubIcon,
 	HelpIcon,
 	HexagonIcon,
diff --git a/site/source/design-system/icons/index.tsx b/site/source/design-system/icons/index.tsx
index bec9731bc..142f8ac51 100644
--- a/site/source/design-system/icons/index.tsx
+++ b/site/source/design-system/icons/index.tsx
@@ -14,8 +14,8 @@ export const ChevronIcon = (props: HTMLAttributes<SVGElement>) => (
 	<SvgIcon
 		{...props}
 		viewBox="0 0 24 24"
-		width={24}
-		height={24}
+		width="24"
+		height="24"
 		xmlns="http://www.w3.org/2000/svg"
 		aria-hidden
 	>
@@ -42,8 +42,8 @@ export const InfoIcon = (props: HTMLAttributes<SVGElement>) => (
 	<SvgIcon
 		{...props}
 		viewBox="0 0 20 20"
-		width={20}
-		height={20}
+		width="20"
+		height="20"
 		xmlns="http://www.w3.org/2000/svg"
 		aria-hidden
 	>
@@ -61,8 +61,8 @@ export const SuccessIcon = (props: HTMLAttributes<SVGElement>) => (
 	<SvgIcon
 		{...props}
 		viewBox="0 0 20 20"
-		width={20}
-		height={20}
+		width="20"
+		height="20"
 		xmlns="http://www.w3.org/2000/svg"
 		aria-hidden
 	>
@@ -112,8 +112,8 @@ export function SearchIcon({ ...props }) {
 	return (
 		<SvgIcon
 			{...props}
-			width={24}
-			height={24}
+			width="24"
+			height="24"
 			xmlns="http://www.w3.org/2000/svg"
 			aria-hidden
 		>
@@ -480,3 +480,17 @@ export const ClockIcon = (props: HTMLAttributes<SVGElement>) => (
 		/>
 	</svg>
 )
+
+export const EyeIcon = (props: HTMLAttributes<SVGElement>) => (
+	<svg
+		{...props}
+		width="16"
+		height="16"
+		viewBox="0 0 576 512"
+		xmlns="http://www.w3.org/2000/svg"
+		aria-hidden
+	>
+		{/* Font Awesome Free 6.7.2 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc. */}
+		<path d="M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z" />
+	</svg>
+)