<!doctype html>
{% load staticfiles %}
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>{% block title %}COIN - Illyse SI{% endblock %}</title>
    <link rel="stylesheet" href="{% static "css/foundation.css"%}" />
    <link rel="stylesheet" href="{% static "css/illyse.css" %}" />
    <link rel="stylesheet" href="{% static "css/offcanvas.css" %}">
    <script src="{% static "js/vendor/modernizr.js" %}"></script>
    <link rel="icon" type="image/png" href="{% static "img/coinitem.png" %}"/>
    <link rel="icon" type="image/x-icon" href="{% static "img/favicon.ico" %}" />
  </head>
  <body class="off-canvas-wrap">

  <div class="large-12 columns inner-wrap">
   <header class="row">
       <h1><a href="index.html">COIN est un Outil pour un Internet Neutre</a></h1>
   </header>
    <p class="show-for-small">
        <a class="left-off-canvas-toggle button">Menu</a>
    </p>

   <div class="row">
   <div class="large-3 columns">
    {% block sidenav %} 
    <nav id="sidebox" class="hide-for-small">
     <h3 id="nav">Navigation</h3>
     <ul class="side-nav">
         <li {% if request.get_full_path = "/members/" %}class="active"{% endif %}><a href="/members/">Tableau de bord</a></li>
         <li {% if request.get_full_path = "/members/info/" %}class="active"{% endif %} ><a href="/members/info/">Mes informations personnelles</a></li>
         <li {% if request.get_full_path = "/members/abo/" %}class="active"{% endif %}><a href="/members/abo/">Mes abonnements</a></li>
         <li {% if request.get_full_path = "/members/contact/" %}class="active"{% endif %}><a href="/members/abo/">Contact / Support</a></li>
     </ul>
     </nav>
     {% endblock %}
   </div>

    <div class="large-9 columns">
    {% block content %}{% endblock %}
    </div>

    <aside class="left-off-canvas-menu"> 
        <ul class="off-canvas-list">
            <li><label>Navigation</label></li>
            <li><a href="#">Tableau de bord</a></li>
            <li><a href="#">Mes informations personnelles</a></li>
            <li><a href="#">Mes abonnements</a></li>
            <li><a href="#">Contact / Support</a></li>
        </ul>
    </aside>

    <script src="{% static "js/vendor/jquery.js" %}"></script>
    <script src="{% static "js/foundation.min.js" %}"></script>
    <script src="{% static "js/foundation/foundation.offcanvas.js" %}"></script>

    <script>
      $(document).foundation();
    </script>
  </body>
</html>
