From 0f614d872dee975d70c59e36d319901d1607aff4 Mon Sep 17 00:00:00 2001
From: "kload@kload.fr" <kload@kload.fr>
Date: Wed, 19 Mar 2014 12:06:43 +0100
Subject: [PATCH] Update index_fr.md

---
 index_fr.md | 281 ++++++++++++++++++++++++++++++++++++++++++++--------
 1 file changed, 240 insertions(+), 41 deletions(-)

diff --git a/index_fr.md b/index_fr.md
index cdb87b7e..e0817203 100644
--- a/index_fr.md
+++ b/index_fr.md
@@ -1,65 +1,265 @@
-# YunoHost <small> est un outil qui vous permet d’installer et d’utiliser facilement votre propre serveur.</small>
+<div class="teasing-part" style="
+  display: none;
+  background: #222;
+  color: #eee; 
+  position: absolute; 
+  top: 0; 
+  left: 0; 
+  width: 100%;
+  height: 100%;
+  box-shadow: 0 5px 15px rgba(0,0,0,0.45);
+  overflow: hidden">                                                                      
 
-<br />
-
-<div style="width: 100%; height: 290px; overflow: hidden;
-border-radius: 5px; border: 1px solid rgba(0,0,0,0.15); box-shadow: 0 5px 15px rgba(0,0,0,0.15);">
-<img style="width: 100%; min-width: 580px;" src="http://pix.toile-libre.org/upload/original/1388434791.jpg" />
+<div style="
+  position: absolute;
+  top: 7%;
+  width: 100%;
+  text-align: center;
+  text-align: center">
+<img src="http://pix.toile-libre.org/upload/original/1394644667.png" width="100"/>
 </div>
 
 <br />
 
-<div class="text-center" style="width: 23%; min-width: 130px; margin: 0 auto;">
-<a class="btn btn-primary btn-lg btn-block"  style="font-size: 1.5em" href="/install_fr">Installer</a>
-<p class="text-muted text-center"><small>YunoHost v2 • beta3</small></p>
+<div style="
+  position: absolute; 
+  top: 27%; 
+  width: 100%; 
+  text-align: center; 
+  font-weight: bold; 
+  margin: 50px auto 0">
+<p style="font-size: 3em; margin-bottom: 4%">
+<span class="yolo 1" style="color: #FF3399;">Viens chez moi, je suis hébergé chez une copine</span>
+<span class="yolo 2" style="color: #6699FF;">Si à 50 ans t'es pas auto-hebergé, t'as raté ta vie</span>
+<span class="yolo 3" style="color: #66FF33;">Hébergez-vous, qu'ils disaient</span>
+<span class="yolo 4" style="color: #00FFCC;">Je bois des bières avec mon hébergeur</span>
+<span class="yolo 5" style="color: #FF5050;">sudo internet --debug</span>
+<span class="yolo 6" style="color: #FF0066;">Ils s'hébergèrent et eurent beaucoup d'enfants</span>
+<span class="yolo 7" style="color: #3366FF;">Internet, lecture et écriture</span>
+<span class="yolo 8" style="color: #FFFFFF;">madame@michu.fr</span>
+<span class="yolo 9" style="color: #CC66FF;">J'ai rien à cacher</span>
+<span class="yolo 10" style="color: #FF6600;">Mon serveur ne m'apporte pas que le café</span>
+</p>
+<button class="btn btn-primary btn-lg btn-block yolobtn"  style="
+  min-width: 200px; 
+  width: 20%; 
+  margin: 0 auto;
+  color: #222;
+  font-size: 1.6em">Pardon ?</button>
 </div>
 
+
+<br />
+
+<div class="text-center hidden-xs" style="
+  width: 100%;
+  position: absolute; 
+  top: 90%;
+  text-align: center;">
+<a style="color: #777" href="/news_fr">Dernières nouvelles</a> <span class="colored-bar">•</span> <a style="color: #777" href="https://ask.yunohost.org" target="_blank">FAQ</a> <span class="colored-bar">•</span> <a style="color: #777" href="/docs_fr">Documentation</a>
+</div>
+
+</div>
+
+<div class="boring-part" markdown="1">
+
+<h1>YunoHost <small>est un outil qui vous permet d’installer et d’utiliser facilement votre propre serveur.</small></h1>
+
+<br />
+
+<div style="
+  width: 100%; 
+  max-height: 290px; 
+  overflow: hidden; 
+  border-radius: 5px; 
+  border: 1px solid rgba(0,0,0,0.15); 
+  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
+
+<!--<img style="width: 100%; min-width: 580px;" src="http://pix.toile-libre.org/upload/original/1394651546.jpg" />-->
+<img style="width: 100%; min-width: 580px;" src="http://pix.toile-libre.org/upload/original/1394651972.jpg" />
+</div>
+
+
+<div class="text-center" style="
+  width: 23%; 
+  min-width: 150px; 
+  margin: 40px auto 0;">
+<a class="btn btn-primary btn-lg"  style="min-width: 150px; font-size: 1.5em" href="/try_fr">Essayer</a>
+<p class="text-muted text-center"><small>YunoHost v2 • beta4</small></p>
+</div>
+
+<br />
+
 <hr />
 
-<h3><blockquote>Fonctionnalités</blockquote></h3>
+<br />
+<br />
 
-YunoHost vous permet par défaut de gérer vos adresses mail et de messagerie instantanée via des interfaces simples d’utilisation et de manière sécurisée.
+<div class="row">
+<div class="col-md-7">
+<h1>Installez <small>votre serveur simplement, vous avez déjà tout ce qu'il faut à la maison</small></h1>
+<p><br /><a href="/compatible_hardware_fr">Voir les prérequis</a></p>
+</div>
+<div class="col-md-4">
+<div style="
+  width: 100%; 
+  max-height: 290px; 
+  overflow: hidden; 
+  border-radius: 5px; 
+  border: 1px solid rgba(0,0,0,0.15); 
+  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
 
-Vous pourrez également étendre les fonctionnalités via des [**apps**](/apps_fr) installables en un click.
+<img style="width: 100%; min-width: 320px; max-width: 635px" src="http://pix.toile-libre.org/upload/original/1394722560.png" />
+</div>
+</div>
+</div>
 
 
-<h3><blockquote>Logiciels</blockquote></h3>
+<div class="clearfix"></div>
+<br />
+<br />
+<hr />
+<br />
+<br />
 
-Il est basé sur [Debian GNU/Linux](http://www.debian.org/index.fr.html) (wheezy) et se compose des logiciels libres suivants :
+<div class="row">
+<div class="col-md-4">
+<div style="
+  width: 100%; 
+  max-height: 290px; 
+  overflow: hidden; 
+  border-radius: 5px; 
+  border: 1px solid rgba(0,0,0,0.15); 
+  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
 
-* [Nginx](http://nginx.org/)
-* [Postfix](http://www.postfix.org/)
-* [Metronome](http://www.lightwitch.org/metronome)
-* [OpenLDAP](http://www.openldap.org/)
-* [Dovecot](http://www.dovecot.org/)
-* [dspam](http://nuclearelephant.com/)
-* [Amavis](http://amavis.org/)
-* [Bind](https://www.isc.org/downloads/bind/)
-* [Tahoe-LAFS](https://tahoe-lafs.org/trac/tahoe-lafs)
-* [SSOwat](https://github.com/Kloadut/SSOwat)
+<img style="width: 100%; min-width: 580px; max-width: 635px" src="http://pix.toile-libre.org/upload/original/1394750292.jpg" />
+</div>
+</div>
 
-YunoHost configure tous ces logiciels automatiquement à l’installation, puis l’utilisation se fait via [l’interface admin](/admin_fr) ou via la [moulinette](/moulinette_fr) (CLI).
+<div class="col-md-7 text-right">
+<h1>Profitez <small>de vos applications Web, et fabriquez votre coin d'Internet</small></h1>
+<p><br /><a href="/apps_fr">Liste des applications disponibles</a></p>
+</div>
+</div>
 
-<h3><blockquote>Sécurité</blockquote></h3>
-
-Tous les protocoles utilisés par YunoHost sont sécurisés par défaut. Vous disposez d’un certificat auto-signé pour chaque domaine géré par votre serveur.
-
-Par ailleurs tous les logiciels composant YunoHost sont libres, connus, utilisés, et sont de fait peu vulnérables aux attaques.
-
-Un pare-feu est également déployé dès l’installation, vous protégeant contre les connexions indésirables et dangereuses.
+<div class="clearfix"></div>
 
 <br />
-<div class="text-center"><img style="width: 100px" src="http://pix.toile-libre.org/upload/original/1386012810.png" />
+<br />
+<hr />
+<br />
+<br />
+
+<div class="row">
+<div class="col-md-7">
+<h1>Gérez <small>votre serveur comme vous le voulez : via Web, mobile ou en ligne de commande</small></h1>
+<p><br /><a href="/try_fr">Essayez l'interface d'administration</a></p>
+</div>
+<div class="col-md-4">
+<div style="
+  width: 100%; 
+  max-height: 290px; 
+  overflow: hidden; 
+  border-radius: 5px; 
+  border: 1px solid rgba(0,0,0,0.15); 
+  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
+
+<img style="width: 100%; min-width: 310px; max-width: 635px" src="http://pix.toile-libre.org/upload/original/1394749958.jpg" />
+</div>
+</div>
+</div>
+
+
+<div class="clearfix"></div>
+<br />
+<br />
+<br />
+<hr />
+<br />
+<br />
+
+<div class="row">
+<div class="col-md-4">
+<div style="
+  width: 100%; 
+  max-height: 290px;
+  overflow: hidden; 
+  border-radius: 5px; 
+  border: 1px solid rgba(0,0,0,0.15);
+  box-shadow: 0 5px 15px rgba(0,0,0,0.35);">
+<a class="btn btn-lg btn-block btn-primary" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/userdoc_fr">Guide d'utilisation</a>
+<a class="btn btn-lg btn-block btn-info" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="https://ask.yunohost.org" target="_blank">Foire aux questions</a>
+<a class="btn btn-lg btn-block btn-success" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/whatsyunohost_fr">Qu'est-ce que YunoHost ?</a>
+<a class="btn btn-lg btn-block btn-warning" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/contribute_fr">Comment contribuer</a>
+<a class="btn btn-lg btn-block btn-danger" style="box-shadow: 0 5px 15px rgba(0,0,0,0.35);" href="/news_fr">Dernières nouvelles</a>
+</div>
+</div>
+
+<div class="col-md-7 text-right">
+<h1>Explorez <small>les possibilités de votre serveur, et apprenez pourquoi c'est important</small></h1>
+<p><br /><a href="/docs_fr">Lire la documentation</a></p>
+</div>
+</div>
+
+<div class="clearfix"></div>
+
+<br />
+<br />
+<hr />
+<br />
+<br />
+
+<div class="text-center">
+<h1>Hey ! Nous sommes des humains !<br /><small> Si vous avez une question, un problème, ou que vous êtes tout simplement intéressé, passez dire "Bonjour" sur notre salon de discussion en cliquant sur le bouton en bas &nbsp;<span class="glyphicon glyphicon-share-alt"></span> </small></h1>
+</div>
+
+<br />
+<br />
+<br />
+<br />
+
+<div class="text-center">
+<!--<img style="width: 100px" src="http://pix.toile-libre.org/upload/original/1386012810.png" />-->
+<h5><small>2014 • Datalove <3</small></h5>
+</div>
 
-<p markdown="1">
-[Github](https://github.com/YunoHost) **/** [FAQ](https://ask.yunohost.org) **/** [Traduction](https://translate.yunohost.org/) **/** [Ancien Wiki](http://wiki.yunohost.org)
-</p>
 </div>
 
 <script type="text/javascript">
-    jQuery.ajaxSetup({cache: true});
-    jQuery.getScript('https://doc.yunohost.org/mini/javascripts/mini.js', function() {
-        HOST_BOSH = 'https://doc.yunohost.org/http-bind/';
+    jQuery('.teasing-part').css({
+        marginTop: '0',
+        display: 'block'
+    });
+    jQuery('.boring-part').css({
+        marginTop: jQuery(window).height() + 100
+    });
+    jQuery( window ).resize(function() {
+        jQuery('.boring-part').css({
+            marginTop: jQuery('.teasing-part').height() + 100
+        });
+    });
+    jQuery('.yolo').hide();
+    randomNumber = Math.floor((Math.random()*jQuery('.yolo').length)+1);
+    color = jQuery('.yolo.' + randomNumber).css('color');
+    jQuery('.yolo.' + randomNumber).fadeIn();
+    document.title = jQuery('.yolo.' + randomNumber).text();
+    jQuery('.colored-bar').css({
+      color: color,
+      fontWeight: 'bold',
+      padding: '1%'
+    });
+    jQuery('.yolobtn').css({
+      background: color,
+      borderColor: color
+    }).on('click', function() {
+      jQuery('html, body').animate({
+        scrollTop: jQuery(window).height() + 80
+      }, 500);
+    });
+    $(".actions").css('opacity', 0);
+    jQuery.ajaxSetup({cache: false});
+    jQuery.getScript('https://'+ location.host +'/mini/javascripts/mini.js', function() {
+        HOST_BOSH = 'https://'+ location.host +'/http-bind/';
         JappixMini.launch({
             connection: {
               domain: 'anonymous.yunohost.org'
@@ -81,5 +281,4 @@ Un pare-feu est également déployé dès l’installation, vous protégeant con
             }
         });
     });
-    $("#edit").hide();
-</script>
+</script>
\ No newline at end of file