From e89b9d189687fb028e9f8e26e6f4efc8cfa01fdd Mon Sep 17 00:00:00 2001
From: mama <mael.thomas@data.gouv.fr>
Date: Tue, 13 Feb 2018 19:37:36 +0100
Subject: [PATCH] =?UTF-8?q?D=C3=A9placement=20de=20la=20saisie=20salaire?=
 =?UTF-8?q?=20entre=20les=20inversions=20possibles?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../conversation/InversionInput.css           |  1 +
 .../components/conversation/InversionInput.js | 49 ++++++++++---------
 2 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/source/components/conversation/InversionInput.css b/source/components/conversation/InversionInput.css
index e661f51f5..164e95092 100644
--- a/source/components/conversation/InversionInput.css
+++ b/source/components/conversation/InversionInput.css
@@ -6,6 +6,7 @@
 	margin-left: 1em;
 	font-size: 110%;
 	cursor: pointer;
+	clear: both;
 }
 #inversionRadios label.unselected {
 	opacity: 0.7;
diff --git a/source/components/conversation/InversionInput.js b/source/components/conversation/InversionInput.js
index ba7f3a56f..dbc9af10c 100644
--- a/source/components/conversation/InversionInput.js
+++ b/source/components/conversation/InversionInput.js
@@ -57,31 +57,34 @@ class Fields extends Component {
 			<>
 				<div id="inversionRadios">
 					{inversion.inversions.map(({ name, title, dottedName: value }) => (
-						<label
-							key={value}
-							className={classNames({
-								selected: value === activeInversion,
-								unselected: activeInversion && value !== activeInversion
-							})}
-						>
-							<Field
-								name={'inversions.' + dottedName}
-								component="input"
-								type="radio"
-								value={value}
-							/>
-							<Explicable dottedName={value}>{title || name}</Explicable>
-						</label>
+						<>
+							<label
+								key={value}
+								className={classNames({
+									selected: value === activeInversion,
+									unselected: activeInversion && value !== activeInversion
+								})}
+							>
+								<Field
+									name={'inversions.' + dottedName}
+									component="input"
+									type="radio"
+									value={value}
+								/>
+								<Explicable dottedName={value}>{title || name}</Explicable>
+							</label>
+							{activeInversion === value && (
+								<Input
+									{...{
+										...this.props,
+										suggestions:
+											dottedName === fieldName && this.props.suggestions
+									}}
+								/>
+							)}
+						</>
 					))}
 				</div>
-				{activeInversion && (
-					<Input
-						{...{
-							...this.props,
-							suggestions: dottedName === fieldName && this.props.suggestions
-						}}
-					/>
-				)}
 			</>
 		)
 	}