diff --git a/src/js/components/Button/Button.js b/src/js/components/Button/Button.js
index b460a6d84468b3592a84c6fd393650e1e3c391e4..7caba6bf44de4e8c39a5577fa2a167f9fcceeaed 100644
--- a/src/js/components/Button/Button.js
+++ b/src/js/components/Button/Button.js
@@ -5,7 +5,8 @@ const Button = (props) => {
return (
<AntButton
className={styles.TakiButton}
- type={"primary"}
+ type={props.type ? props.type : "primary"}
+ href={props.link}
shape={"round"}
icon={props.icon}
disabled={props.disabled}
diff --git a/src/js/components/Button/Button.module.scss b/src/js/components/Button/Button.module.scss
index 39ea3ccbebec1501be8f66d7e6931bf0933f4800..46887c0a7a127ea69e3947bad50476046df5eb10 100644
--- a/src/js/components/Button/Button.module.scss
+++ b/src/js/components/Button/Button.module.scss
@@ -3,6 +3,7 @@
.TakiButton {
font-family: $primary_font;
+ font-weight: $primary_font_weight;
background: $primary_pink;
color: white;
border-color: $primary_pink;
@@ -10,11 +11,13 @@
&:hover {
border-color: white;
background-color: $primary_pink;
+ color: white;
}
&:focus {
background: $primary_pink;
border-color: $primary_pink;
+ color: white;
}
}
diff --git a/src/js/pages/MainPage,module.scss b/src/js/pages/MainPage,module.scss
index c2d24474cfcc06c1f6fa00ae19a2e1a51bce1f29..44313d3d8c58781b0e1484a241b90b81ddd81b98 100644
--- a/src/js/pages/MainPage,module.scss
+++ b/src/js/pages/MainPage,module.scss
@@ -33,7 +33,7 @@ html {
min-width: fit-content;
a {
- padding-right: 5%;
+ margin-left: 5%;
font-size: 1vw;
color: $primary_black;
text-decoration: none;
diff --git a/src/js/pages/MainPage.js b/src/js/pages/MainPage.js
index 3f1fc91d5ef06c745f3bb2db8e25c954d86ff9ee..414f259ef244fa8bd61dfd41d30e6eccdebdf99c 100644
--- a/src/js/pages/MainPage.js
+++ b/src/js/pages/MainPage.js
@@ -12,8 +12,12 @@ import React from "react";
import {useElementOnScreen} from "../utils/utils";
import TopBar from "../components/TopBar/TopBar";
import {Content} from "antd/lib/layout/layout";
-const { Footer} = Layout;
+const {Footer} = Layout;
+
+
+const takimaLink = "https://www.takima.fr/";
+const demoMailLink = "mailto:deadlock@takima.fr?subject=Deadlock%20demande%20de%20d%C3%A9mo&body=Bonjour%2C%0D%0AJe%20souhaiterais%20acc%C3%A9der%20%C3%A0%20une%20d%C3%A9monstration%20de%20Deadlock%2C%0D%0Avous%20pouvez%20me%20contacter%20au%20%3Cnum%C3%A9ro_telephone%3E%20ou%20via%20mail%20%C3%A0%20l'adresse%20suivante%20%3A%20%3Cemail%3E%0D%0A%0D%0ABien%20cordialement%2C";
const MainPage = () => {
@@ -84,10 +88,9 @@ const MainPage = () => {
});
-
return (
<Layout>
- <TopBar sectionStatus={sections} />
+ <TopBar sectionStatus={sections}/>
<Content className="site-layout">
<LandingSection innerRef={landingSectionRef}/>
<VscodeSection innerRef={vscodeSectionRef}/>
@@ -99,14 +102,13 @@ const MainPage = () => {
<BottomSection innerRef={bottomSectionRef} contactRef={contactSectionRef}/>
</Content>
<Footer className="footer">
- <a href={""}>Contact</a>
- <a href={""}>Démo</a>
- <a href={""}>Fait avec amour par Takima {"<3"}</a>
+ <a href={demoMailLink}>Contact</a>
+ <a href={demoMailLink}>Démo</a>
+ <a href={takimaLink}>Fait avec amour par Takima {"<3"}</a>
</Footer>
</Layout>
);
}
-
export default MainPage;
\ No newline at end of file
diff --git a/src/js/sections/BottomSection/BottomSection.js b/src/js/sections/BottomSection/BottomSection.js
index 6ebdf4edea5a874604f4b1a567a025cd0b95b77a..6472b9395cbc0299c902ad2ce62756217db939a8 100644
--- a/src/js/sections/BottomSection/BottomSection.js
+++ b/src/js/sections/BottomSection/BottomSection.js
@@ -4,6 +4,8 @@ import Button from "../../components/Button/Button";
import logoInsa from "../../../assets/props/insa_logo.png";
import logoEpf from "../../../assets/props/epf_logo.png"
+const articleLink = "https://blog.takima.io/deadlock-comment-garder-la-proximite-des-tps-sur-site-lorsque-vos-etudiants-sont-confines/";
+const askForDemoLink = "const demoMailLink = \"mailto:deadlock@takima.fr?subject=Deadlock%20demande%20de%20d%C3%A9mo&body=Bonjour%2C%0D%0AJe%20souhaiterais%20acc%C3%A9der%20%C3%A0%20une%20d%C3%A9monstration%20de%20Deadlock%2C%0D%0Avous%20pouvez%20me%20contacter%20au%20%3Cnum%C3%A9ro_telephone%3E%20ou%20via%20mail%20%C3%A0%20l'adresse%20suivante%20%3A%20%3Cemail%3E%0D%0A%0D%0ABien%20cordialement%2C\";\n";
const BottomSection = ({innerRef, contactRef}) => {
@@ -23,7 +25,7 @@ const BottomSection = ({innerRef, contactRef}) => {
</p>
</div>
<div className={styles.ButtonContainer}>
- <Button>Acceder à l'article</Button>
+ <Button type="link" link={articleLink}>Acceder à l'article</Button>
</div>
</div>
@@ -39,7 +41,7 @@ const BottomSection = ({innerRef, contactRef}) => {
<p className={styles.BigCaption}>
Offrez à vos étudiants les meilleurs outils pour apprendre.
</p>
- <Button>Contactez-nous</Button>
+ <Button type={"link"} link={askForDemoLink}>Contactez-nous</Button>
<p className={styles.SmallCaption}>
Pour être les prochains !
</p>
diff --git a/src/js/sections/BottomSection/BottomSection.module.scss b/src/js/sections/BottomSection/BottomSection.module.scss
index 3665851c4192b4a7f678b83eb5786bdd61c31818..dda3f36ede5320efbe1ce8aeba55683b141a73a9 100644
--- a/src/js/sections/BottomSection/BottomSection.module.scss
+++ b/src/js/sections/BottomSection/BottomSection.module.scss
@@ -57,9 +57,9 @@
flex-basis: 20%;
position: center;
padding-right: 10%;
+ margin-top: 5%;
Button {
- margin-top: 20%;
font-family: $primary_font;
font-weight: $primary_font_weight;
font-size: 0.9vw;
@@ -131,6 +131,7 @@
.SmallCaption {
color: white;
font-size: 1vw;
+ margin-top: 5%;
}
}
}
@@ -241,5 +242,14 @@
@media (max-width: 375px) {
.BottomSection {
min-height: 65vh;
+
+ .BottomBlock {
+ .ContactLinks {
+ max-width: 50%;
+ Button {
+ }
+ }
+ }
+
}
}