import React from 'react';
import './homepage.css';
import { Header, Footer } from "./components/layout"

const homepage = () => (
    <div>
        <Header/>
        <div class="about">
            <div class="container">
                <div class="about-main">
                    <div class="about-top">
                        <h3>Présentation du Projet final FULL STACK du master IWOCS M2</h3>
                        <h5>Site de présentation du projet final </h5>
                        <p>Ce site a été développé à partir du framework API Platform ...</p>
                    </div>
                    
                    <div class="about-text row">
                        <div class="col-md-4 about-text-left">
                            <a href="/property_sales/average_surface_price"><img src="images/2019-M2-WEB-FSLAB-Graphique1.jpeg" alt="Graphique1" height="220px" /></a>
                            <a href="/property_sales/average_surface_price">
                                <h5>Evolution du Prix du M²</h5>
                            </a>
                            <p>Graphique montrant l'évolution du prix moyen du M² au cours du temps.</p>
                        </div>
                        
                        <div class="col-md-4 about-text-left">
                            <a href="/property_sales/sales_by_granularity"><img src="images/2019-M2-WEB-FSLAB-Graphique2.jpeg" alt="Graphique2" height="220px" /></a>
                            <a href="/property_sales/sales_by_granularity">
                                <h5>Nombre de Ventes sur une Période</h5>
                            </a>
                            <p>Diagramme à barres représentant le nombre de ventes sur une période donnée, soit par jour, mois ou par an.</p>
                        </div>
                        
                        <div class="col-md-4 about-text-left">
                            <a href="/property_sales/sales_by_regions"><img src="images/2019-M2-WEB-FSLAB-Graphique3.jpeg" alt="Graphique3" height="220px" /></a>
                            <a href="/property_sales/sales_by_regions">
                                <h5>Répartition des Ventes par Région</h5>
                            </a>
                            <p>Diagramme circulaire affichant la répartition du nombre de ventes par région pour une année donnée.</p>
                        </div>
                        <div class="clearfix"> </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="team">
            <div class="container">
                <div class="team-main">
                    <h3>Notre équipe de choc</h3>
                    <div class="team-top row">
                        <div class="col-md-2 team-top-left">
                            <img src="images/avataaars_fm.png" alt="fm" width="100px" />
                            <div class="team-details">
                                <h4>Fleurian</h4>
                                <p>desc1</p>
                            </div>
                        </div>
                        <div class="col-md-2 team-top-left">
                            <img src="images/avataaars_fb.png" alt="fb" width="100px" />
                            <div class="team-details">
                                <h4>Florian Boubou</h4>
                                <p>desc2</p>
                            </div>
                        </div>
                        <div class="col-md-2 team-top-left">
                            <img src="images/avataaars_mc.png" alt="mc" width="100px" />
                            <div class="team-details">
                                <h4>Mathieu</h4>
                                <p>desc3</p>
                            </div>
                        </div>
          
                        <div class="col-md-2 team-top-left">
                            <img src="images/avataaars_vv.png" alt="vv" width="100px" />
                            <div class="team-details">
                                <h4>Vivien</h4>
                                <p>Chasseur de cariboux tout doux tout roux</p>
                            </div>
                        </div>
                        <div class="clearfix"> </div>
                    </div>
                </div>
            </div>
        </div>
        <Footer/>
    </div>
);


export default homepage;
