WIP

404/index.md

@@ -0,0 +1,7 @@
+---
+layout: page
+title: 404
+permalink: /404.html
+---
+
+Please wait as an elite team of dogs playing Tetris pause their games to redirect you.

_data/mentors.yml

@@ -0,0 +1,23 @@
+- name: Fake Name 1
+  company: Fake Company 1
+  focus: Back-end Development
+  languages: CSS, JavaScript, Ruby, Rust
+  description: Deserunt quis enim dolore cupidatat laboris elit cupidatat cillum minim pariatur fugiat nisi dolore. Incididunt minim adipisicing Lorem tempor cupidatat laborum ut proident tempor veniam excepteur.
+
+- name: Fake Name 2
+  company: Fake Company 2
+  focus: Back-end Development
+  languages: CSS, JavaScript, Ruby, Rust
+  description: Deserunt quis enim dolore cupidatat laboris elit cupidatat cillum minim pariatur fugiat nisi dolore. Incididunt minim adipisicing Lorem tempor cupidatat laborum ut proident tempor veniam excepteur.
+
+- name: Fake Name 3
+  company: Fake Company 3
+  focus: Back-end Development
+  languages: CSS, JavaScript, Ruby, Rust
+  description: Deserunt quis enim dolore cupidatat laboris elit cupidatat cillum minim pariatur fugiat nisi dolore. Incididunt minim adipisicing Lorem tempor cupidatat laborum ut proident tempor veniam excepteur.
+
+- name: Fake Name 4
+  company: Fake Company 4
+  focus: Back-end Development
+  languages: CSS, JavaScript, Ruby, Rust
+  description: Deserunt quis enim dolore cupidatat laboris elit cupidatat cillum minim pariatur fugiat nisi dolore. Incididunt minim adipisicing Lorem tempor cupidatat laborum ut proident tempor veniam excepteur.

_data/menu.yml

@@ -1,11 +1,8 @@
 - name: About
   link: '/about/'
 
-- name: Blog
-  link: '/blog/'
-
-- name: Developers
-  link: '/developers'
+- name: Events
+  link: '/events/'
 
 - name: Contact
-  link: 'http://groups.google.com/forum/?fromgroups#!forum/newhavenio'
+  link: '/contact/'

_includes/footer.html

@@ -1,31 +1,24 @@
-<footer class="site-footer">
+<footer class="mt-auto bg-teal-darker text-grey-lighter shadow-lg">
+  <div class="nh-o-maxWidth flex flex-col md:flex-row">
+    <p class="md:w-2/3 pb-4 text-teal-lighter leading-normal">
+      {{ site.description }}
+    </p>
 
-  <div class="container-fluid">
-    <div class="row">
-
-      <div class="footer-links col-sm-6 col-md-8">
-          {% for menu in site.data.menu %}
-            <a href="{{ menu.link | prepend: site.baseurl }}">
-              {{ menu.name }}
-            </a>{% if forloop.last == false %} / {% endif %}
-        {% endfor %}
-      </div>
-
-      <div class="col-sm-6 col-md-4">
-        <a href="{{ menu.link | prepend: site.baseurl }}">
-          <h4 class="footer-heading">
-            {{ site.title }}
-          </h4>
-        </a>
-      </div>
-    </div>
+    <ul class="list-reset md:ml-auto">
+      {% for menu in site.data.menu %}
+        {% if page.url == menu.link %}
+          {% assign link = '#main' %}
+          {% assign active_classes = 'font-semibold' %}
+        {% else %}
+          {% assign link = menu.link | prepend: site.baseurl %}
+          {% assign active_classes = 'text-sm' %}
+        {% endif %}
+        <li>
+          <a class="inline-block pb-2 text-teal-lighter {{ active_classes }}" href="{{ link }}">
+            {{ menu.name }}
+          </a>
+        </li>
+      {% endfor %}
+    </ul>
   </div>
-
-  <script src="{{ "/js/modernizr.min.js" | prepend: site.baseurl }}"></script>
-  <script>
-    // Makes all blog links open in a new tab
-    $('article.post a').each(function() {
-      $(this).attr('target', '_blank');
-    });
-  </script>
 </footer>

_includes/head.html

@@ -16,18 +16,23 @@
   <title>{% if page.title %}{{ page.title }}{% else %}{{ site.title }}{% endif %}</title>
   <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
 
-  <link rel="stylesheet" href="{{ "/css/main.css" | prepend: site.baseurl }}">
   <link rel="canonical" href="{{ page.url | replace:'index.html','' | prepend: site.baseurl | prepend: site.url }}">
   <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}">
-  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
-  <link href='https://fonts.googleapis.com/css?family=Montserrat|Open+Sans:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
 
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.7.21/webcomponents-lite.min.js"></script>
-  <script type="text/javascript" src="{{ '/js/bundle.js' | prepend: site.baseurl }}" charset="utf8" ></script>
-  <script src="{{ "/js/components/meetup-utils.js" | prepend: site.baseurl }}"></script>
+  <style type="text/css">
+    {% include main.css %}
+  </style>
+
+  {% if page.meetup_events %}
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/webcomponentsjs/0.7.21/webcomponents-lite.min.js"></script>
+    <script type="text/javascript" src="{{ '/js/bundle.js' | prepend: site.baseurl }}" charset="utf8" ></script>
+    <script src="{{ "/js/components/meetup-utils.js" | prepend: site.baseurl }}"></script>
+    <link rel="import" href="{{ "/js/components/meetup-events.html" | prepend: site.baseurl }}">
+    <link rel="import" href="{{ "/js/components/meetup-event-card.html" | prepend: site.baseurl }}">
+  {% endif %}
 
   {% if jekyll.environment == 'production' %}
-  {% include analytics.html %}
+    {% include analytics.html %}
   {% endif %}
-  
+
 </head>

_includes/nav.html

@@ -0,0 +1,31 @@
+{% if page.url == '/' %}
+  {% assign home_link = '#main' %}
+{% else %}
+  {% assign home_link = '/' | site.baseurl %}
+{% endif %}
+
+<header class="border-orange border-t-3 border-b-3 bg-grey-lightest shadow-md" role="banner">
+  <div class="nh-o-maxWidth py-0 flex items-center justify-between">
+    <a href="{{ home_link }}" class="inline-flex pr-8">
+      <img class="w-16" src="/img/logo.svg" alt="NewHaven.IO homepage">
+    </a>
+    <nav>
+      <ul class="list-reset flex flex-wrap items-center justify-end">
+        {% for menu in site.data.menu %}
+          {% if page.url == menu.link %}
+            {% assign link = '#main' %}
+            {% assign active_classes = 'font-semibold text-base' %}
+          {% else %}
+            {% assign link = menu.link | prepend: site.baseurl %}
+            {% assign active_classes = '' %}
+          {% endif %}
+          <li>
+            <a class="inline-block p-3 md:p-4 {{ active_classes }}" href="{{ link }}">
+              {{ menu.name }}
+            </a>
+          </li>
+        {% endfor %}
+      </ul>
+    </nav>
+  </div>
+</header>

_layouts/default.html

@@ -1,20 +1,18 @@
 <!DOCTYPE html>
-<html>
-
+<html lang="en">
   {% include head.html %}
 
-  <body>
+  <body class="min-h-screen flex flex-col mt-auto">
+    <a aria-label="Skip Link" class="skip-link" href="#main">
+      Skip to Content
+    </a>
 
-    {% include header.html %}
+    {% include nav.html %}
 
-    <div class="wrapper">
-      <div class="page-content {% if page.container == true %}container-fluid{% endif %}">
-        {{ content }}
-      </div>
-    </div>
+    <main id="main" class="flex-1 {{ page.container_classes }} {% if page.container == false %}p-4{% endif %}">
+      {{ content }}
+    </main>
 
     {% include footer.html %}
-
   </body>
-
 </html>

_layouts/full.html

@@ -0,0 +1,6 @@
+---
+layout: default
+---
+<article class="nh-o-maxWidth--full native-text">
+	{{ content }}
+</article>

_layouts/page.html

@@ -1,19 +1,12 @@
 ---
 layout: default
 ---
-
-<div class="wrapper">
-    <div class="page-content container-fluid">
-		<div class="panel panel-default">
-
-		  <div class="panel-header">
-		    <h1 class="page-title">{{ page.title }}</h1>
-		  </div>
-
-		  <div class="panel-body">
-		    {{ content }}
-		  </div>
-
-		</div>
-	</div>
-</div>
+<header class="pt-4">
+	<h1 class="nh-o-maxWidth {% if page.fullWidth %}nh-o-maxWidth--full{% endif %}">
+		{{ page.title }}
+	</h1>
+</header>
+
+<article class="nh-o-maxWidth {% if page.fullWidth %}nh-o-maxWidth--full{% endif %} native-text">
+	{{ content }}
+</article>

about/index.md

@@ -0,0 +1,32 @@
+---
+layout: page
+title: About
+---
+
+You may be peripherally aware of NewHaven.io but not really understand what the group is or why it exists. In a nutshell, we're a nonprofit organization that serves the local tech community. But what does that actually _mean?_
+
+## Communication and organization in the community
+
+NewHaven.io leverages some well-known tools to achieve its goal of connecting the local tech community. In addition to [our own website](http://newhaven.io/), we make extensive use of [Meetup](http://www.meetup.com/newhavenio/) and [Slack](https://newhavenio-slackin.herokuapp.com/). [Meetup](http://www.meetup.com/newhavenio/) is used to organize and schedule in-person gatherings, while Slack facilitates online communication and collaboration. Many people first discover NewHaven.io through [Meetup](http://www.meetup.com/newhavenio/) by searching locally for events highlighting technologies of interest to them. Slack is a natural extension of the physical meetings, allowing the conversation to continue fluidly and asynchronously long after the lights have been turned off and the doors have closed.
+
+Both our [Meetup](http://www.meetup.com/newhavenio/) and Slack are structured to allow for tech- or topic-specific engagement. Anyone from novice to expert can self-select areas that interest them and dive in as shallow or as deep as they choose. This includes proposing meetings where one can either present to a group as an expert or convene a learning session as a novice. We encourage both equally!
+
+### Code of Conduct
+
+All members of NewHaven.io are expected to abide by our code of coduct found [here.](https://github.com/newhavenio/code-of-conduct/blob/master/README.md)
+
+## Aggregation of local interest groups
+
+Technology is a funny thing. More importantly, humans are funny creatures. We obsess over bright shiny things and then when we lose interest in them we move on to the next one. One could easily argue that along with continuous improvement, it is the inherently ephemeral nature of our collective interest in different technologies that drives the cycle of obsolescence and change.
+
+As geeks self-organize around their preferred technologies, related interest groups coalesce, grow, stagnate and die. These social constructs change as the technologies change. What stays the same is the underlying bedrock of people in the tech community. This foundation layer remains constant even if the elements which comprise it are constantly rearranging themselves into new configurations. It may slowly expand or contract as people move into and out of the local area, but it is reasonably stable. The people that make up this foundation are who NewHaven.io serves, and we're in it for the long haul.
+
+## Partnerships in the community
+
+Local companies and educational institutions recognize the importance of NewHaven.io in maintaining and growing a thriving tech community. A healthy tech community makes New Haven more attractive to prospective students and IT professionals, which has a positive impact beyond the realm of technology. Sponsorship of NewHaven.io is one way organizations can contribute to our efforts toward achieving these outcomes. We're also interested in cross-promotional opportunities in the community.
+
+We regularly collaborate on events with local organizations such as [ProductCamp Connecticut](http://www.pcampct.org/), [A100](http://indie-soft.com/a100/), [Independent Software](http://indie-soft.com/), [Yale University](http://yale.edu), [The Grove](http://grovenewhaven.com/), [Continuity](http://continuity.net), [Digital Surgeons](https://www.digitalsurgeons.com/), [SeeClickFix](http://seeclickfix.com), and [Core Informatics](http://www.coreinformatics.com/). Often times the value that NewHaven.io brings to these collaborations is our "human infrastructure," other times it's the subject matter expertise of our members. Our nonprofit financial apparatus can also be leveraged for management of larger-scale community events such as conferences. We're even exploring some exciting new event frontiers such as the blending of tech and fitness.
+
+## How will _you_ get involved?
+
+We welcome everyone into NewHaven.io with open arms. Keeping this engine running requires sustained effort, so we're always on the lookout for help. There are numerous opportunities for contributing based on your own personal talents and areas of interest, so [pop into our `#organizing` Slack channel](https://newhavenio-slackin.herokuapp.com/) and introduce yourself today!

contact/index.md

@@ -0,0 +1,18 @@
+---
+layout: page
+title: Contact
+---
+
+Want to get to know NewHaven.IO's members better? There's many ways you can contact us to learn more!
+
+## Chat With Us On Slack!
+
+[You can meet and chat with our community through our Slack!](https://newhavenio-slackin.herokuapp.com/) We have channels for job postings, discussing programming languages, giving career and tech advice, and some random topics too. Many members frequently visit and post here, so it's a great way to introduce yourself and see what we're all about.
+
+## Check Out Upcoming Meetups!
+
+You can [read more about our different types of meetups, and which ones are next](/events/), on our Events page. You can also [visit our Meetup.com group](http://www.meetup.com/newhavenio/) to reserve a spot at one.
+
+## Tweet us at @newhavenio!
+
+You can [find us on twitter at @newhavenio](http://www.twitter.com/newhavenio). We tweet useful articles, updates about upcoming meetups, and other info related to tech and New Haven.

events/index.md

@@ -0,0 +1,33 @@
+---
+layout: page
+title: Events
+fullWidth: true
+
+meetup_events: true
+---
+
+<ul>
+  <li>
+    <strong>Hack Nights</strong> - Ut elit eu eu qui sit nisi adipisicing quis esse nisi et proident do.
+  </li>
+  <li>
+    <strong>Workshops</strong> - Ut elit eu eu qui sit nisi adipisicing quis esse nisi et proident do.
+  </li>
+  <li>
+    <strong>Social Nights</strong> - Aliqua culpa sit sit enim et Lorem excepteur ex consectetur dolor cillum magna incididunt labore.
+  </li>
+  <li>
+    <strong>Talks</strong> - Amet in Lorem laboris ea labore consequat.
+  </li>
+  <li>
+    <strong>Study Halls</strong> - Esse aliqua excepteur pariatur id laboris eiusmod sit sit ipsum adipisicing sunt sint.
+  </li>
+</ul>
+
+<section id="meetup-events">
+  <meetup-events
+    id="events"
+    class="md:flex md:flex-wrap md:p-2"
+    max-events="5">
+  </meetup-events>
+</section>