From 372a0c2c14e57e0880ce8208454fd0bab453c073 Mon Sep 17 00:00:00 2001
From: Johan Girod <johangirod@gmail.com>
Date: Tue, 4 Dec 2018 11:52:35 +0100
Subject: [PATCH] =?UTF-8?q?:art:=20ajoute=20une=20animation=20sur=20les=20?=
 =?UTF-8?q?pages=20r=C3=A8gles?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 source/components/rule/Rule.js  | 135 ++++++++++++++++----------------
 source/règles/base.yaml         |   4 +-
 source/règles/externalized.yaml |   8 +-
 3 files changed, 75 insertions(+), 72 deletions(-)

diff --git a/source/components/rule/Rule.js b/source/components/rule/Rule.js
index 85f9b0542..0f1b15c61 100644
--- a/source/components/rule/Rule.js
+++ b/source/components/rule/Rule.js
@@ -22,6 +22,7 @@ import {
 	noUserInputSelector,
 	ruleAnalysisSelector
 } from 'Selectors/analyseSelectors'
+import Animate from 'Ui/animate'
 import { AttachDictionary } from '../AttachDictionary'
 import Algorithm from './Algorithm'
 import Examples from './Examples'
@@ -73,73 +74,75 @@ export default compose(
 						</>
 					) : (
 						<div id="rule" className="ui__ container">
-							<Helmet>
-								<title>{title}</title>
-								<meta name="description" content={description} />
-							</Helmet>
-							<RuleHeader
-								{...{
-									ns,
-									type,
-									description,
-									question,
-									flatRule,
-									flatRules,
-									name,
-									title,
-									icon,
-									valuesToShow
-								}}
-							/>
-
-							{this.renderToggleSourceButton()}
-							<section id="rule-content">
-								{displayedRule.nodeValue ? (
-									<div id="ruleValue">
-										<i className="fa fa-calculator" aria-hidden="true" />{' '}
-										{displayedRule.format === 'euros' || displayedRule.formule
-											? Intl.NumberFormat(language, {
-													style: 'currency',
-													currency: 'EUR'
-											  }).format(displayedRule.nodeValue)
-											: typeof displayedRule.nodeValue !== 'object'
-											? displayedRule.nodeValue
-											: null}
-									</div>
-								) : null}
-
-								{displayedRule.defaultValue != null &&
-								typeof displayedRule.defaultValue !== 'object' ? (
-									<div id="ruleDefault">
-										Valeur par défaut : {displayedRule.defaultValue}
-									</div>
-								) : null}
-
-								{//flatRule.question &&
-								// Fonctionnalité intéressante, à implémenter correctement
-								false && <UserInput {...{ flatRules, dottedName }} />}
-								{flatRule.ns && (
-									<Algorithm
-										rule={displayedRule}
-										showValues={valuesToShow || currentExample}
-									/>
-								)}
-								{flatRule.note && (
-									<section id="notes">
-										<h3>Note: </h3>
-										{createMarkdownDiv(flatRule.note)}
-									</section>
-								)}
-								<Examples
-									currentExample={currentExample}
-									situationExists={valuesToShow}
-									rule={displayedRule}
+							<Animate.fromBottom key={title}>
+								<Helmet>
+									<title>{title}</title>
+									<meta name="description" content={description} />
+								</Helmet>
+								<RuleHeader
+									{...{
+										ns,
+										type,
+										description,
+										question,
+										flatRule,
+										flatRules,
+										name,
+										title,
+										icon,
+										valuesToShow
+									}}
 								/>
-								{!isEmpty(namespaceRules) && (
-									<NamespaceRulesList {...{ namespaceRules }} />
-								)}
-								{this.renderReferences(flatRule)}
-							</section>
+
+								{this.renderToggleSourceButton()}
+								<section id="rule-content">
+									{displayedRule.nodeValue ? (
+										<div id="ruleValue">
+											<i className="fa fa-calculator" aria-hidden="true" />{' '}
+											{displayedRule.format === 'euros' || displayedRule.formule
+												? Intl.NumberFormat(language, {
+														style: 'currency',
+														currency: 'EUR'
+												  }).format(displayedRule.nodeValue)
+												: typeof displayedRule.nodeValue !== 'object'
+												? displayedRule.nodeValue
+												: null}
+										</div>
+									) : null}
+
+									{displayedRule.defaultValue != null &&
+									typeof displayedRule.defaultValue !== 'object' ? (
+										<div id="ruleDefault">
+											Valeur par défaut : {displayedRule.defaultValue}
+										</div>
+									) : null}
+
+									{//flatRule.question &&
+									// Fonctionnalité intéressante, à implémenter correctement
+									false && <UserInput {...{ flatRules, dottedName }} />}
+									{flatRule.ns && (
+										<Algorithm
+											rule={displayedRule}
+											showValues={valuesToShow || currentExample}
+										/>
+									)}
+									{flatRule.note && (
+										<section id="notes">
+											<h3>Note: </h3>
+											{createMarkdownDiv(flatRule.note)}
+										</section>
+									)}
+									<Examples
+										currentExample={currentExample}
+										situationExists={valuesToShow}
+										rule={displayedRule}
+									/>
+									{!isEmpty(namespaceRules) && (
+										<NamespaceRulesList {...{ namespaceRules }} />
+									)}
+									{this.renderReferences(flatRule)}
+								</section>
+							</Animate.fromBottom>
 						</div>
 					)}
 				</>
diff --git a/source/règles/base.yaml b/source/règles/base.yaml
index 291db4cee..73f285672 100644
--- a/source/règles/base.yaml
+++ b/source/règles/base.yaml
@@ -2586,9 +2586,9 @@
     Grâce à elle, vous êtes couvert sur la plupart des soins de santé. En cas de maladie grave ou de longue durée, 100 % des soins sont remboursés.
 
     ## L'assurance maladie en France en quelques chiffres
-      - **92 %** des dépenses de santé remboursée par l'assurance maladie et la complémentaire (un des plus élevé au monde)
+      - **92 %** des dépenses de santé remboursée par l'assurance maladie et la complémentaire en moyenne
       - **30 000 € / an / patient** : dépense de santé d'une personne atteinte de [mucoviscidose](https://fr.wikipedia.org/wiki/Mucoviscidose), 
-      **entièrement pris en charge par la sécurité sociale**
+      ,entièrement prise en charge par la sécurité sociale
       - **11,7 % ** du PIB consacré aux dépenses de santé, le 5ème de l'OCDE
       - **82,4 ans** d’espérance de vie moyenne en france (dans le top 10 mondial)
 
diff --git a/source/règles/externalized.yaml b/source/règles/externalized.yaml
index f3796be6a..1e4d9a6bc 100644
--- a/source/règles/externalized.yaml
+++ b/source/règles/externalized.yaml
@@ -1340,10 +1340,10 @@ branche de la protection sociale . assurance chômage:
     Thanks to it, all those who involuntarily lose their jobs can receive income in the form of an allowance as long as they have made sufficient contributions.
 
     ## Health insurance in France in a few figures
-      - 72%** of old net salary: average percentage of unemployment benefit    
-      - 2.7 million** unemployed people compensated each month    
-      - 1,020 €****: amount of the net allowance per month  
-      - 51%** of recipients combine allowance and salary
+      - **72%** of old net salary: average percentage of unemployment benefit    
+      - **2.7 million** unemployed people compensated each month    
+      - **1,020 €****: amount of the net allowance per month  
+      - **51%** of recipients combine allowance and salary
 
 branche de la protection sociale . famille:
   titre.en: family