Merge pull request #9 from SocialGouv/add-flyer

.dockerignore

@@ -0,0 +1,6 @@
+.git
+.github
+.k8s
+*.md
+**/node_modules
+**/.next/cache

.socialgouv/config.json

@@ -1,7 +1,7 @@
 {
   "name": "app",
   "type": "static",
-  "subdomain": "mon-psy",
+  "subdomain": "monpsy",
   "registry": "ghcr",
   "project": "mon-psy-sante",
   "ingress": {

Dockerfile

@@ -6,6 +6,6 @@ RUN yarn --production --frozen-lockfile --prefer-offline && yarn cache clean
 RUN yarn build
 RUN yarn export
 
-FROM ghcr.io/socialgouv/docker/nginx:6.52.0
+FROM ghcr.io/socialgouv/docker/nginx:6.64.2
 
 COPY --from=builder /out /usr/share/nginx/html

README.md

@@ -1,6 +1,6 @@
-# Mon Psy Santé
+# MonPsySanté
 
-https://mon-psy.sante.gouv.fr
+https://monpsy.sante.gouv.fr
 
 # Run locally
 

optional/e2e/features/home/home.feature

@@ -2,13 +2,13 @@
 
 @home
 Fonctionnalité: Page d'accueil
-  Pour pouvoir découvrir le site Mon Psy Santé
+  Pour pouvoir découvrir le site MonPsySanté
   En tant que visiteur
   Je veux pouvoir consulter la page d'accueil
 
-Scénario:
+  Scénario:
 
   # Je me rends sur la home page
-  Soit un navigateur web sur le site
-  Alors je vois "Mon Psy Santé"
+    Soit un navigateur web sur le site
+    Alors je vois "MonPsySanté"
 

src/components/Footer.tsx

@@ -33,11 +33,6 @@ const Footer = () => {
                 Voir le code source
               </a>
             </p>
-            <p className="fr-footer__content-desc fr-mt-3w">
-              En cas de questions supplémentaires relative à la plateforme,
-              n’hésitez pas à envoyer un message à l’adresse :{" "}
-              <strong>[email protected]</strong>.
-            </p>
 
             <ul className="fr-footer__content-list">
               <li className="fr-footer__content-item">
@@ -97,6 +92,18 @@ const Footer = () => {
               </a>
             </li>
           </ul>
+          <div className="fr-footer__bottom-copy">
+            <p>
+              Sauf mention contraire, tous les textes de ce site sont sous{" "}
+              <a
+                href="https://github.com/etalab/licence-ouverte/blob/master/LO.md"
+                rel="noreferrer"
+                target="_blank"
+              >
+                licence etalab-2.0
+              </a>
+            </p>
+          </div>
         </div>
       </div>
     </footer>

src/components/Nav.tsx

@@ -25,7 +25,7 @@ const Nav = () => {
                 </div>
                 <div className="fr-header__service">
                   <a href="/" title="Retour à l’accueil">
-                    <p className="fr-header__service-title">Mon Psy Santé</p>
+                    <p className="fr-header__service-title">MonPsySanté</p>
                   </a>
                   <p className="fr-header__service-tagline">
                     Un accompagnement psychologique pour tous. En parler, c’est

src/css/style.css

@@ -7,7 +7,7 @@
 }
 
 .fr-bg--light {
-  background-color: var(--background-alt-yellow-tournesol);
+  background-color: var(--background-alt-beige-gris-galet);
 }
 
 .fr-bg--light2 {
@@ -18,21 +18,77 @@
   background-color: white;
 }
 
-.fr-btn--alt {
-  background-color: #CE614A;
+.highlight {
+  color: #CE614A;
 }
 
-a.fr-btn--alt[href]:hover,
-button.fr-btn--alt:hover,
-.fr-btn--alt:hover,
-button:not([disabled]):not(:disabled):hover {
-  background-color: #d68272;
-  background-image: none;
+.no-bullet {
+  list-style-type: none;
 }
 
-a.fr-btn--alt[href]:active,
-.fr-btn--alt:active,
-button:not([disabled]):not(:disabled):active {
-  background-color: #dc9486;
-  background-image: none;
+.time-line-list {
+  display: flex;
+  flex-direction: column;
+}
+
+.time-line-list li {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+
+.time-line-list-dot {
+  margin-top: 20px;
+}
+
+@media (min-width: 1024px) {
+  .time-line-list {
+    flex-direction: row;
+  }
+
+  .time-line-list-border {
+    padding: 20px 40px;
+    width: 400px;
+    height: 120px;
+    position: relative;
+  }
+
+  .time-line-list-dot {
+    margin-bottom: 20px;
+    display: flex;
+    flex-direction: column;
+    position: relative;
+  }
+
+  .time-line-list-dot:after {
+    content: '';
+    width: 25px;
+    height: 25px;
+    background-color: #CE614A;
+    border-radius: 25px;
+    position: absolute;
+    bottom: -32px;
+    left: 35%;
+  }
+
+  .time-line-list li:not(:first-child) .time-line-list-border:before {
+    content: "";
+    display: block;
+    border-top: 5px solid #CE614A;
+    width: calc(50% - 10px + 10px);
+    position: absolute;
+    top: -3px;
+    right: calc(50% + 10px)
+  }
+
+  .time-line-list li:not(:last-child) .time-line-list-border:after {
+    content: "";
+    display: block;
+    border-top: 5px solid #CE614A;
+    width: calc(50% - 10px + 10px + 1px);
+    position: absolute;
+    top: -3px;
+    left: calc(50% - 10px)
+  }
 }

src/pages/404.tsx

@@ -1,5 +1,15 @@
+import Head from "next/head";
 import React from "react";
 
 export default function Custom404() {
-  return <h1>404 - Page Not Found</h1>;
+  return (
+    <React.Fragment>
+      <Head>
+        <title>Page non trouvée | MonPsySanté</title>
+      </Head>
+      <div className="fr-container fr-my-6w">
+        <h1>404 - Page non trouvée</h1>
+      </div>
+    </React.Fragment>
+  );
 }

src/pages/donnees-personnelles-et-gestion-des-cookies.tsx

@@ -4,117 +4,34 @@ import React from "react";
 const Page = () => (
   <React.Fragment>
     <Head>
-      <title>Données personnelles et gestion des cookies | Mon Psy Santé</title>
+      <title>Données personnelles et gestion des cookies | MonPsySanté</title>
     </Head>
     <div className="fr-container fr-my-6w">
-      <h1>Données personnelles et gestion des cookies Mon Psy Santé</h1>
+      <h1>Données personnelles et gestion des cookies MonPsySanté</h1>
       <h2>Cookies et traceurs</h2>
-      <h3>Qu’est-ce qu’un cookie ?</h3>
-
       <p>
-        Un cookie est un fichier déposé sur votre terminal lors de la visite
-        d’un site. Il a pour but de collecter des informations relatives à votre
-        navigation et de vous adresser des services adaptés à votre terminal
-        (ordinateur, mobile ou tablette).
-      </p>
-
-      <p className="fr-mb-1v">Il convient d’indiquer que :</p>
-      <ul>
-        <li>
-          Les données collectées ne sont pas recoupées avec d’autres traitements
-        </li>
-        <li>
-          Les cookies ne permettent pas de suivre la navigation de l’internaute
-          sur d’autres sites
-        </li>
-      </ul>
-
-      <h3>Quels sont les cookies et traceurs que nous utilisons ?</h3>
-
-      <div className="fr-table fr-table--bordered">
-        <table>
-          <tr>
-            <td>Cookies</td>
-            <td>Traitement réalisé</td>
-            <td>Base juridique</td>
-            <td>Garanties</td>
-          </tr>
-          <tr>
-            <td>Data.gouv</td>
-            <td>Analyse statistique des activités</td>
-            <td>Article 82 de la loi n°78-17 du 6 janvier 1978 modifiée</td>
-            <td>
-              <a
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://www.data.gouv.fr/fr/suivi"
-              >
-                https://www.data.gouv.fr/fr/suivi
-              </a>
-            </td>
-          </tr>
-        </table>
-      </div>
-
-      <p>
-        A titre d’information, nous utilisons également Matomo un outil libre
-        qui ne collecte que des informations anonymisées et paramétré pour être
-        en conformité avec les recommandations de la CNIL. Cela signifie que
-        votre adresse IP, par exemple, est anonymisée avant l’enregistrement. Il
-        est donc impossible d’associer vos visites sur ce site à votre personne.
-      </p>
-
-      <h3>Qu’est-ce qui nous autorise à les déposer ?</h3>
-
-      <p>
-        En application de l’article 5(3) de la directive 2002/58/CE modifiée
-        concernant le traitement des données à caractère personnel et la
-        protection de la vie privée dans le secteur des communications
-        électroniques, transposée à l’article 82 de la loi n°78-17 du 6 janvier
-        1978 relative à l’informatique, aux fichiers et aux libertés, les
-        traceurs ou cookies suivent deux régimes distincts.
-      </p>
-      <p>
-        Les cookies strictement nécessaires au service, ceux de publicité non
-        personnalisée ou ayant pour finalité exclusive de faciliter la
-        communication par voie électronique sont dispensés de consentement
-        préalable au titre de l’article 82 de la loi n°78-17 du 6 janvier 1978.
-      </p>
-      <p>
-        Les autres cookies n’étant pas strictement nécessaires au service ou
-        n’ayant pas pour finalité exclusive de faciliter la communication par
-        voie électronique doivent être consenti par l’utilisateur.
-      </p>
-      <p>
-        Ce consentement de la personne concernée pour une ou plusieurs finalités
-        spécifiques constitue une base légale au sens du RGPD et doit être
-        entendu au sens de l’article 6-a du Règlement (UE) 2016/679 du Parlement
-        européen et du Conseil du 27 avril 2016 relatif à la protection des
-        personnes physiques à l’égard du traitement des données à caractère
-        personnel et à la libre circulation de ces données.
-      </p>
-
-      <h3>Durée de conservation</h3>
-
-      <p>
-        Nous conservons les cookies pour une durée de 13 mois ou, le cas échéant
-        dès le retrait du consentement.
+        A titre d’information, nous utilisons Matomo un outil libre qui ne
+        collecte que des informations anonymisées et paramétré pour être en
+        conformité avec les recommandations de la CNIL. Cela signifie que votre
+        adresse IP, par exemple, est anonymisée avant l’enregistrement. Il est
+        donc impossible d’associer vos visites sur ce site à votre personne.
       </p>
 
       <h2 id="mention-donnees-perso">Mention Données personnelles</h2>
 
       <h3>Responsable de traitements</h3>
 
       <p>
-        «« PsyEnfantsAdo » est développé au sein de l’incubateur BetaGouv et
-        porté par la Direction interministérielle du numérique (DINUM).
+        « MonPsySanté » est développé au sein de l’incubateur BetaGouv et porté
+        par la Direction interministérielle du numérique (DINUM).
       </p>
 
       <h3>Finalités du traitement</h3>
 
       <p>
-        L’objectif de l’application est de constituer une première réponse
-        d’urgence à la souffrance psychique des enfants et adolescents.
+        L’objectif est d’améliorer la santé mentale de la population, enjeu
+        majeur de la santé publique en France, en permettant aux patients en
+        ayant besoin de bénéficier de séances remboursées chez le psychologue.
       </p>
 
       <h3> Données et base juridique du traitement</h3>
@@ -130,8 +47,7 @@ const Page = () => (
       <h3>Durée de conservation des données</h3>
 
       <p>
-        {" "}
-        PsyEnfantsAdo conserve et diffuse vos données à caractère personnel
+        MonPsySanté conserve et diffuse vos données à caractère personnel
         jusqu’à ce que vous vous opposiez ou, le cas échéant, aussi longtemps
         que vous êtes psychologue.
       </p>
@@ -148,13 +64,6 @@ const Page = () => (
         <li>Droit de limitation et droit d’opposition.</li>
       </ul>
 
-      <p>
-        Pour les exercer, faites-nous parvenir une demande en précisant la date
-        et l’heure précise de la requête – ces éléments sont indispensables pour
-        nous permettre de retrouver votre recherche – par voie électronique à
-        l’adresse suivante : <strong>[email protected]</strong>
-      </p>
-
       <p>
         En raison de l’obligation de sécurité et de confidentialité dans le
         traitement des données à caractère personnel qui incombe au responsable
@@ -184,7 +93,7 @@ const Page = () => (
       <p>
         Le responsable de traitement s’engage à ce que les données à caractère
         personnels soient traitées par les seules personnes autorisées,
-        notamment au sein de l’équipe PsyEnfantsAdo.
+        notamment au sein de l’équipe MonPsySanté.
       </p>
     </div>
   </React.Fragment>