index.html

---
layout: default
---

<div id="top-gradient"></div>
<section id="about">
  <div class="content">
    <div id="intro">
      {% include intro.html %}
    </div>

    <nav>
      <ul id="about-links">
        <li><a href="#" class="tell">Make things? Tell us!</a></li>
        <li><a href="#" class="help">Want to help?</a></li>
      </ul>
    </nav>

    <div id="tell">
      {% include tell.html %}
    </div>

    <div id="help">
      {% include help.html %}
    </div>
  </div>
</section>
<div id="bottom-gradient"></div>

<nav id="filters">
  <ul>
    <li><a href="#" data-filter=".maker">Makers</a></li>
    <li><a href="#" data-filter=".made">Made</a></li>
    <li><a href="#" data-filter=".digital">Digital</a></li>
    <li><a href="#" data-filter=".physical">Physical</a></li>
  </ul>
</nav>

<section id="card-wrapper">
  <div id="cards">
    {% for post in site.posts %}
      <div class="card {% for class in post.category %}{{ class }} {% endfor %}">
        <div class="inner-card {{ post.img_class }}" {% if post.color %}style="background-color:#{{ post.color }}"{% endif %}>
          <a href="{{ post.homepage }}"><img src="{{ post.image }}"></a>
        </div>
      </div>
    {% endfor %}
  </div>
</section>