futureproject · chrisfrank · Feb 9, 2016 · Feb 4, 2016 · Feb 4, 2016 · Feb 4, 2016
diff --git a/_includes/menu.html b/_includes/menu.html
@@ -19,14 +19,6 @@
       {% endfor %}
     </ul>
   </section>
-  <section class="menu-item team-menu-item">
-    <a class='top-level-link {% if page.url contains 'team' %}active{% endif %}' href="/team">Team</a>
-    <ul class="sub-nav team-menu-item">
-      {% for team in site.teams %}
-      <li class='sub-nav-item {{ team[1].id | slugify }}'><a href="/team/#{{ team[1].id | slugify }}">{{ team[1].label }}</a></li>
-      {% endfor %}
-    </ul>
-  </section>
   <section class="menu-item stories-menu-item">
     <a class='top-level-link {% if page.url contains 'stories' %}active{% endif %}' href="/stories">Stories</a>
     <ul class="sub-nav">

diff --git a/_includes/team-list.html b/_includes/team-list.html
@@ -0,0 +1,30 @@
+<div class='team-list'>
+{% for person in site.data.team %}
+  {% if person.team contains team_name %}
+  <div class="person {{ person.team }}">
+    {% if person.vimeo_id %}
+    <a href="//player.vimeo.com/video/{{ person.vimeo_id }}?autoplay=1" class='person-photos img-flip'>
+      <img src="/img/team/team_{{ person.portrait }}_1.jpg" alt="{{ person.name }}" />
+      <img src="/img/team/team_{{ person.portrait }}_2.jpg" alt="{{ person.name }}" />
+    </a>
+    {% elsif person.team.contains 'payroll' %}
+    <a href="/team/{{ person.name | slugify }}.html" class='person-photos img-flip'>
+      <img src="/img/team/team_{{ person.portrait }}_1.jpg" alt="{{ person.name }}" />
+      <img src="/img/team/team_{{ person.portrait }}_2.jpg" alt="{{ person.name }}" />
+    </a>
+    {% else %}
+      <div class='person-photos'>
+        <img src="/img/team/team_{{ person.portrait }}_1.jpg" alt="{{ person.name }}" />
+      </div>
+    {% endif %}
+    <div class='person-name'>{{ person.name }}</div>
+    {% if person.team contains "payroll" %}
+    <div class='person-role'>{{ person.role | replace:",","<br>" }}</div>
+    {% else %}
+    <div class='person-role'>{{ person.role }}</div>
+    {% endif %}
+  </div>
+  {% endif %}
+{% endfor %}
+{% assign team = nil %}
+</div>
diff --git a/_includes/team-nav.html b/_includes/team-nav.html
@@ -1,6 +1,5 @@
 <nav class='team-nav'>
   {% for team in site.teams %}
-  <a class="btn btn-grey {% if team_name == team[1].id %}active{% endif %}" href="{% if page.url != '/team/index.html' %}/team/{% endif %}#{{ team[1].id }}">{{ team[1].label }}</a>
+  <a class="btn btn-grey team-link{% if team_name == team[1].id %} active {% endif %}" href="/team/#{{ team[1].id }}">{{ team[1].label }}</a>
   {% endfor %}
-</nav>
-
+</nav>
diff --git a/_includes/teams.html b/_includes/teams.html
@@ -0,0 +1,7 @@
+<div id="main-team-content">
+	<div class="post-team">
+  	<div id="{{site.teams.leadership.id}}">
+    	{% assign team_name = site.teams.leadership.id %}{% include team.html %}
+  	</div>
+	</div>
+</div>
diff --git a/_layouts/teams.html b/_layouts/teams.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html class="no-js" lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <title>{% if page.title %}{{ page.title }} | {% endif %}The Future Project</title>
+    <meta name="description" content="The Future Project is a national movement to empower the next generation to build the future, one dream at a time.">
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no, minimum-scale=1, maximum-scale=1">
+  </head>
+  <body class="page--{{ page.url | remove:'html' | slugify }}">
+    {{ content }}
+  </body>
+</html>
diff --git a/_sass/posts.scss b/_sass/posts.scss
@@ -154,3 +154,6 @@
 .post-images {
   display: none;
 }
+.hide-team{
+  display: none;
+}
diff --git a/_sass/team.scss b/_sass/team.scss
@@ -50,9 +50,9 @@
     }
   }
   .person-name {
-    font-weight: 700;
+    font-weight: 800;
     height: 1.2em;
-    white-space: nowrap;
+    letter-spacing: 0px
   }
   .person-role {
     @extend .caps;

diff --git a/about/_drafts/2015-08-01-team.md → about/_posts/2015-08-01-team.md b/about/_drafts/2015-08-01-team.md → about/_posts/2015-08-01-team.md
@@ -3,4 +3,4 @@ theme: white wide
 ---
 {% assign team_name = 'leadership' %}
 {% include team-nav.html %}
-{% include team.html %}
+{% include teams.html %}
diff --git a/js/enhancements.js b/js/enhancements.js
@@ -11,3 +11,4 @@ layout: null
 {% include_relative research.js %}
 {% include_relative motion.js %}
 {% include_relative stories.js %}
+{% include_relative team.js %}
diff --git a/js/team.js b/js/team.js
@@ -0,0 +1,16 @@
+$(function(){
+	$(".team-link").click(function(e) {
+		e.preventDefault();
+
+   	if (!$(this).hasClass("active")) {
+    	$(".team-link.active").removeClass("active");
+    	$(this).addClass("active");
+  	}
+
+  	var url = $(this).attr('href').replace('#', '').replace('team', 'teams');
+
+  	$.get(url, function(data){
+ 			$('#main-team-content').html(data);
+    })
+	});
+});
diff --git a/teams/advisors/index.html b/teams/advisors/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.advisors.id}}">
+    {% assign team_name = site.teams.advisors.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/board/index.html b/teams/board/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.board.id}}">
+    {% assign team_name = site.teams.board.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/dc/index.html b/teams/dc/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.dc.id}}">
+    {% assign team_name = site.teams.dc.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/detroit/index.html b/teams/detroit/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.detroit.id}}">
+    {% assign team_name = site.teams.detroit.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/hq/index.html b/teams/hq/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.hq.id}}">
+    {% assign team_name = site.teams.hq.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/leadership/index.html b/teams/leadership/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.leadership.id}}">
+    {% assign team_name = site.teams.leadership.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/newark/index.html b/teams/newark/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.newark.id}}">
+    {% assign team_name = site.teams.newark.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/nh/index.html b/teams/nh/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: single
+---
+<div class="post-team">
+  <div id="{{site.teams.nh.id}}">
+    {% assign team_name = site.teams.nh.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/nyc/index.html b/teams/nyc/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.nyc.id}}">
+    {% assign team_name = site.teams.nyc.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/philly/index.html b/teams/philly/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.philly.id}}">
+    {% assign team_name = site.teams.philly.id %}{% include team.html %}
+  </div>
+</div>
diff --git a/teams/sf/index.html b/teams/sf/index.html
@@ -0,0 +1,9 @@
+---
+title: Team
+layout: teams
+---
+<div class="post-team">
+  <div id="{{site.teams.sf.id}}">
+    {% assign team_name = site.teams.sf.id %}{% include team.html %}
+  </div>
+</div>