diff --git a/source/components/Contact.js b/source/components/Contact.js
index b33a251cf..4585c4575 100644
--- a/source/components/Contact.js
+++ b/source/components/Contact.js
@@ -6,5 +6,5 @@ export default () =>
Pour nous écrire : contact@embauche.beta.gouv.fr
{/* TODO: credits for the image to add: https://thenounproject.com/search/?q=post+card&i=715677 */}
-
+
diff --git a/source/components/Home.css b/source/components/Home.css
deleted file mode 100644
index dcf14e52e..000000000
--- a/source/components/Home.css
+++ /dev/null
@@ -1,21 +0,0 @@
-#home {
-}
-
-#home #header h1 {
- margin-top: 3em;
- text-align: center;
- font-size: 300%
-}
-
-#home #marianne {
- position: absolute;
- left: 2em;
- top: 2em;
- width: 8em;
-}
-
-#home > #content {
- display: flex;
- align-items: center;
- justify-content: center;
-}
diff --git a/source/components/Home.js b/source/components/Home.js
deleted file mode 100644
index 7155169eb..000000000
--- a/source/components/Home.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import React, { Component } from 'react'
-import './Home.css'
-import ReactPiwik from 'Components/Tracker' //TODO réintégrer Piwik
-import TargetSelection from './TargetSelection'
-import { slide as Menu } from 'react-burger-menu'
-import './Menu.css'
-
-export default class Home extends Component {
-
- render() {
-
- return (
-
- )
- }
-
-}
diff --git a/source/components/Route404.js b/source/components/Route404.js
index f27c97107..77abb01ff 100644
--- a/source/components/Route404.js
+++ b/source/components/Route404.js
@@ -16,7 +16,7 @@ export default () => (
Revenir en lieu sûr
diff --git a/source/components/TargetSelection.css b/source/components/TargetSelection.css
index a3e3be5c6..5f14f93f0 100644
--- a/source/components/TargetSelection.css
+++ b/source/components/TargetSelection.css
@@ -23,7 +23,6 @@
#targetSelection div {
margin-left: 1em;
- line-height: 0.6em;
}
#targetSelection .optionTitle {
@@ -31,6 +30,7 @@
}
#targetSelection label p {
color: #555;
+ margin: 0;
}
#targetSelection input:checked + label .optionTitle {
font-weight: 600;
diff --git a/source/components/pages/About.js b/source/components/pages/About.js
new file mode 100644
index 000000000..0d62d5b85
--- /dev/null
+++ b/source/components/pages/About.js
@@ -0,0 +1,78 @@
+import React, { Component } from 'react'
+import './Pages.css'
+import Header from './Header'
+export default class About extends Component {
+ render() {
+ return (
+
+
+ À propos
+
+
+ L'incubateur des services numériques de l'État a lancé
+ {' '}
+ en 2014 le développement d’une ressource ouverte de calcul
+ des prélèvements sociaux sur les revenus d'activité en France.
+
+
+ Ce premier service, un{' '}
+ module simulation des sommes en jeu lors d'une embauche, peut
+ être intégré facilement et gratuitement par toute
+ organisation sur son site Web.
+
+
+ Ce travail est contributif : venez définir avec nous la feuille de
+ route du service (implémentation des conventions collectives, ajout
+ des statuts autres que le travail salarié, ...).
+
+
+
+ Ou contactez-nous directement
+
+ {/* Notre prochaine rencontre OpenLab aura lieu le mercredi 18 janvier 2017 à 10h, au 86 allée de Bercy, 75012, salle 381-R
*/}
+
+ )
+ }
+}
+
+let MailChimp = () => (
+
+)
diff --git a/source/components/pages/Contribution.js b/source/components/pages/Contribution.js
new file mode 100644
index 000000000..83b572043
--- /dev/null
+++ b/source/components/pages/Contribution.js
@@ -0,0 +1,26 @@
+import React, { Component } from 'react'
+import './Pages.css'
+import Header from './Header'
+
+// TODO reprendre les icônes de embauche.gouv.fr version novembre 2017
+// pour expliquer la contribution au projet
+
+// parler du fait qu'on ne contribue pas simplement à une calculette
+
+export default class Contribution extends Component {
+ render() {
+ return (
+
+
+ Contribuer
+
+ Tout le développement se fait de façon transparente et contributive
+ sur{' '}
+
+ GitHub
+
+
+
+ )
+ }
+}
diff --git a/source/components/pages/Header.js b/source/components/pages/Header.js
new file mode 100644
index 000000000..80e354250
--- /dev/null
+++ b/source/components/pages/Header.js
@@ -0,0 +1,37 @@
+import React, { Component } from 'react'
+import { slide as Menu } from 'react-burger-menu'
+import 'Components/pages/Menu.css'
+import { Link } from 'react-router-dom'
+
+export default class Header extends Component {
+ render() {
+ return (
+
+ )
+ }
+}
diff --git a/source/components/pages/Home.css b/source/components/pages/Home.css
new file mode 100644
index 000000000..8add3eabe
--- /dev/null
+++ b/source/components/pages/Home.css
@@ -0,0 +1,7 @@
+
+
+#home > #content {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
diff --git a/source/components/pages/Home.js b/source/components/pages/Home.js
new file mode 100644
index 000000000..7b69859cd
--- /dev/null
+++ b/source/components/pages/Home.js
@@ -0,0 +1,26 @@
+import React, { Component } from 'react'
+import './Pages.css'
+import './Home.css'
+import ReactPiwik from 'Components/Tracker' //TODO réintégrer Piwik
+import TargetSelection from '../TargetSelection'
+import Header from './Header'
+
+
+export default class Home extends Component {
+
+ render() {
+
+ return (
+
+
+
Simulateurs d'embauche
+
LE SLOGAN ICI
+
+
+
+
+
+ )
+ }
+
+}
diff --git a/source/components/pages/Integration.css b/source/components/pages/Integration.css
new file mode 100644
index 000000000..ae5655f47
--- /dev/null
+++ b/source/components/pages/Integration.css
@@ -0,0 +1,117 @@
+
+
+
+
+
+
+
+
+#integration p {
+ margin-top: 3em;
+ vertical-align: top;
+ position: relative;
+}
+#integration code {
+ position: relative;
+ display: inline-block;
+ font-size: 80%;
+ max-width: 40em;
+ padding: 1em;
+ background: #f8f8f8;
+ margin: auto;
+ margin-bottom: 1em;
+
+ box-shadow: 0 1px 1px rgba(0,0,0,0.05), -1px 1px 1px rgba(0,0,0,0.02);
+}
+
+#integration code em {
+ font-weight: 300;
+ color: black;
+}
+
+#integration code:before {
+ content: "";
+ position: absolute;
+ top: 0;
+ right: 0;
+ border-width: 0 16px 16px 0;
+ border-style: solid;
+ border-color: #e8e8e8 white;
+}
+
+#scriptColor {
+ color: #4A89DC
+}
+
+
+section#integrations a {
+ text-decoration: none;
+}
+
+
+
+#integrationList {
+ display: flex;
+ flex-wrap: wrap;
+ justify-content: space-around;
+ align-items: center;
+}
+
+#integrations article {
+ vertical-align: top;
+ width: 15em;
+ padding: 0 2%;
+ display: inline-block;
+ background-repeat: no-repeat;
+ background-size: contain;
+ text-align: center;
+ margin-bottom: 2em;
+}
+
+#integrations article img {
+ width: 8em;
+ height: 8em;
+ border-radius: 8em;
+ border: 3px solid #3C4963;
+}
+
+#integrations .question-mark {
+ display: inline-block;
+ font-size: 6.5em;
+ border: 1px solid white;
+ border-radius: 10em;
+ width: 1.2em;
+ height: 1.2em;
+ line-height: 1.2em
+}
+
+#integrations {
+ padding-bottom: 0;
+ border-bottom: none;
+}
+
+#contribution .block-wrap {
+ margin-top: 3em;
+ width: 100%;
+}
+
+
+#contribution article {
+ padding: 0 5% 2em;
+ margin-bottom: 0;
+ font-size: 90%;
+}
+
+#contribution article h2 {
+ font-weight: 600;
+ color: #3C4963;
+}
+
+#contribution article p {
+ display: inline;
+}
+
+#contribution article img {
+ width: 8em;
+ border-radius: 0;
+}
diff --git a/source/components/pages/Integration.js b/source/components/pages/Integration.js
new file mode 100644
index 000000000..3c3635f9d
--- /dev/null
+++ b/source/components/pages/Integration.js
@@ -0,0 +1,100 @@
+import React, { Component } from 'react'
+import './Integration.css'
+import './Pages.css'
+import Header from './Header'
+
+export default class MyComponent extends Component {
+ render() {
+ return (
+
+
+
+
Intégrez le module Web
+
Intégrez le module en ajoutant une ligne à votre page Web :
+
+ {'<'}
+
+ script
+ id
+ ="script-simulateur-embauche"
+ data-couleur
+ ="#4A89DC" src="https://embauche.beta.gouv.fr/modules/v2/dist/simulateur.js">
+ {'<'}
+ /
+ script
+ >
+
+
+ Vous pouvez choisir la couleur principale du module pour le
+ fondre dans le thème visuel de votre page : changez simplement la
+ valeur de data-couleur ci-dessus. Pour la choisir, utilisez
+ notre{' '}
+
+ outil interactif
+ .
+
+
+
+
Quelques intégrations
+
+
+
+
+ )
+ }
+}
diff --git a/source/components/Menu.css b/source/components/pages/Menu.css
similarity index 100%
rename from source/components/Menu.css
rename to source/components/pages/Menu.css
diff --git a/source/components/pages/Pages.css b/source/components/pages/Pages.css
new file mode 100644
index 000000000..ca1a13d2a
--- /dev/null
+++ b/source/components/pages/Pages.css
@@ -0,0 +1,24 @@
+
+.page {
+ max-width: 45em;
+ margin: 3em;
+}
+
+
+.page p {
+}
+
+.page h1 {
+ margin: 4em 0 1em;
+ color: #3C4963;
+ font-size: 280%;
+}
+
+.page em {
+ font-weight: 600;
+ font-style: normal;
+}
+
+.page a {
+ color: #3C4963
+}
diff --git a/source/components/RulesList.css b/source/components/pages/RulesList.css
similarity index 100%
rename from source/components/RulesList.css
rename to source/components/pages/RulesList.css
diff --git a/source/components/RulesList.js b/source/components/pages/RulesList.js
similarity index 76%
rename from source/components/RulesList.js
rename to source/components/pages/RulesList.js
index e25ca3157..8caf98b4a 100644
--- a/source/components/RulesList.js
+++ b/source/components/pages/RulesList.js
@@ -2,12 +2,15 @@ import React, { Component } from "react"
import { rules, encodeRuleName, nameLeaf } from "Engine/rules.js"
import { Link } from "react-router-dom"
import './RulesList.css'
-import {capitalise0} from '../utils'
+import './Pages.css'
+import {capitalise0} from '../../utils'
+import Header from './Header'
export default class RulesList extends Component {
render() {
return (
-
+
+
Notre base de règles
{rules.map(rule => (
diff --git a/source/containers/Layout.css b/source/containers/Layout.css
index 6d5830862..ab59e9b2f 100644
--- a/source/containers/Layout.css
+++ b/source/containers/Layout.css
@@ -11,6 +11,22 @@ body {
#js, #js>div {
height: 100%
}
+
+
+#header h1 {
+ margin-top: 3em;
+ text-align: center;
+ font-size: 300%
+}
+
+#header #marianne {
+ position: absolute;
+ left: 2em;
+ top: 2em;
+ width: 8em;
+}
+
+
#content {
margin-top: 1.5em;
}
diff --git a/source/containers/Layout.js b/source/containers/Layout.js
index d8a773fcd..3672bca15 100644
--- a/source/containers/Layout.js
+++ b/source/containers/Layout.js
@@ -1,45 +1,50 @@
-import React, { Component } from "react"
-import "./Layout.css"
-import "./reset.css"
-import "./ribbon.css"
+import React, { Component } from 'react'
+import './Layout.css'
+import './reset.css'
+import './ribbon.css'
-import { Link, Route, Router, Switch, Redirect } from "react-router-dom"
+import { Link, Route, Router, Switch, Redirect } from 'react-router-dom'
-import Home from "Components/Home"
-import RulePage from "Components/RulePage"
-import Route404 from "Components/Route404"
-import Contact from "Components/Contact"
-import Simulateur from "Components/Simulateur"
-import RulesList from "Components/RulesList"
-
-import ReactPiwik from "Components/Tracker"
-import createHistory from "history/createBrowserHistory"
+import Home from 'Components/pages/Home'
+import RulePage from 'Components/RulePage'
+import Route404 from 'Components/Route404'
+import Contact from 'Components/Contact'
+import Simulateur from 'Components/Simulateur'
+import RulesList from 'Components/pages/RulesList'
+import Contribution from 'Components/pages/Contribution'
+import Integration from 'Components/pages/Integration'
+import About from 'Components/pages/About'
+import ReactPiwik from 'Components/Tracker'
+import createHistory from 'history/createBrowserHistory'
const piwik = new ReactPiwik({
- url: "stats.data.gouv.fr",
- siteId: 39,
- trackErrors: true
+ url: 'stats.data.gouv.fr',
+ siteId: 39,
+ trackErrors: true
})
export default class Layout extends Component {
- history = createHistory()
- render() {
- // track the initial pageview
- ReactPiwik.push(["trackPageView"])
+ history = createHistory()
+ render() {
+ // track the initial pageview
+ ReactPiwik.push(['trackPageView'])
- return (
-
-
-
-
-
-
-
-
-
-
-
-
- )
- }
+ return (
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ )
+ }
}
diff --git a/source/images/homeEmbauche/aides-creations.png b/source/images/accueil/aides-creations.png
similarity index 100%
rename from source/images/homeEmbauche/aides-creations.png
rename to source/images/accueil/aides-creations.png
diff --git a/source/images/homeEmbauche/apec.png b/source/images/accueil/apec.png
similarity index 100%
rename from source/images/homeEmbauche/apec.png
rename to source/images/accueil/apec.png
diff --git a/source/images/homeEmbauche/api.svg b/source/images/accueil/api.svg
similarity index 100%
rename from source/images/homeEmbauche/api.svg
rename to source/images/accueil/api.svg
diff --git a/source/images/homeEmbauche/calculator.svg b/source/images/accueil/calculator.svg
similarity index 100%
rename from source/images/homeEmbauche/calculator.svg
rename to source/images/accueil/calculator.svg
diff --git a/source/images/homeEmbauche/carto.png b/source/images/accueil/carto.png
similarity index 100%
rename from source/images/homeEmbauche/carto.png
rename to source/images/accueil/carto.png
diff --git a/source/images/homeEmbauche/cci.png b/source/images/accueil/cci.png
similarity index 100%
rename from source/images/homeEmbauche/cci.png
rename to source/images/accueil/cci.png
diff --git a/source/images/homeEmbauche/checklist.svg b/source/images/accueil/checklist.svg
similarity index 100%
rename from source/images/homeEmbauche/checklist.svg
rename to source/images/accueil/checklist.svg
diff --git a/source/images/homeEmbauche/code.svg b/source/images/accueil/code.svg
similarity index 100%
rename from source/images/homeEmbauche/code.svg
rename to source/images/accueil/code.svg
diff --git a/source/images/homeEmbauche/logo-SGMAP-fond-blanc.svg b/source/images/accueil/logo-SGMAP-fond-blanc.svg
similarity index 100%
rename from source/images/homeEmbauche/logo-SGMAP-fond-blanc.svg
rename to source/images/accueil/logo-SGMAP-fond-blanc.svg
diff --git a/source/images/homeEmbauche/logo-SGMAP-fond-noir.svg b/source/images/accueil/logo-SGMAP-fond-noir.svg
similarity index 100%
rename from source/images/homeEmbauche/logo-SGMAP-fond-noir.svg
rename to source/images/accueil/logo-SGMAP-fond-noir.svg
diff --git a/source/images/homeEmbauche/logo-openfisca.svg b/source/images/accueil/logo-openfisca.svg
similarity index 100%
rename from source/images/homeEmbauche/logo-openfisca.svg
rename to source/images/accueil/logo-openfisca.svg
diff --git a/source/images/homeEmbauche/logo_startup_etat.svg b/source/images/accueil/logo_startup_etat.svg
similarity index 100%
rename from source/images/homeEmbauche/logo_startup_etat.svg
rename to source/images/accueil/logo_startup_etat.svg
diff --git a/source/images/homeEmbauche/min-tra.jpg b/source/images/accueil/min-tra.jpg
similarity index 100%
rename from source/images/homeEmbauche/min-tra.jpg
rename to source/images/accueil/min-tra.jpg
diff --git a/source/images/homeEmbauche/pole-emploi.jpg b/source/images/accueil/pole-emploi.jpg
similarity index 100%
rename from source/images/homeEmbauche/pole-emploi.jpg
rename to source/images/accueil/pole-emploi.jpg
diff --git a/source/images/homeEmbauche/pole-emploi.png b/source/images/accueil/pole-emploi.png
similarity index 100%
rename from source/images/homeEmbauche/pole-emploi.png
rename to source/images/accueil/pole-emploi.png
diff --git a/source/images/homeEmbauche/question_mark.svg b/source/images/accueil/question_mark.svg
similarity index 100%
rename from source/images/homeEmbauche/question_mark.svg
rename to source/images/accueil/question_mark.svg
diff --git a/source/images/homeEmbauche/roues.svg b/source/images/accueil/roues.svg
similarity index 100%
rename from source/images/homeEmbauche/roues.svg
rename to source/images/accueil/roues.svg
diff --git a/source/images/homeEmbauche/simulateur-2017-raw.gif b/source/images/accueil/simulateur-2017-raw.gif
similarity index 100%
rename from source/images/homeEmbauche/simulateur-2017-raw.gif
rename to source/images/accueil/simulateur-2017-raw.gif
diff --git a/source/images/homeEmbauche/simulateur-2017.gif b/source/images/accueil/simulateur-2017.gif
similarity index 100%
rename from source/images/homeEmbauche/simulateur-2017.gif
rename to source/images/accueil/simulateur-2017.gif
diff --git a/source/images/homeEmbauche/simulateur-2017.png b/source/images/accueil/simulateur-2017.png
similarity index 100%
rename from source/images/homeEmbauche/simulateur-2017.png
rename to source/images/accueil/simulateur-2017.png
diff --git a/source/images/homeEmbauche/simulateur-statique.gif b/source/images/accueil/simulateur-statique.gif
similarity index 100%
rename from source/images/homeEmbauche/simulateur-statique.gif
rename to source/images/accueil/simulateur-statique.gif
diff --git a/source/images/homeEmbauche/simulateur.gif b/source/images/accueil/simulateur.gif
similarity index 100%
rename from source/images/homeEmbauche/simulateur.gif
rename to source/images/accueil/simulateur.gif
diff --git a/source/images/homeEmbauche/simulateur.png b/source/images/accueil/simulateur.png
similarity index 100%
rename from source/images/homeEmbauche/simulateur.png
rename to source/images/accueil/simulateur.png
diff --git a/source/images/homeEmbauche/tests.svg b/source/images/accueil/tests.svg
similarity index 100%
rename from source/images/homeEmbauche/tests.svg
rename to source/images/accueil/tests.svg
diff --git a/source/images/homeEmbauche/widget.svg b/source/images/accueil/widget.svg
similarity index 100%
rename from source/images/homeEmbauche/widget.svg
rename to source/images/accueil/widget.svg
diff --git a/source/webpack.config.js b/source/webpack.config.js
index 8406c2d3f..e88cccd3a 100644
--- a/source/webpack.config.js
+++ b/source/webpack.config.js
@@ -25,7 +25,8 @@ module.exports = {
alias: {
Engine: path.resolve('source/engine/'),
Règles: path.resolve('règles/'),
- Components: path.resolve('source/components/')
+ Components: path.resolve('source/components/'),
+ Images: path.resolve('source/images/')
}
},
module: {