diff --git a/src/assets/css/pages/Warning.scss b/src/assets/css/pages/Warning.scss new file mode 100644 index 0000000..62e8c9e --- /dev/null +++ b/src/assets/css/pages/Warning.scss @@ -0,0 +1,14 @@ +.page-container--warning { + @apply bg-lhoist min-h-screen py-12 px-4 flex flex-col justify-center items-center; + box-sizing: border-box ; + .warning-content__title { + @apply bg-construction p-4 text-5xl; + transform: rotate(-3deg); + } + .warning-content__cover { + @apply max-w-64 max-h-64 my-12; + } + .warning-content__text { + @apply text-white text-center text-xl max-w-2xl pb-12; + } +} diff --git a/src/assets/img/illustrations/lhoist-prevention-smartphone-sticker.svg b/src/assets/img/illustrations/lhoist-prevention-smartphone-sticker.svg new file mode 100644 index 0000000..795c582 --- /dev/null +++ b/src/assets/img/illustrations/lhoist-prevention-smartphone-sticker.svg @@ -0,0 +1,589 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/data/screensTranslations_FR.json b/src/data/screensTranslations_FR.json index 05c8992..7900a1b 100644 --- a/src/data/screensTranslations_FR.json +++ b/src/data/screensTranslations_FR.json @@ -7,6 +7,10 @@ "start": "Commencer", "enter": "Entrer" }, + "warning": { + "safety_text": "Pour votre sécurité, n'utilisez pas votre téléphone ou la plateforme de jeu en marchant. Prenez une pause et jouez uniquement lorsque vous êtes bien installés et à l'arrêt.", + "warning": "Attention" + }, "home": { "app_description": "Découvrez le jeu interactif Stay Safe, où vos choix détermineront votre sécurité sur votre lieu de travail." }, @@ -41,9 +45,9 @@ "tutorial": { "how_to_play": "Comment jouer ?", "move_around": "Déplacez vous dans le jeu", - "move_around_description": "Déplacez et restez appuyer avec le curseur de votre souris ou glisser votre doigt sur l'écran de votre téléphone pour explorer la scène.", + "move_around_description": "Déplacez et restez appuyé avec le curseur de votre souris ou glissez votre doigt sur l'écran de votre smartphone pour explorer la scène.", "walkthrough": "Déroulement d'une partie", - "walkthrough_description": "Identifiez les bonnes et mauvaises pratiques en cliquant sur les objets et actions de la scène.", + "walkthrough_description": "Identifiez les bonnes et mauvaises pratiques en cliquant sur les actions de la scène.", "points_and_time": "Points et chronomètre", "points_and_time_description": "Identifiez les diverses actions en commettant le moins d'erreurs possible, sécurité oblige, et ce, le plus rapidement possible !" }, @@ -69,6 +73,7 @@ "back": "Retour", "next": "Suivant", "previous": "Précédent", + "continue": "Continuer", "submit": "Soumettre", "yes": "Oui", "no": "Non", diff --git a/src/pages/Warning.jsx b/src/pages/Warning.jsx new file mode 100644 index 0000000..a4324e4 --- /dev/null +++ b/src/pages/Warning.jsx @@ -0,0 +1,27 @@ +import { Link } from "react-router-dom"; +import React from "react"; +import AnimatedPage from "../components/AnimatedPage"; +import Loading from "../components/animations/Loading"; +import { useUser } from "../hooks/useUser"; +import warningSticker from "../assets/img/illustrations/lhoist-prevention-smartphone-sticker.svg"; + +export default function Warning() { + const { language, screensTranslations } = useUser(); + if (!screensTranslations || !screensTranslations.warning) return ; + const currentScreenTranslations = screensTranslations.warning; + const uiTranslations = screensTranslations.ui; + + return ( + +

{currentScreenTranslations.warning}

+ +

{currentScreenTranslations.safety_text}

+ + {uiTranslations.continue} + +
+ ); +}