From 02173393adf1d0be1ed6c338fc34839619a7b9c1 Mon Sep 17 00:00:00 2001
From: Johan Girod <johan.girod@beta.gouv.fr>
Date: Thu, 21 Apr 2022 10:54:13 +0200
Subject: [PATCH] =?UTF-8?q?:art:=20Am=C3=A9liore=20le=20bouton=20'voir=20m?=
 =?UTF-8?q?a=20situation'=20:=20change=20le=20label=20et=20le=20style=20en?=
 =?UTF-8?q?suite?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 modele-social/règles/salarié.yaml             |  3 +-
 .../components/conversation/AnswerList.tsx    | 99 ++++++++++---------
 .../conversation/SeeAnswersButton.tsx         |  4 +-
 3 files changed, 58 insertions(+), 48 deletions(-)

diff --git a/modele-social/règles/salarié.yaml b/modele-social/règles/salarié.yaml
index 42e51c35a..e47d3e1e0 100644
--- a/modele-social/règles/salarié.yaml
+++ b/modele-social/règles/salarié.yaml
@@ -3738,8 +3738,7 @@ contrat salarié . lodeom . paramètre T:
         alors: 0.3254
   note: La valeur du paramètre `T` dépend du taux FNAL. Une meilleur implémentation consiste à calculer ce paramètre comme une somme de taux.
 
-contrat salarié . cotisations . assiette forfaitaire:
-  formule: non
+contrat salarié . cotisations . assiette forfaitaire: non
 
 contrat salarié . cotisations . assiette forfaitaire . montant:
   titre: assiette forfaitaire de cotisations
diff --git a/site/source/components/conversation/AnswerList.tsx b/site/source/components/conversation/AnswerList.tsx
index 158c33f98..cfa112aa4 100644
--- a/site/source/components/conversation/AnswerList.tsx
+++ b/site/source/components/conversation/AnswerList.tsx
@@ -3,11 +3,12 @@ import { resetCompany } from '@/actions/companyActions'
 import Emoji from '@/components/utils/Emoji'
 import { useEngine } from '@/components/utils/EngineContext'
 import { useNextQuestions } from '@/components/utils/useNextQuestion'
-import { PopoverWithTrigger } from '@/design-system'
+import { Message, PopoverWithTrigger } from '@/design-system'
 import { Button } from '@/design-system/buttons'
 import { Spacing } from '@/design-system/layout'
 import { H2, H3 } from '@/design-system/typography/heading'
 import { Link } from '@/design-system/typography/link'
+import { Body } from '@/design-system/typography/paragraphs'
 import {
 	answeredQuestionsSelector,
 	companySituationSelector,
@@ -71,55 +72,62 @@ export default function AnswerList({ onClose, children }: AnswerListProps) {
 
 			{!!answeredAndPassedQuestions.length && (
 				<>
-					<H3>
-						<Trans>Simulation en cours</Trans>
-					</H3>
+					<Grid container alignItems={'baseline'}>
+						<Grid item xs>
+							<H3>
+								<Trans>Simulation en cours</Trans>
+							</H3>
+						</Grid>
+						<Grid item>
+							<div
+								className="print-hidden"
+								css={`
+									text-align: right;
+								`}
+							>
+								<Button
+									size="XS"
+									light
+									onPress={() => {
+										dispatch(resetSimulation())
+									}}
+								>
+									<Emoji emoji="🗑" /> <Trans>Effacer mes réponses</Trans>
+								</Button>
+							</div>
+						</Grid>
+					</Grid>
 
 					<StepsTable {...{ rules: answeredAndPassedQuestions, onClose }} />
 					{children}
-
-					<Spacing lg />
-					<div
-						className="print-hidden"
-						css={`
-							text-align: center;
-						`}
-					>
-						<Button
-							size="XS"
-							onPress={() => {
-								dispatch(resetSimulation())
-							}}
-						>
-							<Emoji emoji="🗑" /> <Trans>Recommencer la simulation</Trans>
-						</Button>
-					</div>
 				</>
 			)}
 			{companyQuestions.length > 0 && (
 				<>
-					<Trans>
-						<H3>Mon entreprise</H3>
-					</Trans>
+					<Spacing md />
+
+					<H3>
+						<Trans>Mon entreprise</Trans>
+					</H3>
+
 					<StepsTable {...{ rules: companyQuestions, onClose }} />
-					<Spacing lg />
-					<div
-						className="print-hidden"
-						css={`
-							text-align: center;
-						`}
-					>
-						<Button
-							light
-							size="XS"
-							onClick={() => {
-								dispatch(resetSimulation())
-								dispatch(resetCompany())
-							}}
-						>
-							<Emoji emoji="🗑" /> <Trans>Supprimer toute ma situation</Trans>
-						</Button>
-					</div>
+					<Spacing md />
+					{/* <Grid container item lg={12} justifyContent="center"> */}
+					<Message type="info" border={false}>
+						<Body>
+							Les réponses liées à l'entreprise sont automatiquement
+							sauvegardées d'une simulation à l'autre.{' '}
+							<Link
+								onPress={() => {
+									dispatch(resetSimulation())
+									dispatch(resetCompany())
+								}}
+							>
+								<Trans>Supprimer les données sauvegardées.</Trans>{' '}
+							</Link>
+						</Body>
+					</Message>
+					{/* </Grid> */}
 				</>
 			)}
 
@@ -226,11 +234,14 @@ const StyledAnswer = styled(Grid)`
 	text-align: right;
 `
 const StyledAnswerList = styled(Grid)`
-	padding: ${({ theme }) => theme.spacings.xs};
-	margin: 0 -${({ theme }) => theme.spacings.xs};
+	margin: ${({ theme }) => `${theme.spacings.md} 0`};
+
 	font-family: ${({ theme }) => theme.fonts.main};
 	:nth-child(2n) {
 		background-color: ${({ theme }) => theme.colors.bases.primary[100]};
 		color-adjust: exact !important;
+		outline: solid
+			${({ theme }) =>
+				`calc(${theme.spacings.md} / 2) ${theme.colors.bases.primary[100]}`};
 	}
 `
diff --git a/site/source/components/conversation/SeeAnswersButton.tsx b/site/source/components/conversation/SeeAnswersButton.tsx
index b1c3cad6b..e78ce6de8 100644
--- a/site/source/components/conversation/SeeAnswersButton.tsx
+++ b/site/source/components/conversation/SeeAnswersButton.tsx
@@ -13,8 +13,8 @@ export default function SeeAnswersButton({
 		<>
 			<PopoverWithTrigger
 				trigger={(buttonProps) => (
-					<Button {...buttonProps} size="XS" light>
-						<Trans>Voir ma situation</Trans>
+					<Button {...buttonProps} size="XS" color="secondary" light>
+						<Trans>Voir mes réponses</Trans>
 					</Button>
 				)}
 			>