infusionvlc/infusion

  <header class="main-header show-tell-header">
    <div class="container center">
      <%= link_to meetups_path do %>
        <h1>
          <img class="huge-logo" src="logo_base.svg" alt="INFUSIÓN"/>
        </h1>
      <% end %>
        <br/>
        <h2 class="landing-title">show & tell</h2>
        <h3 class="landing-date">24 / 05 / 18</h3>
        <h4 class="landing-location">17:00 - AULA 0.4 EDIFICIO 1G - ETSINF UPV</h4>
        <p id="countdown" class="landing-date"></p>
   </div>

    <a href="https://goo.gl/forms/w7rpR3suzr7RRCuq2" target="_blank"><span class="btn btn-intro responsive-button">APÚNTATE A LA MERIENDA</span></a><br/>
    <a href="/speakers" target="_blank"><span class="btn btn-intro responsive-button">PONENTES</span></a>
    <a href="/schedule" target="_blank"><span class="btn btn-intro responsive-button">PROGRAMA</span></a><br/>
    <%= link_to meetups_path do %>
      <span class="btn btn-intro responsive-button">ENTRA A LA WEB</span>
    <% end %>
</header>
<section id="event">
  <div class="container center landing-container">
    <p class="event-decription">
      <img src="/technology.png" class="landing-icon" /><br/><br/>
      Somos una comunidad en la que todo el mundo está invitado
    a compartir sus conocimientos y su <span class="blue-text">pasión por la tecnología</span>.<br/><br/>
    <br/>
    <img src="/people.png" class="landing-icon" /><br/><br/>
    ¿Y qué mejor manera de hacerlo que enseñando a la gente
    los proyectos que han hecho otras <span class="purple-text">personas como tú</span>?<br/><br/>
    <br/>
    <img src="/croissants.png" class="landing-icon" /><br/><br/>
    Acércate a nuestra <span class="pink-text">merienda</span> y conoce las ideas y proyectos de otros.
    Si te animas, tenemos espacio para que nos cuentes tú también en qué estás trabajando.
    </p>
  </div>
  <hr/>
</section>

<section id="quote">
  <div class="container center">
    <br/> <br/>
    <h2 class="center"><%= I18n.t 'landing.quote' %></h2>
  </div>
</section>

<div class="container">
  <section class="row">
    <div class="col-sm-6 center">
      <img class="fluid" src="empowerment.svg" alt="INFUSIÓN"/>
    </div>
    <div class="card col-sm-6 magenta" id="description">
      <h2 class="center"><%= I18n.t 'landing.description' %></h2>
    </div>
  </section>
</div>
<section id="mission">
  <div class="container">
    <h2 class="center"><%= I18n.t 'landing.mission' %></h2>
  </div>
</section>
<section id="values" class="blue">
  <h2 class="center"><%= I18n.t 'landing.values.title' %></h2>
  <br/>
  <div class="container">
    <div class="row">
      <div class="col-sm-12 col-md-4 value">
        <h3 class="center">
          <span class="fa-stack fa-lg">
            <i class="fas fa-circle fa-stack-2x"></i>
            <i class="fas fa-diamond fa-stack-1x fa-inverse"></i>
          </span><br/>
          <%= I18n.t 'landing.values.diversity' %>
        </h3>
      </div>
      <div class="col-sm-12 col-md-4 value">
        <h3 class="center">
          <span class="fa-stack fa-lg">
            <i class="fas fa-circle fa-stack-2x"></i>
            <i class="fas fa-bullhorn fa-stack-1x fa-inverse"></i>
          </span><br/>
          <%= I18n.t 'landing.values.participation' %>
        </h3>
      </div>
      <div class="col-sm-12 col-md-4 value">
        <h3 class="center">
          <span class="fa-stack fa-lg">
            <i class="fas fa-circle fa-stack-2x"></i>
            <i class="fas fa-puzzle-piece fa-stack-1x fa-inverse"></i>
          </span><br/>
          <%= I18n.t 'landing.values.team_work' %>
        </h3>
      </div>
    </div>
  </div>
</section>
<section id="collaborators">
  <div class="container center">
    <p><%= I18n.t 'landing.collaborators' %></p>
    <a href="http://startinf.blogs.upv.es/" target="_blank"><img class="med" alt="start.inf" src="/startinf.png"/></a>
    <a href="http://acmupv.webs.upv.es/" target="_blank"><img class="med" alt="ACM UPV Chapter" src="/acmupv.png"/></a>
    <a href="https://www.inf.upv.es/www/etsinf/es/" target="_blank"><img class="med" alt="ETSINF UPV" src="/etsinf.png"/></a>
  </div>
</section>
<section id="networks">
  <div class="container center">
    <h2><%= I18n.t "main.networks" %></h2>
    <a href="https://twitter.com/infusionvlc"><img class="small" alt="Twitter" src="/twitter.png"/></a>
    <a href="https://instagram.com/infusion_vlc"><img class="small" alt="Instagram" src="/instagram.png"/></a>
    <a href="https://www.youtube.com/channel/UCP5URDPxiT1Nd8LDVmShN5Q"><img class="small" alt="YouTube" src="/youtube.png"/></a>
    <a href="https://t.me/infusionvlc"><img class="small" alt="Telegram" src="/telegram.png"/></a>
    <a href="https://medium.com/infusión"><img class="small" alt="Medium" src="/medium.png"/></a>
  </div>
</section>

<p class="container center"><small>Icons by Made by Made, ShmidtSergey, Vectors Market, Maxim Basinki, Mahmure Alp, Ben Davis, Dinosoft Labs, Gregor Cresnar, Maxim Kulikov, Kidiladon, Adrien Coquet, StoneHub, Three Six Five, Celeste Njoo.</small></p>

<script>
// Set the date we're counting down to
var countDownDate = new Date("May 24, 2018 17:00:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get todays date and time
  var now = new Date().getTime();

  // Find the distance between now an the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("countdown").innerHTML = days + "d " + hours + "h "
  + minutes + "m " + seconds + "s ";

  // If the count down is finished, write some text
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("countdown").innerHTML = "EXPIRED";
  }
}, 1000);
</script>