diff --git a/public/favicon.ico b/public/favicon.ico
index a11777cc471a4344702741ab1c8a588998b1311a..72bc1c6b34f85c248d87b2bd9dba84be58c37043 100644
Binary files a/public/favicon.ico and b/public/favicon.ico differ
diff --git a/src/App.js b/src/App.js
index 29596416d2f21fbdcbbf4f1f695028f07ebebf5a..c9ab8c6d8e051d4fcb91ad7ca9b64bfefe974b9b 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,8 +1,15 @@
import 'antd/dist/antd.css';
import MainPage from "./js/pages/MainPage";
+import {useEffect} from "react";
const App = () => {
+
+ // This effect runs once, after the first render
+ useEffect(() => {
+ document.title = "Deadlock"
+ }, [])
+
return (
<MainPage />
);
diff --git "a/src/assets/props/e\314\201toile.de.mer.svg" b/src/assets/props/etoile_de_mer.svg
similarity index 100%
rename from "src/assets/props/e\314\201toile.de.mer.svg"
rename to src/assets/props/etoile_de_mer.svg
diff --git a/src/js/components/MultiColoredText/MultiColoredText.js b/src/js/components/MultiColoredText/MultiColoredText.js
index bdb2287d30f600fc60de570f2046edb735d08f93..085481fcb02a7f4555f195bfa46da5007d060c28 100644
--- a/src/js/components/MultiColoredText/MultiColoredText.js
+++ b/src/js/components/MultiColoredText/MultiColoredText.js
@@ -3,7 +3,7 @@ const MultiColoredText = (props) => {
return (
<div>
{content.map((part) => {
- return <span key={part.text} style={{color: part.color}}>{part.text}</span> // TODO not sure which unique value to choose for the key here
+ return <span key={part.text} style={{color: part.color}}>{part.text}</span>
})
}
</div>
diff --git a/src/js/components/TopLinks/TopLInks.js b/src/js/components/TopLinks/TopLInks.js
index a596e606530290145cfafaf9ea247a1b5bf9b135..062c2d3ca479e5051f05a890ad51d3946ed70fd9 100644
--- a/src/js/components/TopLinks/TopLInks.js
+++ b/src/js/components/TopLinks/TopLInks.js
@@ -20,20 +20,20 @@ const TopLinks = (props) => {
</a>
<div className={styles.Links}>
<div className={styles.Link}>
- <a href={"#VscodeSection"} style={currentSection.vscodeSection ? chosenSectionStyle : {}}>Un IDE complet</a>
+ <a href={"#VscodeSection"} style={currentSection.vscodeSection ? chosenSectionStyle : {}}>IDE complet</a>
</div>
<div className={styles.Link}>
- <a href={"#CloudSection"} style={currentSection.cloudSection ? chosenSectionStyle : {}}>L'algorithme est votre maître mot ?</a>
+ <a href={"#CloudSection"} style={currentSection.cloudSection ? chosenSectionStyle : {}}>Exercices multi-langage</a>
</div>
<div className={styles.Link}>
<a href={"#StatsSection"}
- style={currentSection.statsSection || currentSection.featuresSection ? chosenSectionStyle : {}}>Comment suivre vos étudiants ?</a>
+ style={currentSection.statsSection || currentSection.featuresSection ? chosenSectionStyle : {}}>Suivi facile</a>
</div>
<div className={styles.Link}>
- <a href={"#TowerSection"} style={currentSection.towerSection || currentSection.octopusSection ? chosenSectionStyle : {}}>Apprendre de manière ludique</a>
+ <a href={"#TowerSection"} style={currentSection.towerSection || currentSection.octopusSection ? chosenSectionStyle : {}}>Apprentissage ludique</a>
</div>
<div className={styles.Link}>
diff --git a/src/js/components/TopLinks/TopLinks.module.scss b/src/js/components/TopLinks/TopLinks.module.scss
index 79346bd8ff85117972c61b33995979e02edf126e..7eefa788ca128d310a8e08973650f09a2f107868 100644
--- a/src/js/components/TopLinks/TopLinks.module.scss
+++ b/src/js/components/TopLinks/TopLinks.module.scss
@@ -14,18 +14,23 @@
color: $primary_black;
text-decoration: none;
+ &:hover {
+ -webkit-text-stroke-width: 1px;
+ -webkit-text-stroke-color: $primary_black;
+ }
+
}
.Links {
- padding-left: 5%;
- max-width: 30vw;
+ width: 65%;
+ margin: 0 auto;
+ position: relative;
display: flex;
flex-direction: row;
-
.Link {
+ margin: 0 auto;
text-align: center;
- margin-left: 3%;
min-width: fit-content;
a {
diff --git a/src/js/sections/CloudSection/CloudSection.module.scss b/src/js/sections/CloudSection/CloudSection.module.scss
index 8cac89808174dbfe0f78c5d634aae53bd1f58566..93937e560ffdc83718e72e428d859d4d28f96825 100644
--- a/src/js/sections/CloudSection/CloudSection.module.scss
+++ b/src/js/sections/CloudSection/CloudSection.module.scss
@@ -31,7 +31,7 @@
.BottomBlock {
margin-top: 2%;
font-size: 2vw;
- max-width: 30%;
+ max-width: 40%;
line-height: 2vw;
.Caption {
diff --git a/src/js/sections/StatsSection/StatsSection.js b/src/js/sections/StatsSection/StatsSection.js
index e91123563eb3a928065487a4c45606eee95ff307..cd624ae37d5b594d9711e18f7ffb3c609bdc0c51 100644
--- a/src/js/sections/StatsSection/StatsSection.js
+++ b/src/js/sections/StatsSection/StatsSection.js
@@ -19,7 +19,7 @@ const StatsSection = ({innerRef}) => {
<MultiColoredText content={title}/>
</div>
<p className={styles.Caption}>
- Vous pouvez relire le code de vos étudiants, les évaluer, leur faire des retours
+ Vous pouvez relire le code de vos étudiants, les évaluer, leur faire des retours.
</p>
</div>
<div className={styles.RightSide}>
diff --git a/src/js/sections/StatsSection/StatsSection.module.scss b/src/js/sections/StatsSection/StatsSection.module.scss
index 84e657f42f4438bb7a1875751c028c70dad7e1ba..ce14e8a2f23212ccadead3d3c6a0c16791b48fcf 100644
--- a/src/js/sections/StatsSection/StatsSection.module.scss
+++ b/src/js/sections/StatsSection/StatsSection.module.scss
@@ -48,6 +48,9 @@
.NotesImage {
max-width: 60vw;
max-height: 60vh;
+ -webkit-box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
+ -moz-box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
+ box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
}
}
diff --git a/src/js/sections/TowerSection/TowerSection.js b/src/js/sections/TowerSection/TowerSection.js
index d2900be0d8bec89d37e1cb9d589e30177ac44c0a..c14b83f4024af0f9df7088dbf297c7a3638b3d4f 100644
--- a/src/js/sections/TowerSection/TowerSection.js
+++ b/src/js/sections/TowerSection/TowerSection.js
@@ -7,9 +7,9 @@ import {primaryBlack, white} from "../../../style/colors.module.scss";
const title = [
- {text: "Nous pensons que ", color: white},
+ {text: "Nous pensons qu'", color: white},
{text: "apprendre de manière ludique ", color: primaryBlack},
- {text: "favorise l'investissement des étudiants.", color: white}
+ {text: "favorise l'investissement des étudiants", color: white}
];
@@ -26,7 +26,7 @@ const TowerSection = ({innerRef}) => {
<MultiColoredText content={title}/>
</div>
<div className={styles.Caption}>
- C'est pourquoi nous avons ajouté plusieurs éléments de jeux au sein de notre palteforme.
+ C'est pourquoi nous avons ajouté plusieurs éléments ludiques au sein de notre palteforme.
</div>
</div>
</div>
diff --git a/src/js/sections/VscodeSection/VscodeSection.js b/src/js/sections/VscodeSection/VscodeSection.js
index f9273e249dd0b6011b5239f4de1ceade43a1b934..c75bb661c5df48362827825f3c0645a12caa7928 100644
--- a/src/js/sections/VscodeSection/VscodeSection.js
+++ b/src/js/sections/VscodeSection/VscodeSection.js
@@ -24,7 +24,7 @@ const VscodeSection = ({innerRef}) => {
<MultiColoredText content={vscodeTitle}/>
</div>
<div className={styles.Caption}>
- Plus besoin de se soucier de l'environnement, de la machine, un navigateur connecté suffit.
+ Plus besoin de se soucier de l'environnement, de la machine, un navigateur connecté à internet suffit.
</div>
</div>
</div>
diff --git a/src/js/sections/VscodeSection/VscodeSection.module.scss b/src/js/sections/VscodeSection/VscodeSection.module.scss
index 4049578071ad5d25ca2612e79a405e25bdc169bf..3b2a13a01a9ebd34dd2b4fea7fad9cf98f60c160 100644
--- a/src/js/sections/VscodeSection/VscodeSection.module.scss
+++ b/src/js/sections/VscodeSection/VscodeSection.module.scss
@@ -4,6 +4,10 @@
.VscodeSection {
background-color: $primary_lightblue;
+ background-image: url('#{$assetPath}/props/etoile_de_mer.svg');
+ background-repeat: no-repeat;
+ background-position: 70% 1%;
+ background-size: 10% 10%;
display: flex;
flex-direction: row;
align-items: center;
@@ -18,6 +22,9 @@
.VscodeImage {
width: 50vw;
height: 55vh;
+ -webkit-box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
+ -moz-box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
+ box-shadow: -1px 1px 5px 9px $primary_very_lightblue;
}
}
@@ -38,7 +45,7 @@
}
.Caption {
font-size: 1.3vw;
- line-height: 1.3vw;
+ line-height: 1.5vw;
margin-top: 5%;
color: white;
}
@@ -52,6 +59,8 @@
flex-direction: column;
text-align: center;
min-height: 50vh;
+ background-position: 95% 0;
+
.LeftSide {
.VscodeImage {