portfolio.html

---
layout: default
title: Portfolio
permalink: /portfolio/
---

<div class="portfolio container">

  <h1 class="header">Everything I've Made</h1>

  <div class="controls">
      <button class="filter waves-effect waves-light btn red darken-4" data-filter="all">All</button>
      <button class="filter waves-effect waves-light btn red darken-4" data-filter=".website">
      <i class="mdi-hardware-laptop left"></i>Websites</button>
      <button class="filter waves-effect waves-light btn red darken-4" data-filter=".video">
      <i class="mdi-av-videocam left"></i>Videos</button>
   </div>

  <ul class="portfolio-list row">
    {% for item in site.portfolio %}
        <li class="col s12 m6 l4 mix {{ item.categories }}">
            <div class="card">
				{% if item.categories == "website" %}
              <div class="browser valign-wrapper">
              	<div class="left">
					<div class="red-btn left"></div>
					<div class="yellow-btn left"></div>
					<div class="green-btn left"></div>
				</div>
              </div>
              	{% endif %}
               <div class="card-image">
				   {% if item.image %}
                  <img class="portfolio-img" src="{{ site.url }}{{ item.image }}" alt="{{ item.title }}">
				   {% endif %} {% if item.video %}
              		<div class="video-container">
              			<iframe width="355" height="191" src="//www.youtube.com/embed/{{ item.video }}" allowfullscreen></iframe>
              		</div>
				   {% endif %}
               </div>
                <div class="card-action">
                  <a class="card-title black-text">{{ item.title }}</a><br>
                  <a href="{{ item.finalproject }}">View {% if item.image %}Website{% endif %}{% if item.video %}Video{% endif %}</a>
                </div>
              </div>
        </li>
    {% endfor %}
  </ul>
</div>