robots.html

---
layout: default
title: Robot Profiles
metadesc: Past Robots info, design, performace and statistics all the way back to the first one
metatitle: Past Robots
bg: light
txt: dark
---

<style>

  
  div.polaroid {
    width: 20%;
    background-color: white;
    color:black;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
    margin-bottom: 25px;
  }
  
  div.content {
    text-align: center;
    padding: 10px 20px;
  }
</style>

<div class="container-fluid">
  <br>
  <h1 class="text-center">Robot Profiles</h1>
  <br>
  <!-- d-flex flex-xs-column-reverse flex-sm-column-reverse flex-md-row-reverse flex-lg-row-reverse flex-xl-row-reverse -->
  <div class="row mx-auto text-dark card-deck flex-md-row flex-sm-column" id="cardHolder"> 
    {% for robot in site.robots reversed %}
    {% if robot.published != "false" %}
    {% if robot.title != "Current Season"%}
    <div class="col-sm-12 col-md-6 col-lg-3" style="padding-bottom: 5.5vh;">
      <div class="card bg-light"> 
        <img class="card-img-top img-thumbnail" src="{{ robot.thumbnail }}" id="logo" style="width:100%; height:30rem; object-fit: cover;"></img>
        <div class="card-body bg-light">
          <p class="card-title">{{robot.title}}: {{ robot.game }} <br> <b>{{robot.robotName}}</b> </p>
          <a href="{{robot.url | absolute_url}}" class="btn btn-outline-primary">See Profile</a>        
        </div>
      </div>
    </div>
    {% endif %}
    {% endif %}
    {% endfor %}
  </div>

</div>
<br>