From 19f0b42548939274ecafcd0e0708777e115ee5c7 Mon Sep 17 00:00:00 2001
From: Hugo Averty <h.averty@thecodingmachine.com>
Date: Tue, 2 Jun 2020 08:26:16 +0200
Subject: [PATCH] Adding social links and floppy

---
 landing_page/dist/index.html                 |  32 +++++++++++++++++--
 landing_page/dist/static/images/facebook.png | Bin 0 -> 639 bytes
 landing_page/dist/static/images/floppy.png   | Bin 0 -> 1767 bytes
 landing_page/dist/static/images/linkedin.png | Bin 0 -> 622 bytes
 landing_page/dist/static/images/twitter.png  | Bin 0 -> 615 bytes
 landing_page/src/sass/styles.scss            |  30 +++++++++++++++--
 6 files changed, 57 insertions(+), 5 deletions(-)
 create mode 100644 landing_page/dist/static/images/facebook.png
 create mode 100644 landing_page/dist/static/images/floppy.png
 create mode 100644 landing_page/dist/static/images/linkedin.png
 create mode 100644 landing_page/dist/static/images/twitter.png

diff --git a/landing_page/dist/index.html b/landing_page/dist/index.html
index 0fcd8260..2b0eb427 100644
--- a/landing_page/dist/index.html
+++ b/landing_page/dist/index.html
@@ -19,8 +19,26 @@
     <header>
         <div class="container-lg section">
             <div class="over-image">
-                <div class="logo">
-                    <img src="static/images/logo.png">
+                <div class="row">
+                    <div class="col-6 col-md-6 my-3 my-md-0">
+                        <div class="logo">
+                            <img src="static/images/logo.png">
+                        </div>
+                    </div>
+                    <div class="col-6 col-md-6 my-3 my-md-0">
+                        <div class="social-links">
+                            Share your experience
+                            <a href="" target="_BLANK">
+                                <img class="social-image" src="static/images/facebook.png" />
+                            </a>
+                            <a href="" target="_BLANK">
+                                <img class="social-image" src="static/images/linkedin.png" />
+                            </a>
+                            <a href="" target="_BLANK">
+                                <img class="social-image" src="static/images/twitter.png" />
+                            </a>
+                        </div>
+                    </div>
                 </div>
                 <div class="title text-center">
                     <h1>Your workplace<br/>but better</h1>
@@ -125,7 +143,15 @@
     </div>
     <div class="bg-white footer">
         <div class="container-fluid container-lg">
-            <a href="https://www.thecodingmachine.com/" target="_blank"><img src="static/images/Logo TCM.png"></a>
+            <div class="row">
+                <div class="col-6 col-md-6 my-3 my-md-0">
+                    <a href="https://www.thecodingmachine.com/" target="_blank"><img src="static/images/Logo TCM.png"></a>
+                </div>
+                <div class="col-6 col-md-6 my-3 my-md-0 floppy">
+                    <img src="static/images/floppy.png" />
+                    <div>Soon available on floppy !<br/><span>otherwise it's on <a href="https://github.com/thecodingmachine/workadventure" target="_BLANK">GitHub</a></span></div>
+                </div>
+            </div>
         </div>
     </div>
 </body>
diff --git a/landing_page/dist/static/images/facebook.png b/landing_page/dist/static/images/facebook.png
new file mode 100644
index 0000000000000000000000000000000000000000..f94aab704575b3e249b08228a59018c149255b64
GIT binary patch
literal 639
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE#=yYHQtOoj<glbW`Z_W&Z0zU$lgJ9>Tck#K
zruq6ZXaU(A42<oW3@ktvBM?ggF#`kB0w%bK!UARl8zkB9=Wr6J_>-rLV@L$&)i7(n
zBL)J!i?@h~bj%AW;LJM0yPzprAyBEXdufxjLKc^X#epDQ+gnXd%q_Lo_GQ?dv^W<P
z*s?U^&Bxj6(`9xi8J~L}CmmqF!D3g0iHxeb2eVu4&j1U}|25UGR-J!(YH@gfxa-~+
zlSYm*E1vbuNn2Dh-I;cMEG%KTqp+eSJH@L@qON`)_kPXfi3%LnPh5?j{`s-wUE9<r
zDsPHe0xuK?H83$ORpDg_@qJ~g5SIPJV521WRUx+juV3Ecl~Zdl(pd8{DPN9pf;0DN
z+cVl{JJx1KCN=4t;ytsqbd9P0Du?JJQJ+usZ!gcasN}tw^|$EpHR*}Xo2xfxtqi=z
z^5j7N?4z$Zxw22WedbcrSIM25EfN$Y`(p8AbwOLVh)ajI_*t!JaOhTRbx3?^Re8Dc
zg1B|%rO7$`n?z@LE}2~-?Wx?)$#V9a!tS}=TbAYozl_V_lRWWD=EuErd-*eR-|ThR
z8FH$+<;ORtTVMSaF4`z!Z+c>j{@fehscSxo*t|31+1wXA#iM6U`N`*d*0XPz{`SCx
zM5~00Z``(sEdR9GI6-n#(7KQRjhQu{uQLpDOFMty4d0uP7NfaVS9Od!71#Hlo6l(1
z|NR^PZ<#qg?z{h0zFnJBzdYFbP`&;9=efKS0#*K855DB&EOq<V&AdO1Z&c2oJ#Ao^
P4oU@{u6{1-oD!M<fj$CC

literal 0
HcmV?d00001

diff --git a/landing_page/dist/static/images/floppy.png b/landing_page/dist/static/images/floppy.png
new file mode 100644
index 0000000000000000000000000000000000000000..ae99f5a7a4ed33d3627a958016613cd56bff31db
GIT binary patch
literal 1767
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
JPDHLkV1gt<Bpd($

literal 0
HcmV?d00001

diff --git a/landing_page/dist/static/images/linkedin.png b/landing_page/dist/static/images/linkedin.png
new file mode 100644
index 0000000000000000000000000000000000000000..596cdb9ddb1e7fb6b17ae80e7d695935f4d53eb5
GIT binary patch
literal 622
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE#=yYHQtOoj<glbW`Z_W&Z0zU$lgJ9>Tck#K
zruq6ZXaU(A42<oW3@ktvBM?ggF#`kB0w%bK!UARl8zkB9=Wr6J_@SqZV@L$&+i>e3
z7Da(p-S-IzSxFn}@*b$_^qQJnym2E!*tu9&{~_;{TL+F@IS}0QcSdH0RN{=eH*c-d
zU0F1{?Rr1Ei9uBJrymzByzPxG&i>qI*nR%nc~g^xXCzKtJ5^C!n6P$d)u$E*RYgzd
z(~XM8N8L@zm-8{5E;XrWP}y+(yj)6bd(g9k_qi`K9f|tk7xHgbILnOpth_-pSX`AP
zkBA-MP*C1!Czo*cq;GQBvojL6e;ePjn{vnL=!YxHOw*k+{ZqMf9p0<_Ua`%j;d+Ex
z%drLh-cy-aPAKrTtyP-9xGV0STJN=e{^=zN``f2XkDktyE2m&ku2!_9B<#Xg#!iu3
z<w+gFn&zc<<x-RMB1<NG+03;>YMuPMywefk{T!3xvL*yq?Y8k#*vqoCm|<I7Q;Nsc
z4U8<pvd=GFT`P8WcZs-!)uo3P{rmW5RK3`Hpm6K9-R=@{X&c@=KH}r7Yn#Qv8E@69
zKXu`q(28F>96IxaWi`$l{+hNk*JSxO_xUcq7FYDw9neZ!!z#x5WZQyme_uSjx~Kl{
z3q$4o8VXKgGP)fLYyM9UD-vR?YM7%SruO#M<PY%&Zsi~PX6qXE<lp3plE$gB=QXE(
ykoZ`<D@*b2fr`_~jDGxoHwb)NzU}S-pWobWo||HqeqVY46zQI>elF{r5}E*qQu*Tm

literal 0
HcmV?d00001

diff --git a/landing_page/dist/static/images/twitter.png b/landing_page/dist/static/images/twitter.png
new file mode 100644
index 0000000000000000000000000000000000000000..57f3a9d95680f67e2f6a7cbccf7814377cd83532
GIT binary patch
literal 615
zcmeAS@N?(olHy`uVBq!ia0vp^3LwnE#=yYHQtOoj<glbW`Z_W&Z0zU$lgJ9>Tck#K
zruq6ZXaU(A42<oW3@ktvBM?ggF#`kB0w%bK!UARl8zkB9=Wr6J_?D-OV@L$&)o|;e
zBL+NM%QZBA$TTcmp1$Kyk!atBr*e&}H-sm=cqz$uVEKX+wI7z1T}dgAC!~~Jb5%M0
zD{`9Z@!ba7&cEkXXgi+r`PJ>nAM03N3n-erp6t=3^yF5|+{*WIc2aA8-A!N8&9Sq^
z;KIVQlO})Y;80lFaQRq+qdvp&jO`*e*~?FUf4VXC!o~|aoAiCJ{P?!$WwNNO&Hty9
zqyuKXP7X|XcgVih^7}Vk9|x5p=2f#gI9F_8dV2Toy29z^UTzDwFMs&Mpr|oukD8Ro
znl%cCrp82UQ9AK&r>AbhLm`&zz~ggY_t-yoWxcjDV8VtK3yw8^GQ8-+XEgV*)w$|3
zJED(^Opr>DP4|?4$8~MG=aNaOd#CxToOC%m_n><EqZHPsF0Z@{_HH*Sj^w}8?d)$d
z=gq+s*3&E-)86+S_PM?@WLKtE>q4;|1xue=9sf1oXzH^}TZQ*Gb~)^fI$`DXua5nH
zuHO|Cv9@Jwf|W0)#Azj$UjOj8urcsV@>&n`x(jO$E%=%J@ud02YXN=v@A*RH9d|LW
ze!1Mn^mxe*!4)@Sr3AD0edl;{xACy2)0Y#5wU?~&yRUr<Ui0K%iq1;QjEv=pU(R-%
vf4x-pCC}pN{IVVYTKHuj*5uugTy{%dF>FJnTTb6vP;7g;`njxgN@xNAz;g+z

literal 0
HcmV?d00001

diff --git a/landing_page/src/sass/styles.scss b/landing_page/src/sass/styles.scss
index fb8d7dc5..d38c8677 100644
--- a/landing_page/src/sass/styles.scss
+++ b/landing_page/src/sass/styles.scss
@@ -40,7 +40,13 @@ header {
         .logo{
             margin: 1rem 0;
         }
-
+        .social-links {
+            text-align: right;
+            padding-top: 36px;
+            a {
+                margin-left: 20px;
+            }
+        }
         .title {
             padding: 5rem 0;
             color: black;
@@ -65,7 +71,7 @@ header {
             height: 162px;
             width: 4000px;
             -webkit-animation-name: prop-600;
-            -webkit-animation-duration: 60s;
+            -webkit-animation-duration: 50s;
             -webkit-animation-iteration-count: infinite;
             -webkit-animation-direction:alternate;
         }
@@ -175,10 +181,17 @@ img{
             transition: all .25s cubic-bezier(0.000, -0.600, 1.000, 1.650); /* custom */
             &:hover {
                 transform: scale(1.1);
+                .step-image {
+                    &:after {
+                        bottom: -10px;
+                        left: 10px;
+                    }
+                }
             }
             .step-image {
                 position: relative;
                 &:after {
+                    transition: all .25s cubic-bezier(0.000, -0.600, 1.000, 1.650); /* custom */
                     content:"";
                     height: 100%;
                     width: 100%;
@@ -237,5 +250,18 @@ img{
 }
 .footer {
     padding: 2rem;
+    .floppy {
+        img {
+            float: right;
+            margin-left: 20px;
+        }
+        div {
+            float: right;
+            margin-left: 15px;
+            span {
+                color: grey;
+            }
+        }
+    }
 }