Pas de barre de résultats en attendant la 1ère réponse

L'u la voit apparître, impossible de la rater
- la page d'intro devient blanche
- les réponses ne sont pas perdues en revenant à la simulation

règles/rémunération-travail/entités/ok/CDD.yaml

@@ -76,4 +76,5 @@
         - icône: fa-balance-scale
           texte: Votre contrat ne peut donc avoir ni pour objet ni pour effet de pourvoir durablement un emploi lié à l'activité normale et permanente de l'entreprise.
           titre: Votre obligation
-      motivation: Découvrez en quelques clics le montant des 4 obligations du CDD.
+      motivation: Découvrez en quelques clics le montant des 4 obligations du CDD
+        # CIF, majoration chômage, indemnité de fin de contrat, indemnité compensatrice des congés payés

source/components/Results.css

@@ -11,11 +11,16 @@
 	position: fixed;
 	bottom: 0;
 	left: 0;
-	border-top: 3px solid white;
-}
-#results.started {
-	border: none;
 	box-shadow: 1px -7px 20px 2px #ccc;
+
+	/*opacity: 0;*/
+	transform: translateY(12em);
+	transition: transform .5s;
+	transition-delay: .3s;
+	transition-timing-function: cubic-bezier(0, 1.01, 0.24, 1)
+}
+#results.show {
+	transform: translateY(0);
 }
 
 
@@ -25,7 +30,7 @@
 	float: left;
 	width: 18%;
 	margin: 0;
-	padding: 0 1em;
+	padding: 0 0 0 2em;
 }
 
 #results-actions {

source/components/Results.js

@@ -17,7 +17,8 @@ let humanFigure = decimalDigits => value => fmt(value.toFixed(decimalDigits))
 	state => ({
 		pointedOutObjectives: state.pointedOutObjectives,
 		analysedSituation: state.analysedSituation,
-		conversationStarted: !R.isEmpty(state.form)
+		conversationStarted: !R.isEmpty(state.form),
+		conversationFirstAnswer: R.path(['form', 'conversation', 'values'])(state)
 	})
 )
 export default class Results extends Component {
@@ -26,6 +27,7 @@ export default class Results extends Component {
 			analysedSituation,
 			pointedOutObjectives,
 			conversationStarted,
+			conversationFirstAnswer: showResults,
 			location
 		} = this.props,
 			explanation = getObjectives(analysedSituation)
@@ -33,8 +35,9 @@ export default class Results extends Component {
 		if (!explanation) return null
 
 		let onRulePage = R.contains('/regle/')(location.pathname)
+
 		return (
-			<section id="results" className={classNames({started: conversationStarted})}>
+			<section id="results" className={classNames({show: showResults})}>
 				{onRulePage && conversationStarted ?
 					<div id ="results-actions">
 						<Link id="toSimulation" to={"/simu/" + encodeRuleName(analysedSituation.name)}>

source/components/Simulateur.css

@@ -1,9 +1,8 @@
 #sim {
 	padding: 3em 0; /* For the warning message */
-	background-color: #333350;
 	/*background-image: radial-gradient(ellipse at center, white -160%, rgba(255,255,255,0) 100%);*/
-	background-image: radial-gradient(ellipse at center, #4A89DC -160%,#333350 70%);
-	color: white;
+	/*background-image: radial-gradient(ellipse at center, #4A89DC -160%,#333350 70%);*/
+	color: #333350;
 	transition: background-color .5s;
 	height: 100%;
 	padding-bottom: 10%;
@@ -14,13 +13,6 @@
 	color: inherit;
 }
 
-#sim.started {
-	background: none;
-	background-color: white;
-	color: #333350;
-}
-
-
 #sim > h1 {
 	color: inherit;
 	margin-top: 0;
@@ -84,7 +76,6 @@
 	color: white;
 	display: block;
 	text-align: center;
-	color: inherit;
 	background: #4A89DC;
 	padding: .6em 1.2em;
 	font-size: 140%;
@@ -93,7 +84,7 @@
 	border: none;
 	box-shadow: 0px 9px 14px 0px rgba(0, 0, 0, 0.1)
 }
-#sim .action:hover {
+#sim .action button:hover {
 	box-shadow: none;
 	opacity: .95;
 }

source/components/Simulateur.js

@@ -5,7 +5,6 @@ import {connect} from 'react-redux'
 import './conversation/conversation.css'
 import {START_CONVERSATION} from '../actions'
 import Aide from './Aide'
-import PageTypeIcon from './PageTypeIcon'
 import R from 'ramda'
 import {Redirect, Link, withRouter} from 'react-router-dom'
 import {createMarkdownDiv} from '../engine/marked'
@@ -66,7 +65,6 @@ export default class extends React.Component {
 
 		return (
 			<div id="sim" className={classNames({started})}>
-				<PageTypeIcon type="simulation" />
 				<h1>{sim('titre') || capitalise0(this.rule['titre'] || this.rule['nom'])}</h1>
 				{sim('sous-titre') &&
 					<div id="simSubtitle">{sim('sous-titre')}</div>
@@ -88,7 +86,7 @@ export default class extends React.Component {
 					!started ?
 					<div>
 						<div className="action centered">
-							<p>{sim(['introduction', 'motivation']) || 'Simulez cette règle en quelques clics'}</p>
+							{createMarkdownDiv(sim(['introduction', 'motivation'])) || <p>Simulez cette règle en quelques clics</p>}
 							<button onClick={() => this.props.history.push(`/simu/${this.encodedName}`)	}>
 								C'est parti !
 							</button>
@@ -98,7 +96,7 @@ export default class extends React.Component {
 								Pour simplifier, les résultats sont calculés par mois de contrat, et pour un temps complet.
 							</p>
 							<p>
-								N'hésitez pas à <Link to="/contact">nous écrire</Link> ! La loi française est très ciblée, et donc complexe. Nous pouvons la rendre plus transparente.
+								N'hésitez pas à nous écrire <Link to="/contact"><i className="fa fa-envelope-open-o" aria-hidden="true" style={{margin: '0 .3em'}}></i></Link> ! La loi française est très ciblée, et donc complexe. Nous pouvons la rendre plus transparente.
 							</p>
 						</div>
 					</div>

source/components/conversation/FormDecorator.js

@@ -83,7 +83,7 @@ export var FormDecorator = formType => RenderField =>
 			return (
 			<div
 				className={classNames({step: unfolded}, formType)}
-				onMouseEnter={() => pointOutObjectives(objectives)}
+				onMouseEnter={() => null} //pointOutObjectives(objectives)}
 				onMouseLeave={() => pointOutObjectives([])}>
 				{this.state.helpVisible && this.renderHelpBox(helpText)}
 				<div style={{visibility: this.state.helpVisible ? 'hidden' : 'visible'}}>
@@ -155,7 +155,7 @@ export var FormDecorator = formType => RenderField =>
 							>
 						</i>
 						{'  '}
-						Modifier
+						<span>Modifier</span>
 					</button>
 					{/* <StepAnswer	{...{value, human, valueType, ignored, themeColours}} /> */}
 				</div>)

source/components/rule/Rule.js

@@ -4,7 +4,6 @@ import {connect} from 'react-redux'
 import {formValueSelector} from 'redux-form'
 import R from 'ramda'
 import './Rule.css'
-import PageTypeIcon from '../PageTypeIcon'
 import {decodeRuleName, findRuleByName, disambiguateRuleReference} from 'Engine/rules.js'
 import mockSituation from 'Engine/mockSituation.yaml'
 import {analyseSituation} from 'Engine/traverse'
@@ -67,7 +66,6 @@ export default class Rule extends Component {
 
 		return (
 			<div id="rule">
-				<PageTypeIcon type="comprendre"/>
 				<h1>
 					<span className="rule-type">{type}</span>
 					<span className="rule-name">{capitalise0(name)}</span>

source/containers/Layout.css

@@ -73,8 +73,3 @@ h1 {
 	font-size: 100%;
 	font-weight: bold;
 }
-
-#page-type i {
-	display: block;
-	font-size: 700%;
-}

source/engine/generateQuestions.js

@@ -25,7 +25,7 @@ export let reduceSteps = (state, action) => {
 	if (action.type == START_CONVERSATION) {
 		return {
 			...returnObject,
-			foldedSteps: [],
+			foldedSteps: state.foldedSteps || [],
 			unfoldedSteps: buildNextSteps(returnObject.analysedSituation)
 		}
 	}