<!-- HTML du site du comic -->
<!-- Date de création: 2 juin 2020 -->
<!-- Auteur: Rétro -->
<!-- La conception du site est très largement pompée sur
https://infos.step.polymtl.ca/, merci à eux pour leur consentement
implicite. -->
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="Comité de Micro-informatique de Polytechnique Montréal">
<meta name="author" content="Comic">
<title>Comic</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Style CSS du gabarit -->
<link href="css/business-frontpage.css" rel="stylesheet">
<!-- Style CSS du gabarit -->
<link href="css/comic.css" rel="stylesheet">
<!-- Icône -->
<link rel="icon" type="image/png" sizes="96x96" href="ressources/icone-96x96.png">
<link rel="manifest" href="ressources/manifest.json">
<meta name="theme-color" content="#ffffff">
<!-- Icônes des événements -->
<link href="fontawesome-5.13.0/css/all.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-expand-sm navbar-dark fixed-top">
<div class="container nav-container">
<a class="navbar-brand" href="index.html">
<img src="ressources/logo_comic_blanc.png" alt="Logo" id="logoNavbar">
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarResponsive">
<ul class="navbar-nav">
<li class="nav-item active"><a class="nav-link text-nowrap" href="index.html">Accueil<span class="sr-only">(current)</span></a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="le-comité.html">Le Comité</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="chronologie.html">Chronologie</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="s-impliquer.html">S'impliquer</a></li>
<li class="nav-item"><a class="nav-link text-nowrap" href="contact.html">Contact</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Services
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown">
<a class="dropdown-item" href="polybash.html"><i class="fa fa-trophy icone-evenement"></i> Polybash</a>
<a class="dropdown-item" href="saltcup.html"><img id="icone-saltcup" class="icone-evenement" src="ressources/saliere-noire.svg" alt=""> Saltcup</a>
<a class="dropdown-item" href="buildquest.html"><i class="fa fa-hammer icone-evenement"></i> BuildQuest</a>
<a class="dropdown-item" href="réparons-poly.html"><i class="fa fa-wrench icone-evenement"></i> Réparons-Poly</a>
</div>
</li>
</ul>
</div>
</div>
</nav>
<!-- Image en fond avec le logo Comic-inside en gros -->
<header class="text-center">
<img class="image-fond" src="ressources/image-bash-2012-avec-logo.png" alt="Photo Polybash 2012">
</header>
<!-- Contenu -->
<section id="a-propos">
<div class="container-fluid text-center">
<h3 class="section-heading">QU'EST-CE QUE LE COMIC?</h3>
<div class="row justify-content-center">
<div class="col-md-8 col-sm-10">
<p>Le Comic est un comité à la vie étudiante de l'École Polytechnique de Montréal responsable de la tenue de tournois LAN dont le <i>Polybash</i>, et d'autres événements liés à l'informatique depuis 1987. Vous êtes une personne passionnée par les jeux vidéos, le logiciel libre ou le matériel informatique et vous cherchez du monde avec qui partager cette passion? Passez nous voir au C-215.02!</p>
</div>
</div>
</div>
</section>
<section class="section-vidéo section-paire">
<div class="container-fluid text-center">
<div class="row justify-content-center" style="max-width: 800px;">
<video controls>
<source src="ressources/presentation-pinep-2018-2019.mp4" type="video/mp4">
</video>
</div>
</div>
</section>
<section id="services">
<!-- TODO: Ajouter des imagettes et des texte descriptifs de nos différents services -->
<div class="container-fluid text-center">
<h3 class="section-heading">SERVICES</h3>
<div class="row justify-content-center">
<div class="boite col-lg-3 col-md-6">
<div class="encadré">
<a href="polybash.html">
<img id="logo-polybash" src="ressources/polybash.png" alt="Logo Polybash"><br>
<div>
Le tournoi e-sport de l'École Polytechnique de Montréal, tenu chaque hiver depuis 2000.
</div>
</a>
</div>
</div>
<div class="boite col-lg-3 col-md-6">
<div class="encadré">
<a href="saltcup.html">
<img src="ressources/saltcup.png" alt="Logo Saltcup"><br>
<div>
Tournoi annuel de <i>League of Legends</i> organisé en automne dont le nom ne reflète pas l'ambiance.
</div>
</a>
</div>
</div>
<div class="boite col-lg-3 col-md-6">
<div class="encadré">
<a href="buildquest.html">
<img id="logo-buildquest" src="ressources/buildquest.png" alt="Logo BuildQuest"><br>
<div>
Tu veux apprendre à monter ton propre PC? Tu ne sais pas par où commencer? Le BuildQuest est là pour toi!
</div>
</a>
</div>
</div>
<div class="boite col-lg-3 col-md-6">
<div class="encadré">
<a href="réparons-poly.html">
<img id="logo-reparons-poly" src="ressources/reparons-poly.png" alt="Logo Réparons-Poly"><br>
<div>
Le projet Réparons-Poly propose à la communauté polytechnicienne des ateliers de réparation d’appareils électroniques.
</div>
</a>
</div>
</div>
</div>
</div>
<!-- /.row -->
</section>
<!-- Bas-de-page -->
<footer class="py-5">
<div class="container text-center">
<h5><b><p>COMIC</p></b></h5>
<p>Local C215.02 (Pavillon Principal)
<br>École Polytechnique de Montréal
<br><a class="lien-cliquable" href="mailto:contact@comic.polymtl.ca">contact@comic.polymtl.ca</a>
<br><a class="réseau-social" href="https://www.facebook.com/lecomicpolymtl/"><i class="fab fa-facebook-square"></i></a>
<a class="réseau-social" href="https://m.me/lecomicpolymtl"><i class="fab fa-facebook-messenger"></i></a>
<!-- NOTE: Le lien d'invitation vers le Discord du Polybash est lié
au compte personnel de Rétro. Créer un nouveau lien d'invitation --à date d'expiration illimitée-- quand ce sera approprié. -->
<a class="réseau-social" href="https://discord.gg/EqHDKYK"><i class="fab fa-discord"></i></a></p>
<p>© Comic 2020</p>
</div>
<!-- /.container -->
</footer>
<!-- Bootstrap core JavaScript -->
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>