{% extends "site/layout.html.twig" %}

{% block content %}
  <div style="" id="txt_n_tag">
    <div style="width: 80%; margin: auto; margin-top: 30px; ">
        <div id="bottom_tags" style='display: grid; '>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>AJAX</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>API</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>BDD</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Bootstrap</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Chart JS</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>CSS</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Javascript</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Jquery</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>GIT</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>HTML</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Linux</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Materialize</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>MVC</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Robots</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>PHP</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>POO</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>SharePoint</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>Symfony</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>UML</a></div></div>
          <div class="bt_tag_container"><div class="bt_tag hoverable"><a>VBA</a></div></div>
      </div>
      <div id="text_tag" class="row" style="z-index: 1; opacity: 1; height: 33%; ">
        <div>
          <h5 id="text_title">Passer la souris sur un bouton pour afficher le détail de la compétence.</h5>
          <hr class="ligne_subtitle" />
          <h6 id="text_body" class="justify "></h6>
        </div>
      </div>
    </div>
  </div>
  <div class="row">
      <div class="tap-target" data-target="menu">
        <div class="tap-target-content">
          <h5 style="margin-left: 10px; ">Rémi Tafforeau - Développeur web</h5>
          <li style="list-style-type: none; margin-left: 10px; "><a class="tooltipped"  data-position="top" data-tooltip="Cliquer pour m'envoyer un mail..." href="mailto:remitafforeau@yahoo.fr" style="color: rgb(43, 36, 30)"> <i style="vertical-align: bottom; margin-right: 3px; " class="material-icons">mail</i><u>remitafforeau@yahoo.fr</u></a></li>
          <li style="list-style-type: none; margin-left: 10px; "><span style="color: rgb(43, 36, 30)"> <i style="vertical-align: bottom; margin-right: 3px; " class="material-icons">phone</i>06.62.61.21.19.</span></li>
        </div>
      </div>
  </div>
  <div class="container" style="width: 75%; margin-left: 19%; margin-top: 3%; ">
     <div class="row" style="position: fixed; bottom: 0px; right: 0">
      <img src="/img_rt" id="photo_myself" class="circle" width="30px" onmouseover="$('.tap-target').tapTarget('open')">
     </div>
      <div class="row" style="position: fixed; bottom: 0; right: 40px; width: 0;  ">
      <a style="background-color: rgb(249, 254, 255); border: 0px white solid; width: 0; " id="menu" class="waves-effect waves-light btn btn-floating" ><i class="material-icons">menu</i></a>
    </div>
  </div>
{% endblock %}