From deb54c86c14457503daa0a7d54ab3844ff807def Mon Sep 17 00:00:00 2001 From: mama Date: Wed, 10 Jan 2018 17:51:35 +0100 Subject: [PATCH] =?UTF-8?q?La=20couleur=20est=20d=C3=A9finie=20dynamiqueme?= =?UTF-8?q?nt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Pour que les intégrateurs puissent la choisir. --- example-integration.html | 2 +- maison2.svg | 18 +- package.json | 24 +-- source/components/Aide.css | 1 - source/components/Aide.js | 14 +- source/components/BlueButton.css | 17 ++ source/components/BlueButton.js | 11 ++ source/components/ProgressTip.css | 5 +- source/components/ProgressTip.js | 22 ++- source/components/Results.css | 8 +- source/components/Results.js | 28 ++- source/components/Satisfaction.css | 33 ++-- source/components/Satisfaction.js | 31 +++- source/components/Simulateur.css | 36 +--- source/components/TargetSelection.css | 25 +-- source/components/TargetSelection.js | 50 +++++- .../components/conversation/Conversation.js | 5 +- source/components/conversation/Explicable.css | 6 - source/components/conversation/Explicable.js | 17 +- .../components/conversation/FormDecorator.js | 2 +- source/components/conversation/Input.js | 4 +- .../components/conversation/conversation.css | 159 ++++++++---------- source/components/pages/About.js | 17 +- source/components/pages/Home.css | 1 - source/components/pages/Home.js | 11 +- source/components/pages/Integration.css | 6 +- source/components/pages/Integration.js | 2 +- source/components/pages/MailChimp.css | 9 + source/components/rule/Examples.css | 12 +- source/components/rule/Examples.js | 18 +- source/containers/Layout.css | 19 --- source/containers/Layout.js | 1 - source/containers/ribbon.css | 42 ----- source/engine/mecanismViews/Somme.css | 24 ++- source/entry-iframe.js | 2 +- source/images/contact.svg | 4 +- source/images/maison2.svg | 2 +- 37 files changed, 331 insertions(+), 357 deletions(-) create mode 100644 source/components/BlueButton.css create mode 100644 source/components/BlueButton.js delete mode 100644 source/containers/ribbon.css diff --git a/example-integration.html b/example-integration.html index 4b3bf66bc..00ad33577 100644 --- a/example-integration.html +++ b/example-integration.html @@ -24,7 +24,7 @@

Ce simulateur calcule vos cotisations sociales pour vous permettre de jongler entre les différents types de salaire en France.

- +
diff --git a/maison2.svg b/maison2.svg index c7b15e79d..62f5ab228 100644 --- a/maison2.svg +++ b/maison2.svg @@ -210,7 +210,7 @@ id="textPath36434" style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:68.75px;font-family:'Liberation Serif';-inkscape-font-specification:'Liberation Serif';fill:#e2e1e1;fill-opacity:1"> </> > > > ({ explained: state.explainedVariable }), + state => ({ + explained: state.explainedVariable, + themeColours: state.themeColours + }), dispatch => ({ stopExplaining: () => dispatch({ type: EXPLAIN_VARIABLE }) }) @@ -20,7 +22,7 @@ export default class Aide extends Component { return marked(`### ${term} \n\n${explanation}`) } render() { - let { explained, stopExplaining } = this.props + let { explained, stopExplaining, themeColours } = this.props if (!explained) return
@@ -33,7 +35,11 @@ export default class Aide extends Component { return (
- +

({ + themeColours: state.themeColours +}))(({ themeColours, children }) => ( + +)) diff --git a/source/components/ProgressTip.css b/source/components/ProgressTip.css index fbafc2c80..7b6244401 100644 --- a/source/components/ProgressTip.css +++ b/source/components/ProgressTip.css @@ -1,4 +1,3 @@ - #sim .tip { font-style: italic; margin-bottom: 1em; @@ -10,7 +9,8 @@ #sim .tip progress { margin-left: 1em; background: white; - border: 1px solid #2975D1; + border-width: 1px; + border-style: solid; } progress::-webkit-progress-bar { @@ -18,5 +18,4 @@ progress::-webkit-progress-bar { } progress::-webkit-progress-value { - background: #2975D1; } diff --git a/source/components/ProgressTip.js b/source/components/ProgressTip.js index b1154cda0..e64b8bf65 100644 --- a/source/components/ProgressTip.js +++ b/source/components/ProgressTip.js @@ -7,7 +7,8 @@ import './ProgressTip.css' @connect(state => ({ done: state.done, foldedSteps: state.foldedSteps, - nextSteps: state.nextSteps + nextSteps: state.nextSteps, + textColourOnWhite: state.themeColours.textColourOnWhite })) export default class ProgressTip extends Component { state = { @@ -20,7 +21,7 @@ export default class ProgressTip extends Component { }) } render() { - let { done, nextSteps, foldedSteps } = this.props, + let { done, nextSteps, foldedSteps, textColourOnWhite } = this.props, nbQuestions = nextSteps.length if (!done) return null return ( @@ -34,9 +35,10 @@ export default class ProgressTip extends Component { {nbQuestions === 1 ? 'Une dernière question !' : `Il reste moins de ${nbQuestions} questions`} -

)} @@ -44,3 +46,13 @@ export default class ProgressTip extends Component { ) } } + +let ProgressBar = ({ foldedSteps, nbQuestions, colour }) => ( + +) diff --git a/source/components/Results.css b/source/components/Results.css index 8aa859360..a3ff326cf 100644 --- a/source/components/Results.css +++ b/source/components/Results.css @@ -1,4 +1,3 @@ - #resultsZone { min-height: 49%; display: flex; @@ -18,16 +17,15 @@ #results { width: 100%; - padding: .4em 1.4em; + padding: 0.4em 1.4em; } #resultsContent { position: relative; margin: 0 auto; - padding: .3em 0 1em; + padding: 0.3em 0 1em; min-height: 4em; width: 100%; max-width: 45em; - background: #2975D1; color: white; box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.25); display: flex; @@ -54,10 +52,8 @@ align-items: center; flex-wrap: wrap; margin: 0 auto; - } - #results li { margin: 0 1.2em; display: inline-block; diff --git a/source/components/Results.js b/source/components/Results.js index a01010399..af6423b46 100644 --- a/source/components/Results.js +++ b/source/components/Results.js @@ -15,37 +15,32 @@ import ProgressTip from 'Components/ProgressTip' conversationStarted: !isEmpty(state.form), conversationFirstAnswer: path(['form', 'conversation', 'values'])(state), situationGate: state.situationGate, - done: state.done + done: state.done, + themeColours: state.themeColours })) export default class Results extends Component { render() { - let { - analysis, - targetName, - conversationStarted, - conversationFirstAnswer, - location, - done - } = this.props + let { analysis, conversationStarted, done, themeColours } = this.props if (!analysis) return null let { targets } = analysis - let onRulePage = contains('/regle/')(location.pathname) + let textStyle = { color: themeColours.textColour } + return (
-
- -