Merge pull request #334 from betagouv/irneutre

Corrige petits bugs impôt sur le revenu

source/components/TargetSelection.js

@@ -5,6 +5,7 @@ import withLanguage from 'Components/utils/withLanguage'
 import { encodeRuleName, findRuleByDottedName } from 'Engine/rules'
 import { propEq } from 'ramda'
 import React, { Component } from 'react'
+import emoji from 'react-easy-emoji'
 import { Trans, translate } from 'react-i18next'
 import { connect } from 'react-redux'
 import { withRouter } from 'react-router'
@@ -16,13 +17,12 @@ import {
 	flatRulesSelector,
 	noUserInputSelector
 } from 'Selectors/analyseSelectors'
+import { mainTargetNames } from '../config'
 import AnimatedTargetValue from './AnimatedTargetValue'
 import Controls from './Controls'
 import CurrencyInput from './CurrencyInput/CurrencyInput'
 import ProgressCircle from './ProgressCircle'
 import './TargetSelection.css'
-import emoji from 'react-easy-emoji'
-import { mainTargetNames } from '../config'
 
 let salaries = [
 	'contrat salarié . salaire . total',
@@ -167,7 +167,9 @@ let Header = ({
 				{!conversationStarted &&
 					target.dottedName.includes('net après impôt') && (
 						<div>
-							<span id="labelNew">Janvier 2019</span>
+							<span id="labelNew">
+								<Trans>Janvier 2019</Trans>
+							</span>
 						</div>
 					)}
 				<span className="optionTitle">
@@ -285,7 +287,7 @@ class AidesGlimpse extends Component {
 				<Link
 					to={'/règle/' + encodeRuleName('contrat salarié . aides employeur')}
 					style={{ color: this.props.colours.textColour }}>
-					d'aides {emoji(aides.icon)}
+					<Trans>d'aides</Trans> {emoji(aides.icon)}
 				</Link>
 			</div>
 		)

source/components/rule/Destinataire.js

@@ -1,7 +1,7 @@
 import React, { Component } from 'react'
+import { Trans, translate } from 'react-i18next'
 import possiblesDestinataires from 'Règles/ressources/destinataires/destinataires.yaml'
 import './Destinataire.css'
-import { Trans, translate } from 'react-i18next'
 
 @translate()
 export default class Rule extends Component {
@@ -12,7 +12,8 @@ export default class Rule extends Component {
 		return destinataire && destinataireData ? (
 			<div className="infobox__item" id="destinataire">
 				<h4>
-					<Trans>Destinataire</Trans>&nbsp;:
+					<Trans>Destinataire</Trans>
+					&nbsp;:
 				</h4>
 				<div>
 					<a href={destinataireData.lien} target="_blank">

source/components/rule/Header.css

@@ -20,14 +20,27 @@
 
 #ruleHeader__content {
 	display: flex;
-	align-items: center;
+	padding-top: 1rem;
 }
-#ruleHeader__content > div {
-	margin: 0 0.6em 0 0.6em;
+@media (max-width: 500px) {
+	#ruleHeader__content {
+		align-items: center;
+		flex-direction: column-reverse;
+		margin: 1rem 0;
+	}
+}
+#ruleHeader__description {
+	flex: 1;
+}
+#ruleHeader__infobox {
+	padding: 1rem;
+	padding-top: 0;
+	max-width: 12rem;
 }
-
 .infobox__item {
 	text-align: center;
+	display: flex;
+	flex-direction: column;
 }
 
 #ruleHeader h4 {

source/components/rule/Header.js

@@ -1,13 +1,13 @@
+import withColours from 'Components/utils/withColours'
 import { createMarkdownDiv } from 'Engine/marked'
 import { path } from 'ramda'
 import React from 'react'
+import emoji from 'react-easy-emoji'
 import { Trans } from 'react-i18next'
 import { capitalise0 } from '../../utils'
 import Destinataire from './Destinataire'
 import './Header.css'
 import Namespace from './Namespace'
-import withColours from 'Components/utils/withColours'
-import emoji from 'react-easy-emoji'
 
 let RuleHeader = withColours(
 	({
@@ -38,15 +38,19 @@ let RuleHeader = withColours(
 				<div id="ruleHeader__description">
 					{createMarkdownDiv(description || question)}
 				</div>
-				<div id="ruleHeader__infobox">
-					{type && (
-						<div className="infobox__item">
-							<h4>Type&nbsp;:</h4>
-							<Trans>{capitalise0(type)}</Trans>
-						</div>
-					)}
-					<Destinataire destinataire={path([type, 'destinataire'])(flatRule)} />
-				</div>
+				{(type || path([type, 'destinataire'])(flatRule)) && (
+					<div id="ruleHeader__infobox">
+						{type && (
+							<div className="infobox__item">
+								<h4>Type&nbsp;:</h4>
+								<Trans>{capitalise0(type)}</Trans>
+							</div>
+						)}
+						<Destinataire
+							destinataire={path([type, 'destinataire'])(flatRule)}
+						/>
+					</div>
+				)}
 			</div>
 		</section>
 	)

source/locales/en.yaml

@@ -159,3 +159,5 @@ feedback:
   good:
     headline: Thanks for your feedback!
     support: If you have a remark, or an idea of improvement, do not hesitate to contact us directly by mail at <1>contact@embauche.beta.gouv.fr</1>
+Janvier 2019: January 2019
+d'aides: of aid