Added main page buttons

assets/css/sidenav.css

@@ -30,7 +30,7 @@
     display: inline-flex;
     transition: 0.3s;
     height: 40px;
-    width: 100%;
+    width: 270px;
 }
 
 .sidenav a .sidenav-content {

assets/css/style.css

@@ -393,6 +393,50 @@ Full-Width Styles
     width: 100px;
 }
 
+#main_pages{
+    width: 100%;
+    display: inline-grid;
+    padding: 0;
+    vertical-align: middle;
+}
+
+.main-link{
+    display: inline-flex;
+    vertical-align: middle;
+    width: 100%;
+    padding: 0;
+    margin: 5px;
+    height: 100px;
+    color: #e0e0e0;
+}
+
+.main-link:hover{
+    color: #1a5dad;
+}
+
+.main-logo {
+    width: 20%;
+    font-size: 64px;
+    background: #1c1c1c;
+    box-shadow: 0 0 10px #1c1c1c;
+    display: inline-flex;
+}
+
+.main-logo svg {
+    margin: auto;
+}
+
+.main-text {
+    width: 80%;
+    font-size: 20px;
+    display: inline-flex;
+    background: linear-gradient(to right, #1c1c1c, transparent 90%);
+}
+.main-text span {
+    margin-top: auto;
+    margin-bottom: auto;
+}
+
 /*******************************************************************************
 Small Device Styles
 *******************************************************************************/
@@ -456,6 +500,12 @@ Small Device Styles
     #table_coms td{
         width: 50%;
     }
+    .main-logo {
+        font-size: 32px;
+    }
+    .main-text {
+        font-size: 15px;
+    }
 }
 
 @media screen and (max-width: 320px) {

includes/main_button_template.php

@@ -0,0 +1,8 @@
+<a class="main-link" href="<?php echo $link ?>">
+    <span class="main-logo">
+        <i class="<?php echo $icon ?>"></i>
+    </span>
+    <span class="main-text">
+        <span><?php echo $text ?></span>
+    </span>
+</a>

index.php

@@ -23,6 +23,52 @@ include("includes/sidenav.html");
 <div id="home_content_wrap" class="outer">
     <section id="home_content" class="inner">
         <h1>Semaine d'Accueil 2018</h1>
+        <?php
+        $link = "planning.php";
+        $icon = "fas fa-calendar-alt";
+        $text = "Le planning de ta semaine ! Sois au courant de tous les événements !";
+        include("includes/main_button_template.php");
+
+        $link = "parrainage.php";
+        $icon = "fas fa-user-plus";
+        $text = "Toutes les informations concernant le parrainage !";
+        include("includes/main_button_template.php");
+
+        $link = "blouse.php";
+        $icon = "fas fa-tshirt";
+        $text = "La fameuse Blouse, habit officiel de l'insa !";
+        include("includes/main_button_template.php");
+
+        $link = "photos.php";
+        $icon = "fas fa-camera";
+        $text = "Les photos de la semaine (la tienne et celles de tes parrains/marraines) !";
+        include("includes/main_button_template.php");
+
+        $link = "stats.php";
+        $icon = "fas fa-list-ol";
+        $text = "Les stats de chaque groupe (USA vs URSS) !";
+        include("includes/main_button_template.php");
+
+        $link = "coms.php";
+        $icon = "fas fa-users";
+        $text = "Les différentes COM présentes pour assurer la pérénité de la semaine !";
+        include("includes/main_button_template.php");
+
+        $link = "prevs.php";
+        $icon = "fas fa-medkit";
+        $text = "La prévention, pour éviter tout incident";
+        include("includes/main_button_template.php");
+
+        $link = "downloads.php";
+        $icon = "fas fa-download";
+        $text = "Les téléchargements, si t'as paumé une feuille !";
+        include("includes/main_button_template.php");
+
+        $link = "infos.php";
+        $icon = "fas fa-info";
+        $text = "Les informations supplémentaires, si tu veux tout savoir !";
+        include("includes/main_button_template.php");
+        ?>
     </section>
 </div>
 </body>