fix: Affiche le titre et la description du résultat lorsque le score …

…est < à 9
SocialGouv · Oct 16, 2023 · f66bfd7 · f66bfd7
1 parent 11680ef
commit f66bfd7
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 174 deletions.
diff --git a/pages/results.js b/pages/results.js
@@ -12,6 +12,7 @@ import * as StorageUtils from "../src/utils/storage.utils"
 import { DownloadApp } from "../src/components/results/DownloadApp"
 import { ResultMood } from "../src/components/results/ResultMood"
 import { BeBetter } from "../src/components/results/BeBetter"
+import { Row } from "react-bootstrap"
 
 export default function Results() {
   const scoreValue = StorageUtils.getInLocalStorage(STORAGE_SCORE)
@@ -21,7 +22,18 @@ export default function Results() {
   return (
     <ContentLayout>
       <WidgetHeader title={Labels.titleDPP} locale={localeSelected} />
-      {scoreValue < 9 && <DownloadApp />}
+      {scoreValue < 9 && (
+        <>
+          <div className="result-good-mood">
+            <img alt="" src="img/icone-resultats-bien.svg" height={50} />
+            {Labels.mood.good}
+          </div>
+          <div className="result-good-mood-description">
+            Oser en parler, c’est déjà prendre soin de soi et de son enfant !
+          </div>
+          <DownloadApp />
+        </>
+      )}
       {score >= 9 && score <= 11 && (
         <ResultMood
           scoreText="moyennement élevé"

diff --git a/src/components/ChooseEpdsLocale.js b/src/components/ChooseEpdsLocale.js
@@ -17,6 +17,7 @@ export function ChooseEpdsLocale({ show, setShow, setLocaleSelected }) {
   const [selected, setSelected] = useState()
 
   const getLocalesInDatabase = () => {
+    // eslint-disable-next-line react-hooks/rules-of-hooks
     const { loading, error, data } = useQuery(gql(GET_LOCALES), {
       client: client,
     })

diff --git a/styles/globals.scss b/styles/globals.scss
@@ -64,6 +64,10 @@ a {
   }
 }
 
+.bold {
+  font-weight: bold;
+}
+
 .footer {
   display: flex;
   flex: 1;

diff --git a/styles/results.scss b/styles/results.scss
@@ -183,6 +183,18 @@
   }
 }
 
+.result-good-mood {
+  color: var(--primaryBlue);
+  font-weight: bold;
+  margin-bottom: $xxxxs;
+  display: flex;
+  align-items: center;
+}
+.result-good-mood-description {
+  font-weight: bold;
+  margin-bottom: 2em;
+}
+
 .results-mood {
   display: flex;
   margin-bottom: $xxxxs;