Browse Source

Implemented Massively layout, basic modifications, #13

KittyAlana 1 year ago
parent
commit
fc2fefa04f
68 changed files with 9852 additions and 179 deletions
  1. 3 1
      README.md
  2. BIN
      jekyll/.DS_Store
  3. 0 24
      jekyll/404.html
  4. 1 1
      jekyll/Gemfile
  5. 2 7
      jekyll/Gemfile.lock
  6. 4 9
      jekyll/_config.yml
  7. 43 31
      jekyll/_includes/footer.html
  8. 5 10
      jekyll/_includes/head.html
  9. 4 31
      jekyll/_includes/header.html
  10. 8 0
      jekyll/_includes/intro.html
  11. 53 0
      jekyll/_includes/menu.html
  12. 0 15
      jekyll/_includes/social.html
  13. 71 0
      jekyll/_layouts/home.html
  14. 39 0
      jekyll/_layouts/page.html
  15. 39 0
      jekyll/_layouts/post.html
  16. 0 50
      jekyll/_posts/2019-02-29-collaboration.markdown
  17. BIN
      jekyll/assets/.DS_Store
  18. 4 0
      jekyll/assets/css/font-awesome.min.css
  19. 4482 0
      jekyll/assets/css/main.css
  20. 36 0
      jekyll/assets/css/noscript.css
  21. BIN
      jekyll/assets/fonts/FontAwesome.otf
  22. BIN
      jekyll/assets/fonts/fontawesome-webfont.eot
  23. 685 0
      jekyll/assets/fonts/fontawesome-webfont.svg
  24. BIN
      jekyll/assets/fonts/fontawesome-webfont.ttf
  25. BIN
      jekyll/assets/fonts/fontawesome-webfont.woff
  26. BIN
      jekyll/assets/fonts/fontawesome-webfont.woff2
  27. BIN
      jekyll/assets/images/bg.jpg
  28. BIN
      jekyll/assets/images/massively.jpg
  29. BIN
      jekyll/assets/images/overlay.png
  30. BIN
      jekyll/assets/images/pic01.jpg
  31. BIN
      jekyll/assets/images/pic02.jpg
  32. BIN
      jekyll/assets/images/pic03.jpg
  33. BIN
      jekyll/assets/images/pic04.jpg
  34. BIN
      jekyll/assets/images/pic05.jpg
  35. BIN
      jekyll/assets/images/pic06.jpg
  36. BIN
      jekyll/assets/images/pic07.jpg
  37. BIN
      jekyll/assets/images/pic08.jpg
  38. BIN
      jekyll/assets/images/pic09.jpg
  39. 5 0
      jekyll/assets/js/jquery.min.js
  40. 2 0
      jekyll/assets/js/jquery.scrollex.min.js
  41. 2 0
      jekyll/assets/js/jquery.scrolly.min.js
  42. 268 0
      jekyll/assets/js/main.js
  43. 2 0
      jekyll/assets/js/skel.min.js
  44. 587 0
      jekyll/assets/js/util.js
  45. 39 0
      jekyll/assets/sass/base/_page.scss
  46. 213 0
      jekyll/assets/sass/base/_typography.scss
  47. 34 0
      jekyll/assets/sass/components/_box.scss
  48. 135 0
      jekyll/assets/sass/components/_button.scss
  49. 311 0
      jekyll/assets/sass/components/_form.scss
  50. 17 0
      jekyll/assets/sass/components/_icon.scss
  51. 92 0
      jekyll/assets/sass/components/_image.scss
  52. 252 0
      jekyll/assets/sass/components/_list.scss
  53. 110 0
      jekyll/assets/sass/components/_pagination.scss
  54. 112 0
      jekyll/assets/sass/components/_section.scss
  55. 122 0
      jekyll/assets/sass/components/_table.scss
  56. 243 0
      jekyll/assets/sass/layout/_footer.scss
  57. 63 0
      jekyll/assets/sass/layout/_header.scss
  58. 115 0
      jekyll/assets/sass/layout/_intro.scss
  59. 158 0
      jekyll/assets/sass/layout/_main.scss
  60. 85 0
      jekyll/assets/sass/layout/_nav.scss
  61. 153 0
      jekyll/assets/sass/layout/_navPanel.scss
  62. 64 0
      jekyll/assets/sass/layout/_wrapper.scss
  63. 34 0
      jekyll/assets/sass/libs/_functions.scss
  64. 398 0
      jekyll/assets/sass/libs/_mixins.scss
  65. 587 0
      jekyll/assets/sass/libs/_skel.scss
  66. 62 0
      jekyll/assets/sass/libs/_vars.scss
  67. 65 0
      jekyll/assets/sass/main.scss
  68. 43 0
      jekyll/assets/sass/noscript.scss

+ 3 - 1
README.md

@@ -2,4 +2,6 @@ Official Git repository for FNB Japan materials.
 
 ~/Jekyll/ contains the Jekyll repository for the website, https://fnb-japan.info . 
 
-~/site-src/ is routinely (manually) compiled from ~/Jekyll/, and is directly served on https://fnb-japan.info .
+~/site-src/ is routinely (manually) compiled from ~/Jekyll/, and is directly served on https://fnb-japan.info .
+
+

BIN
jekyll/.DS_Store


+ 0 - 24
jekyll/404.html

@@ -1,24 +0,0 @@
----
-layout: default
----
-
-<style type="text/css" media="screen">
-  .container {
-    margin: 10px auto;
-    max-width: 600px;
-    text-align: center;
-  }
-  h1 {
-    margin: 30px 0;
-    font-size: 4em;
-    line-height: 1;
-    letter-spacing: -1px;
-  }
-</style>
-
-<div class="container">
-  <h1>404</h1>
-
-  <p><strong>Page not found :(</strong></p>
-  <p>The requested page could not be found.</p>
-</div>

+ 1 - 1
jekyll/Gemfile

@@ -11,7 +11,7 @@ source "https://rubygems.org"
 gem "jekyll", "~> 3.8.5"
 
 # This is the default theme for new Jekyll sites. You may change this to anything you like.
-gem "minima", "~> 2.0"
+gem "massively_jekyll_theme", "~> 0.2"
 
 # If you want to use GitHub Pages, remove the "gem "jekyll"" above and
 # uncomment the line below. To upgrade, run `bundle update github-pages`.

+ 2 - 7
jekyll/Gemfile.lock

@@ -31,8 +31,6 @@ GEM
       jekyll (~> 3.3)
     jekyll-sass-converter (1.5.2)
       sass (~> 3.4)
-    jekyll-seo-tag (2.5.0)
-      jekyll (~> 3.3)
     jekyll-watch (2.1.2)
       listen (~> 3.0)
     kramdown (1.17.0)
@@ -41,11 +39,8 @@ GEM
       rb-fsevent (~> 0.9, >= 0.9.4)
       rb-inotify (~> 0.9, >= 0.9.7)
       ruby_dep (~> 1.2)
+    massively_jekyll_theme (0.2)
     mercenary (0.3.6)
-    minima (2.5.0)
-      jekyll (~> 3.5)
-      jekyll-feed (~> 0.9)
-      jekyll-seo-tag (~> 2.1)
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
     public_suffix (3.0.3)
@@ -67,7 +62,7 @@ PLATFORMS
 DEPENDENCIES
   jekyll (~> 3.8.5)
   jekyll-feed (~> 0.6)
-  minima (~> 2.0)
+  massively_jekyll_theme (~> 0.2)
   tzinfo-data
 
 BUNDLED WITH

+ 4 - 9
jekyll/_config.yml

@@ -13,13 +13,8 @@
 # you will see them accessed via {{ site.title }}, {{ site.email }}, and so on.
 # You can create any custom variable you would like, and they will be accessible
 # in the templates via {{ site.myvariable }}.
-title: Food Not Bombs Japan
-email:
-- chapter: Food Not Bombs Tokyo, Yokosuka 
-  address: hello@fnb-japan.info
-- chapter: Food Not Bombs Hokkaido
-  address: mod@aa.tufs.ac.jp
-- chapter: Food Not Bombs Yokosuka
+title: "Food Not Bombs"
+email: hello@fnb-japan.info
 
 description: >- # this means to ignore newlines until "baseurl:"
   A website for Food Not Bombs Tokyo and Yokosuka.
@@ -31,11 +26,11 @@ mastodon:
   instance: todon.nl
 rss: atom/rss
 keybase_username: fnb_alana
-twitter_username: fnb_japan
+twitter_url: twitter.com/@fnb_japan
 
 # Build settings
 markdown: kramdown
-theme: minima
+theme: massively_jekyll_theme
 plugins:
   - jekyll-feed
 

+ 43 - 31
jekyll/_includes/footer.html

@@ -1,35 +1,47 @@
-<footer class="site-footer h-card">
-  <data class="u-url" href="{{ "/" | relative_url }}"></data>
+		</div>
 
-  <div class="wrapper">
+		<!-- Footer -->
+		<footer id="footer">
+				<section>
+			            <!-- Put the calendar or Mastodon TL embed here--!>	
+                </section>
+				<section class="split contact">
+						<section class="alt">
+								<h3>Address</h3>
+								<p>{{ site.street_address }}<br />
+								    {{ site.city }}, {{ site.state }} {{ site.zip_code }}</p>
+						</section>
+						<section>
+								<h3>Phone</h3>
+								<p><a href="#">{{ site.phone }}</a></p>
+						</section>
+						<section>
+								<h3>Email</h3>
+								<p><a href="#">{{ site.email }}</a></p>
+						</section>
+						<section>
+								<h3>Social</h3>
+								<ul class="icons alt">
+									  <li><a href="#" class="icon alt fa-twitter"><span class="label">Twitter</span></a></li>
+									  <li><a href="#" class="icon alt fa-facebook"><span class="label">Facebook</span></a></li>
+									  <li><a href="#" class="icon alt fa-instagram"><span class="label">Instagram</span></a></li>
+									  <li><a href="#" class="icon alt fa-github"><span class="label">GitHub</span></a></li>
+								</ul>
+						</section>
+				</section>
+		</footer>
 
-    <h2 class="footer-heading">{{ site.title | escape }}</h2>
+		<!-- Copyright -->
+		<div id="copyright">
+				<ul><li>&copy; {{ site.title }}</li><li>Design: <a href="https://html5up.net">HTML5 UP</a></li><li>Jekyll integration: <a href="http://andrewbanchi.ch">Andrew Banchich</a></li></ul>
+		</div>
 
-    <div class="footer-col-wrapper">
-      <div class="footer-col footer-col-1">
-        <ul class="contact-list">
-        {% for email in site.email %}
-          {%- if email.chapter and email.address -%}
-            <li class="p-name">
-              {{ email.chapter | escape }}
-            </li>
-            <li>
-              <a class="u-email" href="mailto:{{ email.address }}">{{ email.address }}</a>
-            </li>
-          {%- endif -%}
-        {% endfor %}
-        </ul>
-      </div>
+		</div>
 
-      <div class="footer-col footer-col-2">
-        {%- include social.html -%}
-      </div>
-
-      <div class="footer-col footer-col-3">
-        <p>{{- site.description | escape -}}</p>
-      </div>
-    </div>
-
-  </div>
-
-</footer>
+		<!-- Scripts -->
+		<script src="{{ "assets/js/jquery.min.js" | absolute_url }}"></script>
+		<script src="{{ "assets/js/jquery.scrollex.min.js" | absolute_url }}"></script>
+		<script src="{{ "assets/js/jquery.scrolly.min.js" | absolute_url }}"></script>
+		<script src="{{ "assets/js/skel.min.js" | absolute_url }}"></script>
+		<script src="{{ "assets/js/util.js" | absolute_url }}"></script>
+		<script src="{{ "assets/js/main.js" | absolute_url }}"></script>

+ 5 - 10
jekyll/_includes/head.html

@@ -1,12 +1,7 @@
 <head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1">
-  {%- seo -%}
-  <link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
-  <link rel="shortcut icon" type="image/png" href="/assets/fnb_logo_square.png">
-  {%- feed_meta -%}
-  {%- if jekyll.environment == 'production' and site.google_analytics -%}
-    {%- include google-analytics.html -%}
-  {%- endif -%}
+		<title>{{ site.title }} {{ site.subtitle }}</title>
+		<meta charset="utf-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
+		<link rel="stylesheet" href="{{ 'assets/css/main.css' | relative_url }}" />
+		<noscript><link rel="stylesheet" href="{{ 'assets/css/noscript.css' | relative_url }}" /></noscript>
 </head>

+ 4 - 31
jekyll/_includes/header.html

@@ -1,31 +1,4 @@
-<header class="site-header" role="banner">
-
-  <div class="wrapper">
-    {%- assign default_paths = site.pages | map: "path" -%}
-    {%- assign page_paths = site.header_pages | default: default_paths -%}
-    <a class="site-title" rel="author" href="{{ "/" | relative_url }}"><img src="/assets/fnb_logo.png" alt="Food Not Bombs Logo" width="54.55px" height="61px">{{ site.title | escape }}</a>
-    <a rel="me" href="https://todon.nl/@FNB_Japan"></a>
-
-    {%- if page_paths -%}
-      <nav class="site-nav">
-        <input type="checkbox" id="nav-trigger" class="nav-trigger" />
-        <label for="nav-trigger">
-          <span class="menu-icon">
-            <svg viewBox="0 0 18 15" width="18px" height="15px">
-              <path d="M18,1.484c0,0.82-0.665,1.484-1.484,1.484H1.484C0.665,2.969,0,2.304,0,1.484l0,0C0,0.665,0.665,0,1.484,0 h15.032C17.335,0,18,0.665,18,1.484L18,1.484z M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.032C17.335,6.031,18,6.696,18,7.516L18,7.516z M18,13.516C18,14.335,17.335,15,16.516,15H1.484 C0.665,15,0,14.335,0,13.516l0,0c0-0.82,0.665-1.483,1.484-1.483h15.032C17.335,12.031,18,12.695,18,13.516L18,13.516z"/>
-            </svg>
-          </span>
-        </label>
-
-        <div class="trigger">
-          {%- for path in page_paths -%}
-            {%- assign my_page = site.pages | where: "path", path | first -%}
-            {%- if my_page.title  -%}
-              <a class="page-link" href="{{ my_page.url | relative_url }}">{{ my_page.title | escape }}</a>
-            {%- endif -%}
-          {%- endfor -%}
-        </div>
-      </nav>
-    {%- endif -%}
-  </div>
-</header>
+		<!-- Header -->
+		<header id="header">
+				<a href="{{ site.url }}" class="logo">Food Not Bombs</a>
+		</header>

+ 8 - 0
jekyll/_includes/intro.html

@@ -0,0 +1,8 @@
+<!-- Intro -->
+<div id="intro">
+		<h1>Food Not Bombs</h1>
+		<h2>兵器ではなく、食物を</h2>
+		<ul class="actions">
+				<li><a href="#header" class="button icon solo fa-arrow-down scrolly">Continue</a></li>
+		</ul>
+</div>

+ 53 - 0
jekyll/_includes/menu.html

@@ -0,0 +1,53 @@
+
+<!-- Nav -->
+<nav id="nav">
+		<ul class="links">
+				<li class="active"><a href="{{ '' | absolute_url }}">Food Not Bombs</a></li>
+        <!-- {% for page in site.pages %}
+		         {% if page.layout == "home" %}
+		         <li><a href="{{ "" | absolute_url }}">{{ page.title }}</a></li>
+	    	     {% endif %}
+		         {% endfor %} -->
+		    {% for page in site.pages %}
+		    {% if page.layout != "home" %}
+		    <li><a href="{{ page.url | absolute_url }}">{{ page.title }}</a></li>
+		    {% endif %}
+		    {% endfor %}
+		</ul>
+		<ul class="icons">
+				{% if site.twitter_url %}
+				<li><a href="{{ site.twitter_url }}" class="icon fa-twitter" target="_blank"><span class="label">Twitter</span></a></li>
+				{% endif %}
+				{% if site.googleplus_url %}
+				<li><a href="{{ site.googleplus_url }}" class="icon fa-google-plus" target="_blank"><span class="label">Google+</span></a></li>
+				{% endif %}
+				{% if site.facebook_url %}
+				<li><a href="{{ site.facebook_url }}" class="icon fa-facebook" target="_blank"><span class="label">Facebook</span></a></li>
+				{% endif %}
+				{% if site.instagram_url %}
+				<li><a href="{{ site.instagram_url }}" class="icon fa-instagram" target="_blank"><span class="label">Instagram</span></a></li>
+				{% endif %}
+				{% if site.pinterest_url %}
+				<li><a href="{{ site.pinterest_url }}" class="icon fa-pinterest" target="_blank"><span class="label">Pinterest</span></a></li>
+				{% endif %}
+				{% if site.500px_url %}
+				<li><a href="{{ site.500px_url }}" class="icon fa-500px" target="_blank"><span class="label">500px</span></a></li>
+				{% endif %}
+				{% if site.gitlab_url %}
+				<li><a href="{{ site.gitlab_url }}" class="icon fa-gitlab" target="_blank"><span class="label">GitLab</span></a></li>
+				{% endif %}
+				{% if site.github_url %}
+				<li><a href="{{ site.github_url }}" class="icon fa-github" target="_blank"><span class="label">GitHub</span></a></li>
+				{% endif %}
+				{% if site.slack_url %}
+				<li><a href="{{ site.slack_url }}" class="icon fa-slack" target="_blank"><span class="label">Slack</span></a></li>
+				{% endif %}
+				{% if site.linkedin_url %}
+				<li><a href="{{ site.linkedin_url }}" class="icon fa-linkedin" target="_blank"><span class="label">LinkedIn</span></a></li>
+				{% endif %}
+
+		</ul>
+</nav>
+
+<!-- Main -->
+<div id="main">

+ 0 - 15
jekyll/_includes/social.html

@@ -1,15 +0,0 @@
-<ul class="social-media-list">
-  {%- if site.dribbble_username -%}<li><a href="https://dribbble.com/{{ site.dribbble_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#dribbble' | relative_url }}"></use></svg> <span class="username">{{ site.dribbble_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.flickr_username -%}<li><a href="https://www.flickr.com/photos/{{ site.flickr_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#flickr' | relative_url }}"></use></svg> <span class="username">{{ site.flickr_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.github_username -%}<li><a href="https://github.com/{{ site.github_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#github' | relative_url }}"></use></svg> <span class="username">{{ site.github_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.instagram_username -%}<li><a href="https://instagram.com/{{ site.instagram_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#instagram' | relative_url }}"></use></svg> <span class="username">{{ site.instagram_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.linkedin_username -%}<li><a href="https://www.linkedin.com/in/{{ site.linkedin_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#linkedin' | relative_url }}"></use></svg> <span class="username">{{ site.linkedin_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.pinterest_username -%}<li><a href="https://www.pinterest.com/{{ site.pinterest_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#pinterest' | relative_url }}"></use></svg> <span class="username">{{ site.pinterest_username| escape }}</span></a></li>{%- endif -%}
-  {%- for mst in site.mastodon -%}{%- if mst.username and mst.instance -%}<li><a href="https://{{ mst.instance| cgi_escape | escape}}/@{{mst.username}}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#mastodon' | relative_url }}"></use></svg> <span class="username">{{ mst.username|escape }}</span></a></li>{%- endif -%}{%- endfor -%}
-  {%- if site.twitter_username -%}<li><a href="https://www.twitter.com/{{ site.twitter_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#twitter' | relative_url }}"></use></svg> <span class="username">{{ site.twitter_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.keybase_username -%}<li><a href="https://www.keybase.io/{{ site.keybase_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#keybase' | relative_url }}"></use></svg> <span class="username">{{ site.keybase_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.youtube_username -%}<li><a href="https://youtube.com/{{ site.youtube_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#youtube' | relative_url }}"></use></svg> <span class="username">{{ site.youtube_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.googleplus_username -%}<li><a href="https://plus.google.com/{{ site.googleplus_username| escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#googleplus' | relative_url }}"></use></svg> <span class="username">{{ site.googleplus_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.facebook_username -%}<li><a href="https://www.facebook.com/{{ site.facebook_username| cgi_escape | escape }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#facebook' | relative_url }}"></use></svg> <span class="username">{{ site.facebook_username| escape }}</span></a></li>{%- endif -%}
-  {%- if site.rss -%}<li><a href="{{ 'feed.xml' | relative_url }}"><svg class="svg-icon"><use xlink:href="{{ '/assets/minima-social-icons.svg#rss' | relative_url }}"></use></svg> <span>{{ site.rss | escape }}</span></a></li>{%- endif -%}
-</ul>

+ 71 - 0
jekyll/_layouts/home.html

@@ -0,0 +1,71 @@
+<!DOCTYPE HTML>
+<!--
+	   Massively by HTML5 UP
+	   html5up.net | @ajlkn
+	   Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+   -->
+<html>
+
+    {% include head.html %}
+
+	  <body class="is-loading">
+
+        <!-- Wrapper -->
+        <div id="wrapper" class="fade-in">
+
+            {% include intro.html %}
+            {% include header.html %}
+            {% include menu.html %}
+
+				    <!-- Featured Post -->
+				    <article class="post featured">
+						    <header class="major">
+								    <span class="date">April 25, 2017</span>
+								    <h2><a href="#">And this is a<br />
+									      massive headline</a></h2>
+								    <p>Aenean ornare velit lacus varius enim ullamcorper proin aliquam<br />
+									      facilisis ante sed etiam magna interdum congue. Lorem ipsum dolor<br />
+									      amet nullam sed etiam veroeros.</p>
+						    </header>
+						    <a href="#" class="image main"><img src="assets/images/pic01.jpg" alt="" /></a>
+						    <ul class="actions">
+								    <li><a href="#" class="button big">Full Story</a></li>
+						    </ul>
+				    </article>
+
+            {% if site.posts != null %}
+
+				    <!-- Posts -->
+				    <section class="posts">
+	              {% for post in site.posts %}
+                    {% if forloop.index <= 2 %}
+						    <article>
+								    <header>
+										    <span class="date">{{ post.date | date: "%B %-d, %Y" }}</span>
+										<h2><a href="{{ post.url  | relative_url }}">{{ post.title }}</a></h2>
+								</header>
+								<a href="{{ post.url  | relative_url }}" class="image fit"><img src="{{ post.image }}" alt="" /></a>
+								<p>{{ post.excerpt }}</p>
+								<ul class="actions">
+										<li><a href="{{ post.url  | relative_url }}" class="button">Full Story</a></li>
+								</ul>
+				    		</article>
+                   {% endif %}
+                {% endfor %}
+				</section>
+
+
+        <!-- Footer -->
+        <footer>
+            <ul class="actions">
+                <li><a href="{{ "/blog" | relative_url }}" class="button">See All Posts</a></li> 
+            </ul>
+        </footer>
+
+{% endif %}
+
+        {% include footer.html %}
+
+    </body>
+
+</html>

+ 39 - 0
jekyll/_layouts/page.html

@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<!--
+	   Massively by HTML5 UP
+	   html5up.net | @ajlkn
+	   Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+   -->
+<html>
+
+    {% include head.html %}
+
+	  <body class="is-loading">
+
+		    <!-- Wrapper -->
+			  <div id="wrapper">
+
+            {% include header.html %}
+            {% include menu.html %}
+
+            <!-- Post -->
+				    <section class="post">
+						    <header class="major">
+								    <!-- <span class="date">{{ page.date | date: "%B %-d, %Y" }}</span> -->
+								    {% if page.title %}<h1>{{ page.title }}</h1>{% endif %}
+								    {% if page.description %}<p>{{ page.description }}</p>{% endif %}
+						    </header>
+
+                {% if page.image %}
+                <div class="image main"><img src="{{ site.baseurl }}/{{ page.image }}" alt="" /></div>
+                {% endif %}
+
+            {{ content }}
+
+				</section>
+
+        {% include footer.html %}
+
+    </body>
+
+</html>

+ 39 - 0
jekyll/_layouts/post.html

@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<!--
+	   Massively by HTML5 UP
+	   html5up.net | @ajlkn
+	   Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+   -->
+<html>
+
+    {% include head.html %}
+
+	  <body class="is-loading">
+
+		    <!-- Wrapper -->
+			  <div id="wrapper">
+
+            {% include header.html %}
+            {% include menu.html %}
+
+				    <!-- Post -->
+				    <section class="post">
+						    <header class="major">
+								    <span class="date">{{ page.date | date: "%B %-d, %Y" }}</span>
+								    {% if page.title %}<h1>{{ page.title }}</h1>{% endif %}
+								    {% if page.description %}<p>{{ page.description }}</p>{% endif %}
+						    </header>
+
+                {% if page.image %}
+                <div class="image main"><img src="{{ site.baseurl }}/{{ page.image }}" alt="" /></div>
+                {% endif %}
+
+                {{ content }}
+
+				    </section>
+
+            {% include footer.html %}
+
+    </body>
+
+</html>

+ 0 - 50
jekyll/_posts/2019-02-29-collaboration.markdown

@@ -1,50 +0,0 @@
----
-layout: post
-title: Getting Involved in Tokyo Food Not Bombs
-date: 
-categories: [update, Tokyo]
----
-Food Not Bombs is effective because of our capacity to conduct effective and efficient decision-making via consensus. This article describes how Tokyo Food Not Bombs will use a combination of technology and in-person meetings to operate the consensus model transparently, efficiently, effectively, and accessibly. 
-
-Our decision making takes place in two places: [Our online issue tracker](https://git.ikrypto.club/FNB_Japan/FNBJapan/issues/) and in-person meetings.
-
-Anyone has the ability to make a proposal, either on our issue tracker or at our in person meetings. A proposal is often inspired by a discussion at a meeting, or a discussion thread on our issue tracker. However they can and do arise without prompting. Once a proposal is made, it goes through an iterative and constructive process where it can be expanded, improved, and evaluated. 
-
-This process looks like this:
-- Introduce Proposal:
-
-  The person who had the idea introduces it to the rest of the team to build upon. This proposal does not necessarily need to be complete.
-
-  If the proposal has been introduced on Git, it may be re-introduced at the subsequent in-person meeting. If the proposal is introduced in an in-person meeting, it should be copied to the issue tracker.
-
-- Discussion:
-
-  Whether at an in-person meeting or on the issue tracker thread, as soon as a proposal is presented, it is discussed.
-
-- Call for Concerns:
-
-  Any person who sees problems with the proposal is encouraged to express it at this stage. These concerns can be taken into consideration to modify the proposal. Notable concerns can be created as separate issues in the issue-tracker with the "concerns" label.
-
-- Restate Proposal
-
-- Send to Subsequent Meeting:
-
-  The team may decide to immediately implement minor, entirely unproblematic, or urgent decisions. However less urgent or more nuanced proposals may be forwarded to a secondary meeting.
-
-- Second Discussion
-
-- Second Call for Concerns
-
-- Restate Refined Proposal
-
-- Ask for Stand-Asides or Blocks
-
-  After ensuring that everyone understands the refined proposal, members are asked if they want to "stand-aside" or "block" the proposal. A team member chooses to "stand-aside" when they don't want to support the proposal, but don't believe it is contrary to the values and goals of the group. A team member can choose to "block" the proposal if they believe the proposal is contrary to the values and goals of the group.
-
-  If there are many stand-asides or blocks, the team is urged to continue discussion of this issue on the Git issue-tracker. It will be re-introduced at a subsequent meeting.
-
-- Proposal Adopted Seeing No Blocks and a Small Amount of "Stand-Asides"
-
-  This proposal should then be marked as "approved" in the tracker. However it should only be marked as "closed" if all of its task stipulations are completed. Alternatively, the issue may be closed with separate issues opened for the specific tasks.
-
-

BIN
jekyll/assets/.DS_Store


File diff suppressed because it is too large
+ 4 - 0
jekyll/assets/css/font-awesome.min.css


File diff suppressed because it is too large
+ 4482 - 0
jekyll/assets/css/main.css


+ 36 - 0
jekyll/assets/css/noscript.css

@@ -0,0 +1,36 @@
+@import url(font-awesome.min.css);
+
+/*
+	Massively by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+*/
+
+/* Wrapper */
+
+	#wrapper {
+		background-color: #212931;
+		background-image: url("../../images/overlay.png"), linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), url("../../images/bg.jpg");
+		background-size: auto,								auto,														100% auto;
+		background-position: center,								center,														top center;
+		background-repeat: repeat,								no-repeat,													no-repeat;
+		background-attachment: fixed,								fixed,														fixed;
+	}
+
+		#wrapper.fade-in:before {
+			display: none;
+		}
+
+/* Intro */
+
+	body.is-loading #intro {
+		opacity: 1;
+	}
+
+		body.is-loading #intro:not(.hidden) + #header + #nav {
+			-moz-transform: none;
+			-webkit-transform: none;
+			-ms-transform: none;
+			transform: none;
+			opacity: 1;
+		}

BIN
jekyll/assets/fonts/FontAwesome.otf


BIN
jekyll/assets/fonts/fontawesome-webfont.eot


File diff suppressed because it is too large
+ 685 - 0
jekyll/assets/fonts/fontawesome-webfont.svg


BIN
jekyll/assets/fonts/fontawesome-webfont.ttf


BIN
jekyll/assets/fonts/fontawesome-webfont.woff


BIN
jekyll/assets/fonts/fontawesome-webfont.woff2


BIN
jekyll/assets/images/bg.jpg


BIN
jekyll/assets/images/massively.jpg


BIN
jekyll/assets/images/overlay.png


BIN
jekyll/assets/images/pic01.jpg


BIN
jekyll/assets/images/pic02.jpg


BIN
jekyll/assets/images/pic03.jpg


BIN
jekyll/assets/images/pic04.jpg


BIN
jekyll/assets/images/pic05.jpg


BIN
jekyll/assets/images/pic06.jpg


BIN
jekyll/assets/images/pic07.jpg


BIN
jekyll/assets/images/pic08.jpg


BIN
jekyll/assets/images/pic09.jpg


File diff suppressed because it is too large
+ 5 - 0
jekyll/assets/js/jquery.min.js


File diff suppressed because it is too large
+ 2 - 0
jekyll/assets/js/jquery.scrollex.min.js


File diff suppressed because it is too large
+ 2 - 0
jekyll/assets/js/jquery.scrolly.min.js


+ 268 - 0
jekyll/assets/js/main.js

@@ -0,0 +1,268 @@
+/*
+	Massively by HTML5 UP
+	html5up.net | @ajlkn
+	Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+*/
+
+(function($) {
+
+	skel.breakpoints({
+		xlarge:	'(max-width: 1680px)',
+		large:	'(max-width: 1280px)',
+		medium:	'(max-width: 980px)',
+		small:	'(max-width: 736px)',
+		xsmall:	'(max-width: 480px)',
+		xxsmall: '(max-width: 360px)'
+	});
+
+	/**
+	 * Applies parallax scrolling to an element's background image.
+	 * @return {jQuery} jQuery object.
+	 */
+	$.fn._parallax = function(intensity) {
+
+		var	$window = $(window),
+			$this = $(this);
+
+		if (this.length == 0 || intensity === 0)
+			return $this;
+
+		if (this.length > 1) {
+
+			for (var i=0; i < this.length; i++)
+				$(this[i])._parallax(intensity);
+
+			return $this;
+
+		}
+
+		if (!intensity)
+			intensity = 0.25;
+
+		$this.each(function() {
+
+			var $t = $(this),
+				$bg = $('<div class="bg"></div>').appendTo($t),
+				on, off;
+
+			on = function() {
+
+				$bg
+					.removeClass('fixed')
+					.css('transform', 'matrix(1,0,0,1,0,0)');
+
+				$window
+					.on('scroll._parallax', function() {
+
+						var pos = parseInt($window.scrollTop()) - parseInt($t.position().top);
+
+						$bg.css('transform', 'matrix(1,0,0,1,0,' + (pos * intensity) + ')');
+
+					});
+
+			};
+
+			off = function() {
+
+				$bg
+					.addClass('fixed')
+					.css('transform', 'none');
+
+				$window
+					.off('scroll._parallax');
+
+			};
+
+			// Disable parallax on ..
+				if (skel.vars.browser == 'ie'		// IE
+				||	skel.vars.browser == 'edge'		// Edge
+				||	window.devicePixelRatio > 1		// Retina/HiDPI (= poor performance)
+				||	skel.vars.mobile)				// Mobile devices
+					off();
+
+			// Enable everywhere else.
+				else {
+
+					skel.on('!large -large', on);
+					skel.on('+large', off);
+
+				}
+
+		});
+
+		$window
+			.off('load._parallax resize._parallax')
+			.on('load._parallax resize._parallax', function() {
+				$window.trigger('scroll');
+			});
+
+		return $(this);
+
+	};
+
+	$(function() {
+
+		var	$window = $(window),
+			$body = $('body'),
+			$wrapper = $('#wrapper'),
+			$header = $('#header'),
+			$nav = $('#nav'),
+			$main = $('#main'),
+			$navPanelToggle, $navPanel, $navPanelInner;
+
+		// Disable animations/transitions until the page has loaded.
+			$window.on('load', function() {
+				window.setTimeout(function() {
+					$body.removeClass('is-loading');
+				}, 100);
+			});
+
+		// Prioritize "important" elements on medium.
+			skel.on('+medium -medium', function() {
+				$.prioritize(
+					'.important\\28 medium\\29',
+					skel.breakpoint('medium').active
+				);
+			});
+
+		// Scrolly.
+			$('.scrolly').scrolly();
+
+		// Background.
+			$wrapper._parallax(0.925);
+
+		// Nav Panel.
+
+			// Toggle.
+				$navPanelToggle = $(
+					'<a href="#navPanel" id="navPanelToggle">Menu</a>'
+				)
+					.appendTo($wrapper);
+
+				// Change toggle styling once we've scrolled past the header.
+					$header.scrollex({
+						bottom: '5vh',
+						enter: function() {
+							$navPanelToggle.removeClass('alt');
+						},
+						leave: function() {
+							$navPanelToggle.addClass('alt');
+						}
+					});
+
+			// Panel.
+				$navPanel = $(
+					'<div id="navPanel">' +
+						'<nav>' +
+						'</nav>' +
+						'<a href="#navPanel" class="close"></a>' +
+					'</div>'
+				)
+					.appendTo($body)
+					.panel({
+						delay: 500,
+						hideOnClick: true,
+						hideOnSwipe: true,
+						resetScroll: true,
+						resetForms: true,
+						side: 'right',
+						target: $body,
+						visibleClass: 'is-navPanel-visible'
+					});
+
+				// Get inner.
+					$navPanelInner = $navPanel.children('nav');
+
+				// Move nav content on breakpoint change.
+					var $navContent = $nav.children();
+
+					skel.on('!medium -medium', function() {
+
+						// NavPanel -> Nav.
+							$navContent.appendTo($nav);
+
+						// Flip icon classes.
+							$nav.find('.icons, .icon')
+								.removeClass('alt');
+
+					});
+
+					skel.on('+medium', function() {
+
+						// Nav -> NavPanel.
+						$navContent.appendTo($navPanelInner);
+
+						// Flip icon classes.
+							$navPanelInner.find('.icons, .icon')
+								.addClass('alt');
+
+					});
+
+				// Hack: Disable transitions on WP.
+					if (skel.vars.os == 'wp'
+					&&	skel.vars.osVersion < 10)
+						$navPanel
+							.css('transition', 'none');
+
+		// Intro.
+			var $intro = $('#intro');
+
+			if ($intro.length > 0) {
+
+				// Hack: Fix flex min-height on IE.
+					if (skel.vars.browser == 'ie') {
+						$window.on('resize.ie-intro-fix', function() {
+
+							var h = $intro.height();
+
+							if (h > $window.height())
+								$intro.css('height', 'auto');
+							else
+								$intro.css('height', h);
+
+						}).trigger('resize.ie-intro-fix');
+					}
+
+				// Hide intro on scroll (> small).
+					skel.on('!small -small', function() {
+
+						$main.unscrollex();
+
+						$main.scrollex({
+							mode: 'bottom',
+							top: '25vh',
+							bottom: '-50vh',
+							enter: function() {
+								$intro.addClass('hidden');
+							},
+							leave: function() {
+								$intro.removeClass('hidden');
+							}
+						});
+
+					});
+
+				// Hide intro on scroll (<= small).
+					skel.on('+small', function() {
+
+						$main.unscrollex();
+
+						$main.scrollex({
+							mode: 'middle',
+							top: '15vh',
+							bottom: '-15vh',
+							enter: function() {
+								$intro.addClass('hidden');
+							},
+							leave: function() {
+								$intro.removeClass('hidden');
+							}
+						});
+
+				});
+
+			}
+
+	});
+
+})(jQuery);

File diff suppressed because it is too large
+ 2 - 0
jekyll/assets/js/skel.min.js


+ 587 - 0
jekyll/assets/js/util.js

@@ -0,0 +1,587 @@
+(function($) {
+
+	/**
+	 * Generate an indented list of links from a nav. Meant for use with panel().
+	 * @return {jQuery} jQuery object.
+	 */
+	$.fn.navList = function() {
+
+		var	$this = $(this);
+			$a = $this.find('a'),
+			b = [];
+
+		$a.each(function() {
+
+			var	$this = $(this),
+				indent = Math.max(0, $this.parents('li').length - 1),
+				href = $this.attr('href'),
+				target = $this.attr('target');
+
+			b.push(
+				'<a ' +
+					'class="link depth-' + indent + '"' +
+					( (typeof target !== 'undefined' && target != '') ? ' target="' + target + '"' : '') +
+					( (typeof href !== 'undefined' && href != '') ? ' href="' + href + '"' : '') +
+				'>' +
+					'<span class="indent-' + indent + '"></span>' +
+					$this.text() +
+				'</a>'
+			);
+
+		});
+
+		return b.join('');
+
+	};
+
+	/**
+	 * Panel-ify an element.
+	 * @param {object} userConfig User config.
+	 * @return {jQuery} jQuery object.
+	 */
+	$.fn.panel = function(userConfig) {
+
+		// No elements?
+			if (this.length == 0)
+				return $this;
+
+		// Multiple elements?
+			if (this.length > 1) {
+
+				for (var i=0; i < this.length; i++)
+					$(this[i]).panel(userConfig);
+
+				return $this;
+
+			}
+
+		// Vars.
+			var	$this = $(this),
+				$body = $('body'),
+				$window = $(window),
+				id = $this.attr('id'),
+				config;
+
+		// Config.
+			config = $.extend({
+
+				// Delay.
+					delay: 0,
+
+				// Hide panel on link click.
+					hideOnClick: false,
+
+				// Hide panel on escape keypress.
+					hideOnEscape: false,
+
+				// Hide panel on swipe.
+					hideOnSwipe: false,
+
+				// Reset scroll position on hide.
+					resetScroll: false,
+
+				// Reset forms on hide.
+					resetForms: false,
+
+				// Side of viewport the panel will appear.
+					side: null,
+
+				// Target element for "class".
+					target: $this,
+
+				// Class to toggle.
+					visibleClass: 'visible'
+
+			}, userConfig);
+
+			// Expand "target" if it's not a jQuery object already.
+				if (typeof config.target != 'jQuery')
+					config.target = $(config.target);
+
+		// Panel.
+
+			// Methods.
+				$this._hide = function(event) {
+
+					// Already hidden? Bail.
+						if (!config.target.hasClass(config.visibleClass))
+							return;
+
+					// If an event was provided, cancel it.
+						if (event) {
+
+							event.preventDefault();
+							event.stopPropagation();
+
+						}
+
+					// Hide.
+						config.target.removeClass(config.visibleClass);
+
+					// Post-hide stuff.
+						window.setTimeout(function() {
+
+							// Reset scroll position.
+								if (config.resetScroll)
+									$this.scrollTop(0);
+
+							// Reset forms.
+								if (config.resetForms)
+									$this.find('form').each(function() {
+										this.reset();
+									});
+
+						}, config.delay);
+
+				};
+
+			// Vendor fixes.
+				$this
+					.css('-ms-overflow-style', '-ms-autohiding-scrollbar')
+					.css('-webkit-overflow-scrolling', 'touch');
+
+			// Hide on click.
+				if (config.hideOnClick) {
+
+					$this.find('a')
+						.css('-webkit-tap-highlight-color', 'rgba(0,0,0,0)');
+
+					$this
+						.on('click', 'a', function(event) {
+
+							var $a = $(this),
+								href = $a.attr('href'),
+								target = $a.attr('target');
+
+							if (!href || href == '#' || href == '' || href == '#' + id)
+								return;
+
+							// Cancel original event.
+								event.preventDefault();
+								event.stopPropagation();
+
+							// Hide panel.
+								$this._hide();
+
+							// Redirect to href.
+								window.setTimeout(function() {
+
+									if (target == '_blank')
+										window.open(href);
+									else
+										window.location.href = href;
+
+								}, config.delay + 10);
+
+						});
+
+				}
+
+			// Event: Touch stuff.
+				$this.on('touchstart', function(event) {
+
+					$this.touchPosX = event.originalEvent.touches[0].pageX;
+					$this.touchPosY = event.originalEvent.touches[0].pageY;
+
+				})
+
+				$this.on('touchmove', function(event) {
+
+					if ($this.touchPosX === null
+					||	$this.touchPosY === null)
+						return;
+
+					var	diffX = $this.touchPosX - event.originalEvent.touches[0].pageX,
+						diffY = $this.touchPosY - event.originalEvent.touches[0].pageY,
+						th = $this.outerHeight(),
+						ts = ($this.get(0).scrollHeight - $this.scrollTop());
+
+					// Hide on swipe?
+						if (config.hideOnSwipe) {
+
+							var result = false,
+								boundary = 20,
+								delta = 50;
+
+							switch (config.side) {
+
+								case 'left':
+									result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta);
+									break;
+
+								case 'right':
+									result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta));
+									break;
+
+								case 'top':
+									result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY > delta);
+									break;
+
+								case 'bottom':
+									result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY < (-1 * delta));
+									break;
+
+								default:
+									break;
+
+							}
+
+							if (result) {
+
+								$this.touchPosX = null;
+								$this.touchPosY = null;
+								$this._hide();
+
+								return false;
+
+							}
+
+						}
+
+					// Prevent vertical scrolling past the top or bottom.
+						if (($this.scrollTop() < 0 && diffY < 0)
+						|| (ts > (th - 2) && ts < (th + 2) && diffY > 0)) {
+
+							event.preventDefault();
+							event.stopPropagation();
+
+						}
+
+				});
+
+			// Event: Prevent certain events inside the panel from bubbling.
+				$this.on('click touchend touchstart touchmove', function(event) {
+					event.stopPropagation();
+				});
+
+			// Event: Hide panel if a child anchor tag pointing to its ID is clicked.
+				$this.on('click', 'a[href="#' + id + '"]', function(event) {
+
+					event.preventDefault();
+					event.stopPropagation();
+
+					config.target.removeClass(config.visibleClass);
+
+				});
+
+		// Body.
+
+			// Event: Hide panel on body click/tap.
+				$body.on('click touchend', function(event) {
+					$this._hide(event);
+				});
+
+			// Event: Toggle.
+				$body.on('click', 'a[href="#' + id + '"]', function(event) {
+
+					event.preventDefault();
+					event.stopPropagation();
+
+					config.target.toggleClass(config.visibleClass);
+
+				});
+
+		// Window.
+
+			// Event: Hide on ESC.
+				if (config.hideOnEscape)
+					$window.on('keydown', function(event) {
+
+						if (event.keyCode == 27)
+							$this._hide(event);
+
+					});
+
+		return $this;
+
+	};
+
+	/**
+	 * Apply "placeholder" attribute polyfill to one or more forms.
+	 * @return {jQuery} jQuery object.
+	 */
+	$.fn.placeholder = function() {
+
+		// Browser natively supports placeholders? Bail.
+			if (typeof (document.createElement('input')).placeholder != 'undefined')
+				return $(this);
+
+		// No elements?
+			if (this.length == 0)
+				return $this;
+
+		// Multiple elements?
+			if (this.length > 1) {
+
+				for (var i=0; i < this.length; i++)
+					$(this[i]).placeholder();
+
+				return $this;
+
+			}
+
+		// Vars.
+			var $this = $(this);
+
+		// Text, TextArea.
+			$this.find('input[type=text],textarea')
+				.each(function() {
+
+					var i = $(this);
+
+					if (i.val() == ''
+					||  i.val() == i.attr('placeholder'))
+						i
+							.addClass('polyfill-placeholder')
+							.val(i.attr('placeholder'));
+
+				})
+				.on('blur', function() {
+
+					var i = $(this);
+
+					if (i.attr('name').match(/-polyfill-field$/))
+						return;
+
+					if (i.val() == '')
+						i
+							.addClass('polyfill-placeholder')
+							.val(i.attr('placeholder'));
+
+				})
+				.on('focus', function() {
+
+					var i = $(this);
+
+					if (i.attr('name').match(/-polyfill-field$/))
+						return;
+
+					if (i.val() == i.attr('placeholder'))
+						i
+							.removeClass('polyfill-placeholder')
+							.val('');
+
+				});
+
+		// Password.
+			$this.find('input[type=password]')
+				.each(function() {
+
+					var i = $(this);
+					var x = $(
+								$('<div>')
+									.append(i.clone())
+									.remove()
+									.html()
+									.replace(/type="password"/i, 'type="text"')
+									.replace(/type=password/i, 'type=text')
+					);
+
+					if (i.attr('id') != '')
+						x.attr('id', i.attr('id') + '-polyfill-field');
+
+					if (i.attr('name') != '')
+						x.attr('name', i.attr('name') + '-polyfill-field');
+
+					x.addClass('polyfill-placeholder')
+						.val(x.attr('placeholder')).insertAfter(i);
+
+					if (i.val() == '')
+						i.hide();
+					else
+						x.hide();
+
+					i
+						.on('blur', function(event) {
+
+							event.preventDefault();
+
+							var x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]');
+
+							if (i.val() == '') {
+
+								i.hide();
+								x.show();
+
+							}
+
+						});
+
+					x
+						.on('focus', function(event) {
+
+							event.preventDefault();
+
+							var i = x.parent().find('input[name=' + x.attr('name').replace('-polyfill-field', '') + ']');
+
+							x.hide();
+
+							i
+								.show()
+								.focus();
+
+						})
+						.on('keypress', function(event) {
+
+							event.preventDefault();
+							x.val('');
+
+						});
+
+				});
+
+		// Events.
+			$this
+				.on('submit', function() {
+
+					$this.find('input[type=text],input[type=password],textarea')
+						.each(function(event) {
+
+							var i = $(this);
+
+							if (i.attr('name').match(/-polyfill-field$/))
+								i.attr('name', '');
+
+							if (i.val() == i.attr('placeholder')) {
+
+								i.removeClass('polyfill-placeholder');
+								i.val('');
+
+							}
+
+						});
+
+				})
+				.on('reset', function(event) {
+
+					event.preventDefault();
+
+					$this.find('select')
+						.val($('option:first').val());
+
+					$this.find('input,textarea')
+						.each(function() {
+
+							var i = $(this),
+								x;
+
+							i.removeClass('polyfill-placeholder');
+
+							switch (this.type) {
+
+								case 'submit':
+								case 'reset':
+									break;
+
+								case 'password':
+									i.val(i.attr('defaultValue'));
+
+									x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]');
+
+									if (i.val() == '') {
+										i.hide();
+										x.show();
+									}
+									else {
+										i.show();
+										x.hide();
+									}
+
+									break;
+
+								case 'checkbox':
+								case 'radio':
+									i.attr('checked', i.attr('defaultValue'));
+									break;
+
+								case 'text':
+								case 'textarea':
+									i.val(i.attr('defaultValue'));
+
+									if (i.val() == '') {
+										i.addClass('polyfill-placeholder');
+										i.val(i.attr('placeholder'));
+									}
+
+									break;
+
+								default:
+									i.val(i.attr('defaultValue'));
+									break;
+
+							}
+						});
+
+				});
+
+		return $this;
+
+	};
+
+	/**
+	 * Moves elements to/from the first positions of their respective parents.
+	 * @param {jQuery} $elements Elements (or selector) to move.
+	 * @param {bool} condition If true, moves elements to the top. Otherwise, moves elements back to their original locations.
+	 */
+	$.prioritize = function($elements, condition) {
+
+		var key = '__prioritize';
+
+		// Expand $elements if it's not already a jQuery object.
+			if (typeof $elements != 'jQuery')
+				$elements = $($elements);
+
+		// Step through elements.
+			$elements.each(function() {
+
+				var	$e = $(this), $p,
+					$parent = $e.parent();
+
+				// No parent? Bail.
+					if ($parent.length == 0)
+						return;
+
+				// Not moved? Move it.
+					if (!$e.data(key)) {
+
+						// Condition is false? Bail.
+							if (!condition)
+								return;
+
+						// Get placeholder (which will serve as our point of reference for when this element needs to move back).
+							$p = $e.prev();
+
+							// Couldn't find anything? Means this element's already at the top, so bail.
+								if ($p.length == 0)
+									return;
+
+						// Move element to top of parent.
+							$e.prependTo($parent);
+
+						// Mark element as moved.
+							$e.data(key, $p);
+
+					}
+
+				// Moved already?
+					else {
+
+						// Condition is true? Bail.
+							if (condition)
+								return;
+
+						$p = $e.data(key);
+
+						// Move element back to its original location (using our placeholder).
+							$e.insertAfter($p);
+
+						// Unmark element as moved.
+							$e.removeData(key);
+
+					}
+
+			});
+
+	};
+
+})(jQuery);

+ 39 - 0
jekyll/assets/sass/base/_page.scss

@@ -0,0 +1,39 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Basic */
+
+	// MSIE: Required for IEMobile.
+		@-ms-viewport {
+			width: device-width;
+		}
+
+	// MSIE: Prevents scrollbar from overlapping content.
+		body {
+			-ms-overflow-style: scrollbar;
+		}
+
+	// Ensures page width is always >=320px.
+		@include breakpoint(xsmall) {
+			html, body {
+				min-width: 320px;
+			}
+		}
+
+	body {
+
+		background-color: _palette(invert, bg);
+
+		// Prevents animation/transition "flicker" on page load.
+		// Automatically added/removed by js/main.js.
+			&.is-loading {
+				*, *:before, *:after {
+					@include vendor('animation', 'none !important');
+					@include vendor('transition', 'none !important');
+				}
+			}
+
+	}

+ 213 - 0
jekyll/assets/sass/base/_typography.scss

@@ -0,0 +1,213 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Type */
+
+	html {
+		font-size: 16pt;
+
+		@include breakpoint(xlarge) {
+			font-size: 12pt;
+		}
+
+		@include breakpoint(large) {
+			font-size: 11pt;
+		}
+
+		@include breakpoint(xxsmall) {
+			font-size: 10pt;
+		}
+	}
+
+	body {
+		color: _palette(fg);
+	}
+
+	body, input, select, textarea {
+		font-family: _font(family);
+		font-weight: _font(weight);
+		font-size: 1rem;
+		line-height: 2.375;
+	}
+
+	a {
+		@include vendor('transition', (
+			'color #{_duration(transition)} ease-in-out',
+			'background-color #{_duration(transition)} ease-in-out',
+			'border-color #{_duration(transition)} ease-in-out',
+			'box-shadow #{_duration(transition)} ease-in-out'
+		));
+		border-bottom: dotted 1px;
+		text-decoration: none;
+
+		&:hover {
+			border-bottom-color: transparent;
+		}
+	}
+
+	strong, b {
+		font-weight: _font(weight-bold);
+	}
+
+	em, i {
+		font-style: italic;
+	}
+
+	p {
+		text-align: justify;
+		margin: 0 0 _size(element-margin) 0;
+	}
+
+	h1, h2, h3, h4, h5, h6 {
+		font-family: _font(family-heading);
+		font-weight: _font(weight-heading);
+		line-height: 1.5;
+		letter-spacing: 0.075em;
+		text-transform: uppercase;
+		margin: 0 0 (_size(element-margin) * 0.5) 0;
+
+		a {
+			border-bottom: 0;
+			color: inherit;
+			text-decoration: none;
+		}
+	}
+
+	h1 {
+		font-size: 4rem;
+		line-height: 1.1;
+		margin: 0 0 _size(element-margin) 0;
+	}
+
+	h2 {
+		font-size: 1.75rem;
+		line-height: 1.3;
+		margin: 0 0 (_size(element-margin) * 0.75) 0;
+	}
+
+	h3 {
+		font-size: 1.25rem;
+		margin: 0 0 (_size(element-margin) * 0.75) 0;
+	}
+
+	h4 {
+		font-size: 1rem;
+	}
+
+	h5 {
+		font-size: 0.9rem;
+	}
+
+	h6 {
+		font-size: 0.8rem;
+	}
+
+	sub {
+		font-size: 0.8rem;
+		position: relative;
+		top: 0.5rem;
+	}
+
+	sup {
+		font-size: 0.8rem;
+		position: relative;
+		top: -0.5rem;
+	}
+
+	blockquote {
+		border-left: solid 4px;
+		font-style: italic;
+		margin: 0 0 _size(element-margin) 0;
+		padding: (_size(element-margin) / 4) 0 (_size(element-margin) / 4) _size(element-margin);
+	}
+
+	code {
+		border-radius: _size(border-radius);
+		border: solid 2px;
+		font-family: _font(family-fixed);
+		font-size: 0.9rem;
+		margin: 0 0.25rem;
+		padding: 0.25rem 0.65rem;
+	}
+
+	pre {
+		-webkit-overflow-scrolling: touch;
+		font-family: _font(family-fixed);
+		font-size: 0.9rem;
+		margin: 0 0 _size(element-margin) 0;
+
+		code {
+			display: block;
+			line-height: 1.75;
+			padding: 1rem 1.5rem;
+			overflow-x: auto;
+		}
+	}
+
+	hr {
+		border: 0;
+		border-bottom: solid 2px;
+		margin: (_size(element-margin) * 1.5) 0;
+
+		&.major {
+			margin: (_size(element-margin) * 2.5) 0;
+		}
+	}
+
+	.align-left {
+		text-align: left;
+	}
+
+	.align-center {
+		text-align: center;
+	}
+
+	.align-right {
+		text-align: right;
+	}
+
+	@mixin color-typography($p: null) {
+		@if $p != null {
+			color: _palette($p, fg);
+		}
+
+		input, select, textarea {
+			color: _palette($p, fg-bold);
+		}
+
+		a {
+			color: _palette($p, fg-bold);
+			border-bottom-color: transparentize(_palette($p, fg), 0.5);
+
+			&:hover {
+				border-bottom-color: transparent;
+				color: _palette($p, accent) !important;
+			}
+		}
+
+		strong, b {
+			color: _palette($p, fg-bold);
+		}
+
+		h1, h2, h3, h4, h5, h6 {
+			color: _palette($p, fg-bold);
+		}
+
+		blockquote {
+			border-left-color: _palette($p, border);
+		}
+
+		code {
+			background: _palette($p, border-bg);
+			border-color: _palette($p, border);
+		}
+
+		hr {
+			border-bottom-color: _palette($p, border);
+		}
+	}
+
+	@include color-typography;

+ 34 - 0
jekyll/assets/sass/components/_box.scss

@@ -0,0 +1,34 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Box */
+
+	.box {
+		border-radius: _size(border-radius);
+		border: solid 2px;
+		margin-bottom: _size(element-margin);
+		padding: 1.5rem;
+
+		> :last-child,
+		> :last-child > :last-child,
+		> :last-child > :last-child > :last-child {
+			margin-bottom: 0;
+		}
+
+		&.alt {
+			border: 0;
+			border-radius: 0;
+			padding: 0;
+		}
+	}
+
+	@mixin color-box($p: null) {
+ 		.box {
+ 			border-color: _palette($p, border);
+ 		}
+	}
+
+	@include color-box;

+ 135 - 0
jekyll/assets/sass/components/_button.scss

@@ -0,0 +1,135 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Button */
+
+	input[type="submit"],
+	input[type="reset"],
+	input[type="button"],
+	button,
+	.button {
+		@include vendor('appearance', 'none');
+		@include vendor('transition', (
+			'background-color #{_duration(transition)} ease-in-out',
+			'box-shadow #{_duration(transition)} ease-in-out',
+			'color #{_duration(transition)} ease-in-out'
+		));
+		border: 0;
+		cursor: pointer;
+		display: inline-block;
+		font-family: _font(family-heading);
+		font-size: 0.8rem;
+		font-weight: _font(weight-heading);
+		letter-spacing: 0.075em;
+		height: 3rem;
+		line-height: 3rem;
+		padding: 0 2rem;
+		text-align: center;
+		text-decoration: none;
+		text-transform: uppercase;
+		white-space: nowrap;
+
+		&.icon {
+			&:before {
+				margin-right: 0.5rem;
+			}
+
+			&.solo {
+				position: relative;
+				width: 4rem;
+				height: 4rem;
+				line-height: 4rem;
+				border-radius: 4rem;
+				text-indent: 4rem;
+				overflow: hidden;
+				padding: 0;
+				white-space: nowrap;
+
+				&:before {
+					position: absolute;
+					display: block;
+					top: 0;
+					left: 0;
+					width: inherit;
+					height: inherit;
+					line-height: inherit;
+					font-size: 1.25rem;
+					margin-right: 0;
+					text-align: center;
+					text-indent: 0;
+				}
+			}
+		}
+
+		&.fit {
+			display: block;
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+			width: 100%;
+		}
+
+		&.small {
+			font-size: 0.7rem;
+			height: 2.5rem;
+			line-height: 2.5rem;
+			padding: 0 1.5rem;
+		}
+
+		&.big {
+			font-size: 0.9rem;
+			height: 3.5rem;
+			line-height: 3.5rem;
+			padding: 0 2.75rem;
+		}
+
+		@include breakpoint(medium) {
+			font-size: 0.9rem;
+			height: 3.25rem;
+			line-height: 3.25rem;
+
+			&.big {
+				font-size: 1rem;
+				height: 3.75rem;
+				line-height: 3.75rem;
+			}
+		}
+
+		&.disabled,
+		&:disabled {
+			@include vendor('pointer-events', 'none');
+			opacity: 0.25;
+		}
+	}
+
+	@mixin color-button($p: null) {
+		$highlight: _palette($p, highlight);
+
+		input[type="submit"],
+		input[type="reset"],
+		input[type="button"],
+		button,
+		.button {
+			background-color: transparent;
+			box-shadow: inset 0 0 0 2px _palette($p, fg-bold);
+			color: _palette($p, fg-bold) !important;
+
+			&:hover {
+				box-shadow: inset 0 0 0 2px _palette($p, accent);
+				color: _palette($p, accent) !important;
+			}
+
+			&.special {
+				background-color: _palette($p, fg-bold);
+				box-shadow: none;
+				color: _palette($p, bg) !important;
+
+				&:hover {
+					background-color: _palette($p, accent);
+				}
+			}
+		}
+	}
+
+	@include color-button;

+ 311 - 0
jekyll/assets/sass/components/_form.scss

@@ -0,0 +1,311 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Form */
+
+	$gutter: (_size(element-margin) * 0.75);
+
+	form {
+		@include vendor('display', 'flex');
+		@include vendor('flex-wrap', 'wrap');
+		width: calc(100% + #{$gutter * 2});
+		margin: ($gutter * -1) 0 _size(element-margin) ($gutter * -1);
+
+		> .field {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '0');
+			padding: $gutter 0 0 $gutter;
+			width: calc(100% - #{$gutter * 1});
+
+			&.half {
+				width: calc(50% - #{$gutter * 0.5});
+			}
+
+			&.third {
+				width: calc(#{100% / 3} - #{$gutter * (1 / 3)});
+			}
+
+			&.quarter {
+				width: calc(25% - #{$gutter * 0.25});
+			}
+		}
+
+		> .actions {
+			@include vendor('flex-grow', '0');
+			@include vendor('flex-shrink', '1');
+			margin: ($gutter * 1.25) 0 0 $gutter !important;
+			width: calc(100% - #{$gutter * 2});
+		}
+
+		&.alt {
+			display: block;
+			width: 100%;
+			margin: 0 0 _size(element-margin) 0;
+
+			> .actions {
+				margin: 0 0 _size(element-margin) 0;
+				width: 100%;
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			$gutter: (_size(element-margin) * 0.75);
+
+			width: calc(100% + #{$gutter * 2});
+			margin: ($gutter * -1) 0 _size(element-margin) ($gutter * -1);
+
+			> .field {
+				padding: $gutter 0 0 $gutter;
+				width: calc(100% - #{$gutter * 1});
+
+				&.half {
+					width: calc(100% - #{$gutter * 1});
+				}
+
+				&.third {
+					width: calc(100% - #{$gutter * 1});
+				}
+
+				&.quarter {
+					width: calc(100% - #{$gutter * 1});
+				}
+			}
+
+			> .actions {
+				margin: $gutter 0 0 $gutter;
+				width: calc(100% - #{$gutter * 2});
+			}
+		}
+	}
+
+	label {
+		display: block;
+		font-family: _font(family-heading);
+		font-weight: _font(weight-heading);
+		line-height: 1.5;
+		letter-spacing: 0.075em;
+		font-size: 0.8rem;
+		text-transform: uppercase;
+		margin: 0 0 (_size(element-margin) * 0.375) 0;
+
+		@include breakpoint(medium) {
+			font-size: 0.9rem;
+		}
+	}
+
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	select,
+	textarea {
+		@include vendor('appearance', 'none');
+		background: transparent;
+		border-radius: _size(border-radius);
+		border: solid 2px;
+		color: inherit;
+		display: block;
+		outline: 0;
+		padding: 0 1rem;
+		text-decoration: none;
+		width: 100%;
+
+		&:invalid {
+			box-shadow: none;
+		}
+	}
+
+	.select-wrapper {
+		@include icon;
+		display: block;
+		position: relative;
+
+		&:before {
+			content: '\f078';
+			display: block;
+			height: _size(element-height);
+			line-height: _size(element-height);
+			pointer-events: none;
+			position: absolute;
+			right: 0;
+			text-align: center;
+			top: 0;
+			width: _size(element-height);
+		}
+
+		select::-ms-expand {
+			display: none;
+		}
+	}
+
+	input[type="text"],
+	input[type="password"],
+	input[type="email"],
+	select {
+		height: _size(element-height);
+	}
+
+	textarea {
+		padding: 0.75rem 1rem;
+	}
+
+	input[type="checkbox"],
+	input[type="radio"], {
+		@include vendor('appearance', 'none');
+		display: block;
+		float: left;
+		margin-right: -2rem;
+		opacity: 0;
+		width: 1rem;
+		z-index: -1;
+
+		& + label {
+			@include icon;
+			cursor: pointer;
+			display: inline-block;
+			font-size: 1rem;
+			letter-spacing: 0;
+			font-family: _font(family);
+			text-transform: none;
+			font-weight: _font(weight);
+			padding-left: (_size(element-height) * 0.6) + 1rem;
+			padding-right: 1rem;
+			position: relative;
+
+			&:before {
+				border-radius: _size(border-radius);
+				border: solid 2px;
+				content: '';
+				display: inline-block;
+				height: (_size(element-height) * 0.6);
+				left: 0;
+				line-height: (_size(element-height) * 0.575);
+				position: absolute;
+				text-align: center;
+				top: -0.125rem;
+				width: (_size(element-height) * 0.6);
+			}
+		}
+
+		&:checked + label {
+			&:before {
+				content: '\f00c';
+			}
+		}
+	}
+
+	input[type="checkbox"] {
+		& + label {
+			&:before {
+				border-radius: _size(border-radius);
+			}
+		}
+	}
+
+	input[type="radio"] {
+		& + label {
+			&:before {
+				border-radius: 100%;
+			}
+		}
+	}
+
+	::-webkit-input-placeholder {
+		opacity: 1.0;
+	}
+
+	:-moz-placeholder {
+		opacity: 1.0;
+	}
+
+	::-moz-placeholder {
+		opacity: 1.0;
+	}
+
+	:-ms-input-placeholder {
+		opacity: 1.0;
+	}
+
+	.formerize-placeholder {
+		opacity: 1.0;
+	}
+
+	@mixin color-form($p: null) {
+		label {
+			color: _palette($p, fg-bold);
+		}
+
+		input[type="text"],
+		input[type="password"],
+		input[type="email"],
+		select,
+		textarea {
+			border-color: _palette($p, border);
+
+			&:focus {
+				border-color: _palette($p, accent);
+			}
+		}
+
+		select {
+			option {
+				background-color: _palette($p, bg);
+				color: _palette($p, fg);
+			}
+		}
+
+		.select-wrapper {
+			&:before {
+				color: _palette($p, border);
+			}
+		}
+
+		input[type="checkbox"],
+		input[type="radio"], {
+			& + label {
+				color: _palette($p, fg);
+
+				&:before {
+					border-color: _palette($p, border);
+				}
+			}
+
+			&:checked + label {
+				&:before {
+					background-color: _palette($p, fg-bold);
+					border-color: _palette($p, fg-bold);
+					color: _palette($p, bg);
+				}
+			}
+
+			&:focus + label {
+				&:before {
+					border-color: _palette($p, accent);
+				}
+			}
+		}
+
+		::-webkit-input-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		:-moz-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		::-moz-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		:-ms-input-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+
+		.formerize-placeholder {
+			color: _palette($p, fg-light) !important;
+		}
+	}
+
+	@include color-form;

+ 17 - 0
jekyll/assets/sass/components/_icon.scss

@@ -0,0 +1,17 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Icon */
+
+	.icon {
+		@include icon;
+		border-bottom: none;
+		position: relative;
+
+		> .label {
+			display: none;
+		}
+	}

+ 92 - 0
jekyll/assets/sass/components/_image.scss

@@ -0,0 +1,92 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Image */
+
+	.image {
+		border: 0;
+		border-radius: _size(border-radius);
+		display: inline-block;
+		position: relative;
+
+		img {
+			border-radius: _size(border-radius);
+			display: block;
+		}
+
+		&.left,
+		&.right {
+			max-width: 40%;
+
+			img {
+				width: 100%;
+			}
+		}
+
+		&.left {
+			float: left;
+			margin: 0 2rem 2rem 0;
+			top: 0.75rem;
+		}
+
+		&.right {
+			float: right;
+			margin: 0 0 2rem 2rem;
+			top: 0.75rem;
+		}
+
+		&.fit {
+			display: block;
+			margin: (_size(element-margin) * 1.25) 0;
+			width: 100%;
+
+			&:first-child {
+				margin-top: 0;
+			}
+
+			img {
+				width: 100%;
+			}
+		}
+
+		&.main {
+			display: block;
+			margin: (_size(element-margin) * 2) 0;
+			width: 100%;
+
+			&:first-child {
+				margin-top: 0;
+			}
+
+			img {
+				width: 100%;
+			}
+		}
+
+		@include breakpoint(small) {
+			&.fit {
+				margin: _size(element-margin) 0;
+			}
+
+			&.main {
+				margin: _size(element-margin) 0;
+			}
+		}
+	}
+
+	a.image {
+		overflow: hidden;
+
+		img {
+			@include vendor('transition', 'transform #{_duration(transition)} ease-out');
+		}
+
+		&:hover {
+			img {
+				@include vendor('transform', 'scale(1.05)');
+			}
+		}
+	}

+ 252 - 0
jekyll/assets/sass/components/_list.scss

@@ -0,0 +1,252 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* List */
+
+	ol {
+		list-style: decimal;
+		margin: 0 0 _size(element-margin) 0;
+		padding-left: 1.25rem;
+
+		li {
+			padding-left: 0.25rem;
+		}
+	}
+
+	ul {
+		list-style: disc;
+		margin: 0 0 _size(element-margin) 0;
+		padding-left: 1rem;
+
+		li {
+			padding-left: 0.5rem;
+		}
+
+		&.divided {
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				border-top: solid 1px;
+				padding: 0.5rem 0;
+
+				&:first-child {
+					border-top: 0;
+					padding-top: 0;
+				}
+			}
+		}
+
+		&.icons {
+			cursor: default;
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				display: inline-block;
+				padding: 0 0.5rem 0 0;
+				vertical-align: middle;
+
+				&:last-child {
+					padding-right: 0;
+				}
+
+				.icon {
+					&:before {
+						width: 2.25rem;
+						height: 2.25rem;
+						line-height: 2.25rem;
+						display: inline-block;
+						text-align: center;
+						border-radius: 100%;
+						font-size: 1.25rem;
+					}
+				}
+			}
+
+			&.alt {
+				li {
+					.icon {
+						&:before {
+							@include vendor('transition', (
+								'color #{_duration(transition)} ease-in-out',
+								'background-color #{_duration(transition)} ease-in-out',
+								'border-color #{_duration(transition)} ease-in-out',
+								'box-shadow #{_duration(transition)} ease-in-out'
+							));
+
+							font-size: 1rem;
+						}
+					}
+				}
+			}
+		}
+
+		&.actions {
+			cursor: default;
+			list-style: none;
+			padding-left: 0;
+
+			li {
+				display: inline-block;
+				padding: 0 (_size(element-margin) * 0.5) 0 0;
+				vertical-align: middle;
+
+				&:last-child {
+					padding-right: 0;
+				}
+			}
+
+			&.small {
+				li {
+					padding: 0 (_size(element-margin) * 0.25) 0 0;
+				}
+			}
+
+			&.vertical {
+				li {
+					display: block;
+					padding: (_size(element-margin) * 0.5) 0 0 0;
+
+					&:first-child {
+						padding-top: 0;
+					}
+
+					> * {
+						margin-bottom: 0;
+					}
+				}
+
+				&.small {
+					li {
+						padding: (_size(element-margin) * 0.25) 0 0 0;
+
+						&:first-child {
+							padding-top: 0;
+						}
+					}
+				}
+			}
+
+			&.fit {
+				display: table;
+				margin-left: (_size(element-margin) * -0.5);
+				padding: 0;
+				table-layout: fixed;
+				width: calc(100% + #{(_size(element-margin) * 0.5)});
+
+				li {
+					display: table-cell;
+					padding: 0 0 0 (_size(element-margin) * 0.5);
+
+					> * {
+						margin-bottom: 0;
+					}
+				}
+
+				&.small {
+					margin-left: (_size(element-margin) * -0.25);
+					width: calc(100% + #{(_size(element-margin) * 0.25)});
+
+					li {
+						padding: 0 0 0 (_size(element-margin) * 0.25);
+					}
+				}
+			}
+
+			@include breakpoint(xsmall) {
+				margin: 0 0 _size(element-margin) 0;
+
+				li {
+					padding: (_size(element-margin) * 0.5) 0 0 0;
+					display: block;
+					text-align: center;
+					width: 100%;
+
+					&:first-child {
+						padding-top: 0;
+					}
+
+					> * {
+						width: 100%;
+						margin: 0 !important;
+
+						&.icon {
+							&:before {
+								margin-left: -2rem;
+							}
+						}
+					}
+				}
+
+				&.small {
+					li {
+						padding: (_size(element-margin) * 0.25) 0 0 0;
+
+						&:first-child {
+							padding-top: 0;
+						}
+					}
+				}
+			}
+		}
+	}
+
+	dl {
+		margin: 0 0 _size(element-margin) 0;
+
+		dt {
+			display: block;
+			font-weight: _font(weight-bold);
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+		}
+
+		dd {
+			margin-left: _size(element-margin);
+		}
+	}
+
+	@mixin color-list($p: null) {
+		ul {
+			&.divided {
+				li {
+					border-top-color: _palette($p, border);
+				}
+			}
+
+			&.icons {
+				li {
+					a.icon {
+						&:hover {
+							&:before {
+								color: _palette($p, accent);
+							}
+						}
+					}
+				}
+
+				&.alt {
+					li {
+						.icon {
+							&:before {
+								box-shadow: inset 0 0 0 2px _palette($p, border);
+							}
+						}
+
+						a.icon {
+							&:hover {
+								&:before {
+									box-shadow: inset 0 0 0 2px _palette($p, accent);
+								}
+							}
+						}
+					}
+				}
+			}
+		}
+	}
+
+	@include color-list;

+ 110 - 0
jekyll/assets/sass/components/_pagination.scss

@@ -0,0 +1,110 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Pagination */
+
+	.pagination {
+		@include vendor('display', 'inline-flex');
+		@include vendor('user-select', 'none');
+		cursor: default;
+		list-style: none;
+		margin: 0 0 _size(element-margin) 2px;
+		padding: 0;
+
+		a, span {
+			@include vendor('transition', (
+				'background-color #{_duration(transition)} ease-in-out',
+				'border-color #{_duration(transition)} ease-in-out',
+				'box-shadow #{_duration(transition)} ease-in-out',
+				'color #{_duration(transition)} ease-in-out'
+			));
+			border: solid 2px;
+			display: inline-block;
+			font-family: _font(family-heading);
+			font-size: 0.8rem;
+			font-weight: _font(weight-heading);
+			height: _size(element-height);
+			letter-spacing: 0.075em;
+			letter-spacing: _font(letter-spacing-heading);
+			line-height: calc(#{_size(element-height)} - 4px);
+			margin-left: -2px;
+			min-width: _size(element-height);
+			position: relative;
+			text-align: center;
+			text-decoration: none;
+			text-transform: uppercase;
+		}
+
+		.next, .previous {
+			@include icon;
+			padding: 0 1.75rem;
+
+			&:before {
+				display: inline-block;
+				color: inherit !important;
+			}
+		}
+
+		.previous {
+			&:before {
+				content: '\f104';
+				margin-right: (0.75em / 0.8);
+			}
+		}
+
+		.next {
+			&:before {
+				content: '\f105';
+				float: right;
+				margin-left: (0.75em / 0.8);
+			}
+		}
+
+		@include breakpoint(medium) {
+			a, span {
+				font-size: 0.9rem;
+			}
+		}
+
+		@include breakpoint(xsmall) {
+			.page, .extra {
+				display: none;
+			}
+		}
+	}
+
+	@mixin color-pagination($p: null) {
+		.pagination {
+			a, span {
+				border-color: _palette($p, border);
+			}
+
+			a {
+				color: _palette($p, fg-bold) !important;
+
+				&:hover {
+					color: _palette($p, accent) !important;
+					border-color: _palette($p, accent);
+					z-index: 1;
+
+					& + a,
+					& + span {
+						border-left-color: _palette($p, accent);
+					}
+				}
+
+				&.active {
+					background-color: _palette($p, border);
+				}
+			}
+
+			span {
+				color: _palette($p, border);
+			}
+		}
+	}
+
+	@include color-pagination;

+ 112 - 0
jekyll/assets/sass/components/_section.scss

@@ -0,0 +1,112 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Section/Article */
+
+	section, article {
+		&.special {
+			text-align: center;
+		}
+	}
+
+	header {
+		cursor: default;
+
+		> .date {
+			display: block;
+			font-size: 0.8rem;
+			height: 1;
+			margin: 0 0 (_size(element-margin) * 0.5) 0;
+			position: relative;
+		}
+
+		> p {
+			font-style: italic;
+		}
+
+		> h1 + p {
+			font-size: 1.1rem;
+			margin-top: -0.5rem;
+			line-height: 2;
+		}
+
+		> h2 + p {
+			font-size: 1rem;
+			margin-top: -0.75rem;
+		}
+
+		> h3 + p {
+			font-size: 0.9rem;
+			margin-top: -0.75rem;
+		}
+
+		> h4 + p {
+			font-size: 0.8rem;
+			margin-top: -0.75rem;
+		}
+
+		&.major {
+			margin: 0 0 (_size(element-margin) * 2) 0;
+			text-align: center;
+
+			> :last-child {
+				margin-bottom: 0;
+			}
+
+			> p {
+				margin-top: 0;
+				text-align: center;
+			}
+
+			> .date {
+				font-size: 1rem;
+				margin: 0 0 (_size(element-margin) * 2) 0;
+
+				&:before, &:after {
+					content: '';
+					display: block;
+					position: absolute;
+					top: 50%;
+					width: calc(50% - 6rem);
+					border-top: solid 2px;
+				}
+
+				&:before {
+					left: 0;
+				}
+
+				&:after {
+					right: 0;
+				}
+			}
+		}
+
+		@include breakpoint(medium) {
+			br {
+				display: none;
+			}
+		}
+
+		@include breakpoint(small) {
+			&.major {
+				margin: 0 0 _size(element-margin) 0;
+			}
+		}
+	}
+
+	@mixin color-section($p: null) {
+		header {
+			&.major {
+				.date {
+					&:before, &:after {
+						border-top-color: _palette($p, border);
+					}
+				}
+			}
+		}
+	}
+
+	@include color-section;

+ 122 - 0
jekyll/assets/sass/components/_table.scss

@@ -0,0 +1,122 @@
+///
+/// Massively by HTML5 UP
+/// html5up.net | @ajlkn
+/// Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
+///
+
+/* Table */
+
+	.table-wrapper {
+		-webkit-overflow-scrolling: touch;
+		overflow-x: auto;
+	}
+
+	table {
+		margin: 0 0 _size(element-margin) 0;
+		width: 100%;
+
+		tbody {
+			tr {
+				border: solid 1px;
+				border-left: 0;
+				border-right: 0;
+			}
+		}
+
+		td {
+			padding: 0.75rem 0.75rem;
+		}
+
+		th {
+			font-family: _font(family-heading);
+			font-size: 0.8rem;
+			font-weight: _font(weight-heading);
+			letter-spacing: 0.075em;
+			line-height: 1.5;
+			padding: 0 0.75rem 0.75rem 0.75rem;
+			text-align: left;
+			text-transform: uppercase;
+
+			@include breakpoint(medium) {
+				font-size: 0.9rem;
+			}
+		}
+
+		thead {
+			border-bottom: solid 2px;
+		}
+
+		tfoot {
+			border-top: solid 2px;
+		}
+
+		&.alt {
+			border-collapse: separate;
+
+			tbody {
+				tr {
+					td {
+						border: solid 1px;
+						border-left-width: 0;
+						border-top-width: 0;
+
+						&:first-child {
+							border-left-width: 1px;
+						}
+					}
+
+					&:first-child {
+						td {
+							border-top-width: 1px;
+						}
+					}
+				}
+			}
+
+			thead {
+				border-bottom: 0;
+			}
+
+			tfoot {
+				border-top: 0;
+			}
+		}
+	}
+
+	@mixin color-table($p: null) {
+		table {
+			tbody {
+				tr {
+					border-color: _palette($p, border);