From ccf2f37ee2a1a630c5d969c4de20e5e55cc4ae74 Mon Sep 17 00:00:00 2001
From: JosephK <josephk@framasoft.org>
Date: Thu, 24 May 2018 15:57:14 +0200
Subject: [PATCH] Text, cowntdown, links, video and devs in hof

---
 content/hall-of-fame.en.md                    | 62 ++++++++++++----
 content/hall-of-fame.fr.md                    | 59 ++++++++++++---
 content/home.en.md                            | 15 ++--
 content/home.fr.md                            | 15 ++--
 .../static/css/style.css                      | 71 ++++++++++++++-----
 .../hugo-bootstrap-premium/static/js/site.js  |  5 ++
 6 files changed, 174 insertions(+), 53 deletions(-)

diff --git a/content/hall-of-fame.en.md b/content/hall-of-fame.en.md
index da9ded5..5de8f2c 100644
--- a/content/hall-of-fame.en.md
+++ b/content/hall-of-fame.en.md
@@ -1,7 +1,7 @@
 +++
 
 date = "2018-05-24T14:41:00+01:00"
-title = "Tableau d’honneur"
+title = "Hall of fame"
 author = "Framasoft"
 draft = false
 type = "page"
@@ -17,56 +17,56 @@ type = "page"
 
 <div class="row">
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/your_logo.png" alt="">
       </div>
@@ -74,11 +74,11 @@ type = "page"
   </div>
 </div>
 
-<p class="text-center"><a class="button" href="#kisskissbankbank">Become a sponsor</a></p>
+<p class="text-center"><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Become a sponsor</a></p>
 
-<h3>Contributors</h3>
+<h3>Financial Contributors</h3>
 
-<ul class="list-inline well">
+<ul>
   <li>Nu Trepanier</li>
   <li>Zina Hargis</li>
   <li>Katy Comeaux</li>
@@ -101,6 +101,44 @@ type = "page"
   <li>Carola Mcelravy</li>
 </ul>
 
+<p><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Add your name here</a></p>
+
+<h3>Contributors</h3>
+<ul>
+  <li>Chocobozzz</li>
+  <li>gegeweb</li>
+  <li>rigelk</li>
+  <li>bnjbvr</li>
+  <li>DimitriGilbert</li>
+  <li>Green-Star</li>
+  <li>jankeromnes</li>
+  <li>Angristan</li>
+  <li>okhin</li>
+  <li>svnet-libre</li>
+  <li>dedesite</li>
+  <li>floSoX</li>
+  <li>dadall</li>
+  <li>jonathanraes</li>
+  <li>ldidry</li>
+  <li>DavidLibeau</li>
+  <li>mrflos</li>
+  <li>LecygneNoir</li>
+  <li>lucaspontoexe</li>
+  <li>flyingrub</li>
+  <li>tcitworld</li>
+  <li>valvin1</li>
+  <li>kaiyou</li>
+  <li>taziden</li>
+  <li>sticmac</li>
+  <li>luzpaz</li>
+  <li>qsypoq</li>
+  <li>noplanman</li>
+  <li>Nautigsam</li>
+  <li>ewft</li>
+</ul>
+
+<p><a class="button" href="https://github.com/Chocobozzz/PeerTube/">Contribute to the code</a></p>
+
 {{< /grid >}}
 {{% /grid %}}
 {{% /grid %}}
diff --git a/content/hall-of-fame.fr.md b/content/hall-of-fame.fr.md
index 4776a3c..569f691 100644
--- a/content/hall-of-fame.fr.md
+++ b/content/hall-of-fame.fr.md
@@ -17,67 +17,67 @@ type = "page"
 
 <div class="row">
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
   <div class="col-sm-3 col-xs-6">
-    <a href="#kisskissbankbank">
+    <a href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">
       <div class="thumbnail">
         <img src="/votre_logo.png" alt="">
       </div>
     </a>
   </div>
 </div>
-<p class="text-center"><a class="button" href="#kisskissbankbank">Devenir sponsor</a></p>
+<p class="text-center"><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Devenir sponsor</a></p>
 
 <h3>Donateurs</h3>
 
-<ul class="list-inline well">
+<ul>
   <li>Nu Trepanier</li>
   <li>Zina Hargis</li>
   <li>Katy Comeaux</li>
@@ -100,6 +100,45 @@ type = "page"
   <li>Carola Mcelravy</li>
 </ul>
 
+<p><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Ajouter votre nom ici</a></p>
+
+<h3>Contributeurs</h3>
+
+<ul>
+  <li>Chocobozzz</li>
+  <li>gegeweb</li>
+  <li>rigelk</li>
+  <li>bnjbvr</li>
+  <li>DimitriGilbert</li>
+  <li>Green-Star</li>
+  <li>jankeromnes</li>
+  <li>Angristan</li>
+  <li>okhin</li>
+  <li>svnet-libre</li>
+  <li>dedesite</li>
+  <li>floSoX</li>
+  <li>dadall</li>
+  <li>jonathanraes</li>
+  <li>ldidry</li>
+  <li>DavidLibeau</li>
+  <li>mrflos</li>
+  <li>LecygneNoir</li>
+  <li>lucaspontoexe</li>
+  <li>flyingrub</li>
+  <li>tcitworld</li>
+  <li>valvin1</li>
+  <li>kaiyou</li>
+  <li>taziden</li>
+  <li>sticmac</li>
+  <li>luzpaz</li>
+  <li>qsypoq</li>
+  <li>noplanman</li>
+  <li>Nautigsam</li>
+  <li>ewft</li>
+</ul>
+
+<p><a class="button" href="https://github.com/Chocobozzz/PeerTube/">Contribuer au code</a></p>
+
 {{< /grid >}}
 {{% /grid %}}
 {{% /grid %}}
diff --git a/content/home.en.md b/content/home.en.md
index d821283..56899b4 100644
--- a/content/home.en.md
+++ b/content/home.en.md
@@ -14,19 +14,20 @@ type = "page"
 # Take back the control of your videos
 ## A decentralized video hosting network, based on free/libre software
 
-[Get started](#getting-started) [How it works](#how-it-works)
 
-<div class="col-md-5 well col-md-push-7">
+
+<div class="col-md-6 well col-md-push-6">
   <div class="embed-responsive embed-responsive-16by9">
     <iframe class="embed-responsive-item" allowfullscreen
-      src="https://framatube.org/videos/embed/f78a97f8-a142-4ce1-a5bd-154bf9386504"></iframe>
+      src="https://framatube.org/videos/embed/217eefeb-883d-45be-b7fc-a788ad8507d3"></iframe>
   </div>
-  <p class="text-left">PeerTube est actuellement en campagne de financement participatif.
-  Ensemble, participons à aller vers une version 1.</p>
-  <p><a class="button" href="#kisskissbankbank">Soutenir Peertube</a></p>
+  <p class="text-left">Help us improve PeerTube to its v1!<br>
+  Only <b><span id="kkbbDays">45</span> days</b> left to contributing to our crowdfunding!</p>
+  <p><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Soutenir PeerTube</a></p>
 </div>
-<div class="col-md-7 col-md-pull-5">
+<div class="col-md-6 col-md-pull-6">
   <img src="/notebook.jpg" class="img-responsive" alt="" />
+  <p><a href="#getting-started">Get started</a> <a href="#how-it-works">How it works</a></p>
 </div>
 
 {{% /grid %}}
diff --git a/content/home.fr.md b/content/home.fr.md
index 6ad6583..73b495f 100644
--- a/content/home.fr.md
+++ b/content/home.fr.md
@@ -14,19 +14,18 @@ type = "page"
 # Reprenez le contrôle de vos vidéos
 ## L’hébergement de vidéos décentralisé, en réseau, basé sur du logiciel libre
 
-[Pour commencer](#getting-started) [Comment ça fonctionne](#how-it-works)
-
-<div class="col-md-5 well col-md-push-7">
+<div class="col-md-6 well col-md-push-6">
   <div class="embed-responsive embed-responsive-16by9">
     <iframe class="embed-responsive-item" allowfullscreen
-      src="https://framatube.org/videos/embed/f78a97f8-a142-4ce1-a5bd-154bf9386504"></iframe>
+      src="https://framatube.org/videos/embed/9db9f3f1-9b54-44ed-9e91-461d262d2205"></iframe>
   </div>
-  <p class="text-left">PeerTube est actuellement en campagne de financement participatif.
-  Ensemble, participons à aller vers une version 1.</p>
-  <p><a class="button" href="#kisskissbankbank">Soutenir Peertube</a></p>
+  <p class="text-left">Aidez-nous à réaliser la v1 de PeerTube !<br>
+  Plus que <b><span id="kkbbDays">45</span> jours</b> pour participer à notre financement participatif !</p>
+  <p><a class="button" href="https://www.kisskissbankbank.com/en/projects/peertube-a-free-and-federated-video-platform">Soutenir PeerTube</a></p>
 </div>
-<div class="col-md-7 col-md-pull-5">
+<div class="col-md-6 col-md-pull-6">
   <img src="/notebook.jpg" class="img-responsive" alt="" />
+  <p><a href="#getting-started">Pour commencer</a> <a href="#how-it-works">Comment ça fonctionne</a></p>
 </div>
 
 {{% /grid %}}
diff --git a/themes/hugo-bootstrap-premium/static/css/style.css b/themes/hugo-bootstrap-premium/static/css/style.css
index 50008ce..adfb28d 100644
--- a/themes/hugo-bootstrap-premium/static/css/style.css
+++ b/themes/hugo-bootstrap-premium/static/css/style.css
@@ -24,7 +24,7 @@ body > .container {
     padding: 0px;
 }
 @media screen and (max-width: 768px) {
-    a.navbar-brand-img>img {
+    a.navbar-brand-img > img {
         vertical-align: bottom;
         padding: 1em 0 0 15px;
         max-width: 80%;
@@ -90,18 +90,6 @@ body .medias .container {
     margin-top: -70px;
 }
 
-.intro .embed-responsive + p {
-  margin-bottom:0;
-  margin-top: 20px;
-}
-
-.intro .col-md-push-7 .button {
-  margin-bottom:10px;
-}
-.intro .col-md-pull-5 {
-  margin-left:-15px;
-}
-
 .medias {
     background-image: url('../player-peertube-flou.jpg');
     background-size: cover;
@@ -303,14 +291,65 @@ footer { /* Hugo’s footer != JoinPT’s footer */
     margin:0;
 }
 
-.hof .list-inline li:nth-of-type(n+2):before {
+/* Hall of Fame */
+.hof ul { // = .list-inline.well
+  margin-left: -5px;
+  list-style: none;
+  padding: 19px;
+  margin-bottom: 20px;
+  background-color: #f5f5f5;
+  border: 1px solid #e3e3e3;
+  border-radius: 4px;
+  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
+          box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05);
+}
+
+.hof ul > li {
+  display: inline-block;
+  padding-right: 5px;
+  padding-left: 5px;
+}
+
+.hof li:nth-of-type(n+2):before {
     content: "▶";
     margin-right: 12px;
     color: #F1680D;
 }
-.hof .list-inline li:nth-of-type(2n+2):before {
+.hof li:nth-of-type(2n+2):before {
     color: #211F20;
 }
-.hof .list-inline li:nth-of-type(3n+2):before {
+.hof li:nth-of-type(3n+2):before {
     color: #737373;
 }
+
+/* KKBB */
+.intro .embed-responsive + p {
+  margin-bottom:0;
+  margin-top: 20px;
+}
+
+.intro .col-md-push-6 .button {
+  margin-bottom:10px;
+}
+
+@media (min-width: 1200px) {
+  [lang="fr"] .intro .col-md-pull-6 a {
+    margin-top: 36px;
+  }
+}
+@media (max-width: 1200px) {
+  [lang="fr"] .intro .col-md-pull-6 a {
+    margin-top: -10px;
+  }
+}
+
+@media (min-width: 992px) {
+  [lang="en"] .intro .col-md-pull-6 a {
+    margin-top: 39px;
+  }
+}
+@media (min-width: 1200px) {
+  [lang="en"] .intro .col-md-pull-6 a {
+    margin-top: 11px;
+  }
+}
diff --git a/themes/hugo-bootstrap-premium/static/js/site.js b/themes/hugo-bootstrap-premium/static/js/site.js
index e9a3f67..61e3866 100644
--- a/themes/hugo-bootstrap-premium/static/js/site.js
+++ b/themes/hugo-bootstrap-premium/static/js/site.js
@@ -8,3 +8,8 @@ $(
         scrollTop : 0                       // Scroll to top of body
     }, 500);
 });
+
+const end = new Date('07/08/2018 11:59 PM');
+const now = new Date();
+const days = (end - now < 0) ? 0 : Math.floor((end - now) / 86400000); // 24*60*60*1000
+document.getElementById('kkbbDays').innerHTML = days;