Adopt Hyde theme
diff --git a/.gitignore b/.gitignore
index 0c3e5ab..45c1505 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,3 @@
-_site/
-.sass-cache/
+_site
+.sass-cache
+.jekyll-metadata
diff --git a/_config.yml b/_config.yml
index 122fb4f..c1ae9de 100644
--- a/_config.yml
+++ b/_config.yml
@@ -1,5 +1,7 @@
title: OpenZipkin
+tagline: A distributed tracing system
+
description: >
Zipkin is a distributed tracing system. It helps gather timing data needed to
troubleshoot latency problems in microservice architectures.
diff --git a/_includes/footer.html b/_includes/footer.html
deleted file mode 100644
index 72239f1..0000000
--- a/_includes/footer.html
+++ /dev/null
@@ -1,38 +0,0 @@
-<footer class="site-footer">
-
- <div class="wrapper">
-
- <h2 class="footer-heading">{{ site.title }}</h2>
-
- <div class="footer-col-wrapper">
- <div class="footer-col footer-col-1">
- <ul class="contact-list">
- <li>{{ site.title }}</li>
- <li><a href="mailto:{{ site.email }}">{{ site.email }}</a></li>
- </ul>
- </div>
-
- <div class="footer-col footer-col-2">
- <ul class="social-media-list">
- {% if site.github_username %}
- <li>
- {% include icon-github.html username=site.github_username %}
- </li>
- {% endif %}
-
- {% if site.twitter_username %}
- <li>
- {% include icon-twitter.html username=site.twitter_username %}
- </li>
- {% endif %}
- </ul>
- </div>
-
- <div class="footer-col footer-col-3">
- <p>{{ site.description }}</p>
- </div>
- </div>
-
- </div>
-
-</footer>
diff --git a/_includes/head.html b/_includes/head.html
index 1598d6f..5ec0f5f 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -1,12 +1,27 @@
<head>
- <meta charset="utf-8">
+ <link href="http://gmpg.org/xfn/11" rel="profile">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1">
+ <meta http-equiv="content-type" content="text/html; charset=utf-8">
- <title>{% if page.title %}{{ page.title | escape }}{% else %}{{ site.title | escape }}{% endif %}</title>
- <meta name="description" content="{% if page.excerpt %}{{ page.excerpt | strip_html | strip_newlines | truncate: 160 }}{% else %}{{ site.description }}{% endif %}">
+ <!-- Enable responsiveness on mobile devices-->
+ <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
- <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 }}">
+ <title>
+ {% if page.title == "Home" %}
+ {{ site.title }} · {{ site.tagline }}
+ {% else %}
+ {{ page.title }} · {{ site.title }}
+ {% endif %}
+ </title>
+
+ <!-- CSS -->
+ <link rel="stylesheet" href="{{ site.baseurl }}public/css/poole.css">
+ <link rel="stylesheet" href="{{ site.baseurl }}public/css/syntax.css">
+ <link rel="stylesheet" href="{{ site.baseurl }}public/css/hyde.css">
+ <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700|Abril+Fatface">
+
+ <!-- Icons -->
+ <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{ site.baseurl }}public/apple-touch-icon-144-precomposed.png">
+ <link rel="shortcut icon" href="{{ site.baseurl }}public/favicon.ico">
+
</head>
diff --git a/_includes/header.html b/_includes/header.html
deleted file mode 100644
index b3f86db..0000000
--- a/_includes/header.html
+++ /dev/null
@@ -1,27 +0,0 @@
-<header class="site-header">
-
- <div class="wrapper">
-
- <a class="site-title" href="{{ site.baseurl }}/">{{ site.title }}</a>
-
- <nav class="site-nav">
- <a href="#" class="menu-icon">
- <svg viewBox="0 0 18 15">
- <path fill="#424242" 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.031C17.335,0,18,0.665,18,1.484L18,1.484z"/>
- <path fill="#424242" d="M18,7.516C18,8.335,17.335,9,16.516,9H1.484C0.665,9,0,8.335,0,7.516l0,0c0-0.82,0.665-1.484,1.484-1.484 h15.031C17.335,6.031,18,6.696,18,7.516L18,7.516z"/>
- <path fill="#424242" d="M18,13.516C18,14.335,17.335,15,16.516,15H1.484C0.665,15,0,14.335,0,13.516l0,0 c0-0.82,0.665-1.484,1.484-1.484h15.031C17.335,12.031,18,12.696,18,13.516L18,13.516z"/>
- </svg>
- </a>
-
- <div class="trigger">
- {% for my_page in site.pages %}
- {% if my_page.title %}
- <a class="page-link" href="{{ my_page.url | prepend: site.baseurl }}">{{ my_page.title }}</a>
- {% endif %}
- {% endfor %}
- </div>
- </nav>
-
- </div>
-
-</header>
diff --git a/_includes/icon-github.html b/_includes/icon-github.html
deleted file mode 100644
index e501a16..0000000
--- a/_includes/icon-github.html
+++ /dev/null
@@ -1 +0,0 @@
-<a href="https://github.com/{{ include.username }}"><span class="icon icon--github">{% include icon-github.svg %}</span><span class="username">{{ include.username }}</span></a>
diff --git a/_includes/icon-github.svg b/_includes/icon-github.svg
deleted file mode 100644
index 4422c4f..0000000
--- a/_includes/icon-github.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg viewBox="0 0 16 16"><path fill="#828282" d="M7.999,0.431c-4.285,0-7.76,3.474-7.76,7.761 c0,3.428,2.223,6.337,5.307,7.363c0.388,0.071,0.53-0.168,0.53-0.374c0-0.184-0.007-0.672-0.01-1.32 c-2.159,0.469-2.614-1.04-2.614-1.04c-0.353-0.896-0.862-1.135-0.862-1.135c-0.705-0.481,0.053-0.472,0.053-0.472 c0.779,0.055,1.189,0.8,1.189,0.8c0.692,1.186,1.816,0.843,2.258,0.645c0.071-0.502,0.271-0.843,0.493-1.037 C4.86,11.425,3.049,10.76,3.049,7.786c0-0.847,0.302-1.54,0.799-2.082C3.768,5.507,3.501,4.718,3.924,3.65 c0,0,0.652-0.209,2.134,0.796C6.677,4.273,7.34,4.187,8,4.184c0.659,0.003,1.323,0.089,1.943,0.261 c1.482-1.004,2.132-0.796,2.132-0.796c0.423,1.068,0.157,1.857,0.077,2.054c0.497,0.542,0.798,1.235,0.798,2.082 c0,2.981-1.814,3.637-3.543,3.829c0.279,0.24,0.527,0.713,0.527,1.437c0,1.037-0.01,1.874-0.01,2.129 c0,0.208,0.14,0.449,0.534,0.373c3.081-1.028,5.302-3.935,5.302-7.362C15.76,3.906,12.285,0.431,7.999,0.431z"/></svg>
diff --git a/_includes/icon-twitter.html b/_includes/icon-twitter.html
deleted file mode 100644
index e623dbd..0000000
--- a/_includes/icon-twitter.html
+++ /dev/null
@@ -1 +0,0 @@
-<a href="https://twitter.com/{{ include.username }}"><span class="icon icon--twitter">{% include icon-twitter.svg %}</span><span class="username">{{ include.username }}</span></a>
diff --git a/_includes/icon-twitter.svg b/_includes/icon-twitter.svg
deleted file mode 100644
index dcf660e..0000000
--- a/_includes/icon-twitter.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg viewBox="0 0 16 16"><path fill="#828282" d="M15.969,3.058c-0.586,0.26-1.217,0.436-1.878,0.515c0.675-0.405,1.194-1.045,1.438-1.809c-0.632,0.375-1.332,0.647-2.076,0.793c-0.596-0.636-1.446-1.033-2.387-1.033c-1.806,0-3.27,1.464-3.27,3.27 c0,0.256,0.029,0.506,0.085,0.745C5.163,5.404,2.753,4.102,1.14,2.124C0.859,2.607,0.698,3.168,0.698,3.767 c0,1.134,0.577,2.135,1.455,2.722C1.616,6.472,1.112,6.325,0.671,6.08c0,0.014,0,0.027,0,0.041c0,1.584,1.127,2.906,2.623,3.206 C3.02,9.402,2.731,9.442,2.433,9.442c-0.211,0-0.416-0.021-0.615-0.059c0.416,1.299,1.624,2.245,3.055,2.271 c-1.119,0.877-2.529,1.4-4.061,1.4c-0.264,0-0.524-0.015-0.78-0.046c1.447,0.928,3.166,1.469,5.013,1.469 c6.015,0,9.304-4.983,9.304-9.304c0-0.142-0.003-0.283-0.009-0.423C14.976,4.29,15.531,3.714,15.969,3.058z"/></svg>
diff --git a/_includes/sidebar.html b/_includes/sidebar.html
new file mode 100644
index 0000000..a15d2ea
--- /dev/null
+++ b/_includes/sidebar.html
@@ -0,0 +1,27 @@
+<div class="sidebar">
+ <div class="container sidebar-sticky">
+ <div class="sidebar-about">
+ <h1>
+ <a href="{{ site.baseurl }}">
+ <img alt="OpenZipkin logo" src="{{ site.baseurl }}public/img/zipkin-logo-200x119.jpg"
+ style="border: 10px solid white">
+ </a>
+ </h1>
+ <p class="lead">{{ site.tagline }}</p>
+ </div>
+
+ <nav class="sidebar-nav">
+
+ {% assign pages_list = site.pages %}
+ {% for node in pages_list %}
+ {% if node.title != null %}
+ {% if node.layout == "page" %}
+ <a class="sidebar-nav-item{% if page.url == node.url %} active{% endif %}" href="{{ node.url }}">{{ node.title }}</a>
+ {% endif %}
+ {% endif %}
+ {% endfor %}
+ </nav>
+
+ <p>© {{ site.time | date: '%Y' }}. All rights reserved.</p>
+ </div>
+</div>
diff --git a/_layouts/default.html b/_layouts/default.html
index e4ab96f..c438350 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -1,20 +1,15 @@
<!DOCTYPE html>
-<html>
+<html lang="en-us">
{% include head.html %}
- <body>
+ <body class="theme-base-0d">
- {% include header.html %}
+ {% include sidebar.html %}
- <div class="page-content">
- <div class="wrapper">
- {{ content }}
- </div>
+ <div class="content container">
+ {{ content }}
</div>
- {% include footer.html %}
-
</body>
-
</html>
diff --git a/_layouts/page.html b/_layouts/page.html
index ce233ad..b58da73 100644
--- a/_layouts/page.html
+++ b/_layouts/page.html
@@ -1,14 +1,14 @@
---
layout: default
---
-<article class="post">
- <header class="post-header">
- <h1 class="post-title">{{ page.title }}</h1>
- </header>
-
- <div class="post-content">
- {{ content }}
- </div>
-
-</article>
+<div class="page">
+ <h1 class="page-title">
+ {% if page.title == "Home" %}
+ Zipkin
+ {% else %}
+ {{ page.title }}
+ {% endif %}
+ </h1>
+ {{ content }}
+</div>
diff --git a/_layouts/post.html b/_layouts/post.html
index 3a0fb52..2a6c7c1 100644
--- a/_layouts/post.html
+++ b/_layouts/post.html
@@ -1,15 +1,25 @@
---
layout: default
---
-<article class="post" itemscope itemtype="http://schema.org/BlogPosting">
- <header class="post-header">
- <h1 class="post-title" itemprop="name headline">{{ page.title }}</h1>
- <p class="post-meta"><time datetime="{{ page.date | date_to_xmlschema }}" itemprop="datePublished">{{ page.date | date: "%b %-d, %Y" }}</time>{% if page.author %} • <span itemprop="author" itemscope itemtype="http://schema.org/Person"><span itemprop="name">{{ page.author }}</span></span>{% endif %}</p>
- </header>
+<div class="post">
+ <h1 class="post-title">{{ page.title }}</h1>
+ <span class="post-date">{{ page.date | date_to_string }}</span>
+ {{ content }}
+</div>
- <div class="post-content" itemprop="articleBody">
- {{ content }}
- </div>
-
-</article>
+<div class="related">
+ <h2>Related Posts</h2>
+ <ul class="related-posts">
+ {% for post in site.related_posts limit:3 %}
+ <li>
+ <h3>
+ <a href="{{ post.url }}">
+ {{ post.title }}
+ <small>{{ post.date | date_to_string }}</small>
+ </a>
+ </h3>
+ </li>
+ {% endfor %}
+ </ul>
+</div>
diff --git a/_pages/index.md b/_pages/index.md
index 5b9a0a6..b88cecf 100644
--- a/_pages/index.md
+++ b/_pages/index.md
@@ -1,3 +1,9 @@
+---
+title: Home
+---
+
+![Web interface screenshot]({{ site.baseurl }}public/img/web-screenshot.png)
+
Zipkin is a distributed tracing system. It helps gather timing data needed to
troubleshoot latency problems in microservice architectures. It manages both the
collection and lookup of this data through a Collector and a Query service.
diff --git a/about.md b/about.md
deleted file mode 100644
index d0e6de5..0000000
--- a/about.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-layout: page
-title: About
-permalink: /about/
----
-
-This is the base Jekyll theme. You can find out more info about customizing your Jekyll theme, as well as basic Jekyll usage documentation at [jekyllrb.com](http://jekyllrb.com/)
-
-You can find the source code for the Jekyll new theme at:
-{% include icon-github.html username="jglovier" %} /
-[jekyll-new](https://github.com/jglovier/jekyll-new)
-
-You can find the source code for Jekyll at
-{% include icon-github.html username="jekyll" %} /
-[jekyll](https://github.com/jekyll/jekyll)
diff --git a/css/main.scss b/css/main.scss
deleted file mode 100644
index f2e566e..0000000
--- a/css/main.scss
+++ /dev/null
@@ -1,53 +0,0 @@
----
-# Only the main Sass file needs front matter (the dashes are enough)
----
-@charset "utf-8";
-
-
-
-// Our variables
-$base-font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-$base-font-size: 16px;
-$base-font-weight: 400;
-$small-font-size: $base-font-size * 0.875;
-$base-line-height: 1.5;
-
-$spacing-unit: 30px;
-
-$text-color: #111;
-$background-color: #fdfdfd;
-$brand-color: #2a7ae2;
-
-$grey-color: #828282;
-$grey-color-light: lighten($grey-color, 40%);
-$grey-color-dark: darken($grey-color, 25%);
-
-// Width of the content area
-$content-width: 800px;
-
-$on-palm: 600px;
-$on-laptop: 800px;
-
-
-
-// Use media queries like this:
-// @include media-query($on-palm) {
-// .wrapper {
-// padding-right: $spacing-unit / 2;
-// padding-left: $spacing-unit / 2;
-// }
-// }
-@mixin media-query($device) {
- @media screen and (max-width: $device) {
- @content;
- }
-}
-
-
-
-// Import partials from `sass_dir` (defaults to `_sass`)
-@import
- "base",
- "layout",
- "syntax-highlighting"
-;
diff --git a/feed.xml b/feed.xml
deleted file mode 100644
index a6628bd..0000000
--- a/feed.xml
+++ /dev/null
@@ -1,30 +0,0 @@
----
-layout: null
----
-<?xml version="1.0" encoding="UTF-8"?>
-<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
- <channel>
- <title>{{ site.title | xml_escape }}</title>
- <description>{{ site.description | xml_escape }}</description>
- <link>{{ site.url }}{{ site.baseurl }}/</link>
- <atom:link href="{{ "/feed.xml" | prepend: site.baseurl | prepend: site.url }}" rel="self" type="application/rss+xml"/>
- <pubDate>{{ site.time | date_to_rfc822 }}</pubDate>
- <lastBuildDate>{{ site.time | date_to_rfc822 }}</lastBuildDate>
- <generator>Jekyll v{{ jekyll.version }}</generator>
- {% for post in site.posts limit:10 %}
- <item>
- <title>{{ post.title | xml_escape }}</title>
- <description>{{ post.content | xml_escape }}</description>
- <pubDate>{{ post.date | date_to_rfc822 }}</pubDate>
- <link>{{ post.url | prepend: site.baseurl | prepend: site.url }}</link>
- <guid isPermaLink="true">{{ post.url | prepend: site.baseurl | prepend: site.url }}</guid>
- {% for tag in post.tags %}
- <category>{{ tag | xml_escape }}</category>
- {% endfor %}
- {% for cat in post.categories %}
- <category>{{ cat | xml_escape }}</category>
- {% endfor %}
- </item>
- {% endfor %}
- </channel>
-</rss>
diff --git a/public/apple-touch-icon-144-precomposed.png b/public/apple-touch-icon-144-precomposed.png
new file mode 100644
index 0000000..345010c
--- /dev/null
+++ b/public/apple-touch-icon-144-precomposed.png
Binary files differ
diff --git a/public/css/hyde.css b/public/css/hyde.css
new file mode 100644
index 0000000..213e232
--- /dev/null
+++ b/public/css/hyde.css
@@ -0,0 +1,250 @@
+/*
+ * __ __
+ * /\ \ /\ \
+ * \ \ \___ __ __ \_\ \ __
+ * \ \ _ `\/\ \/\ \ /'_` \ /'__`\
+ * \ \ \ \ \ \ \_\ \/\ \_\ \/\ __/
+ * \ \_\ \_\/`____ \ \___,_\ \____\
+ * \/_/\/_/`/___/> \/__,_ /\/____/
+ * /\___/
+ * \/__/
+ *
+ * Designed, built, and released under MIT license by @mdo. Learn more at
+ * https://github.com/poole/hyde.
+ */
+
+
+/*
+ * Contents
+ *
+ * Global resets
+ * Sidebar
+ * Container
+ * Reverse layout
+ * Themes
+ */
+
+
+/*
+ * Global resets
+ *
+ * Update the foundational and global aspects of the page.
+ */
+
+html {
+ font-family: "PT Sans", Helvetica, Arial, sans-serif;
+}
+@media (min-width: 48em) {
+ html {
+ font-size: 16px;
+ }
+}
+@media (min-width: 58em) {
+ html {
+ font-size: 20px;
+ }
+}
+
+
+/*
+ * Sidebar
+ *
+ * Flexible banner for housing site name, intro, and "footer" content. Starts
+ * out above content in mobile and later moves to the side with wider viewports.
+ */
+
+.sidebar {
+ text-align: center;
+ padding: 2rem 1rem;
+ color: rgba(255,255,255,.5);
+ background-color: #202020;
+}
+@media (min-width: 48em) {
+ .sidebar {
+ position: fixed;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ width: 18rem;
+ text-align: left;
+ }
+}
+
+/* Sidebar links */
+.sidebar a {
+ color: #fff;
+}
+
+/* About section */
+.sidebar-about h1 {
+ color: #fff;
+ margin-top: 0;
+ font-family: "Abril Fatface", serif;
+ font-size: 3.25rem;
+}
+
+/* Sidebar nav */
+.sidebar-nav {
+ margin-bottom: 1rem;
+}
+.sidebar-nav-item {
+ display: block;
+ line-height: 1.75;
+}
+a.sidebar-nav-item:hover,
+a.sidebar-nav-item:focus {
+ text-decoration: underline;
+}
+.sidebar-nav-item.active {
+ font-weight: bold;
+}
+
+/* Sticky sidebar
+ *
+ * Add the `sidebar-sticky` class to the sidebar's container to affix it the
+ * contents to the bottom of the sidebar in tablets and up.
+ */
+
+@media (min-width: 48em) {
+ .sidebar-sticky {
+ position: absolute;
+ right: 1rem;
+ bottom: 1rem;
+ left: 1rem;
+ }
+}
+
+
+/* Container
+ *
+ * Align the contents of the site above the proper threshold with some margin-fu
+ * with a 25%-wide `.sidebar`.
+ */
+
+.content {
+ padding-top: 4rem;
+ padding-bottom: 4rem;
+}
+
+@media (min-width: 48em) {
+ .content {
+ max-width: 38rem;
+ margin-left: 20rem;
+ margin-right: 2rem;
+ }
+}
+
+@media (min-width: 64em) {
+ .content {
+ margin-left: 22rem;
+ margin-right: 4rem;
+ }
+}
+
+
+/*
+ * Reverse layout
+ *
+ * Flip the orientation of the page by placing the `.sidebar` on the right.
+ */
+
+@media (min-width: 48em) {
+ .layout-reverse .sidebar {
+ left: auto;
+ right: 0;
+ }
+ .layout-reverse .content {
+ margin-left: 2rem;
+ margin-right: 20rem;
+ }
+}
+
+@media (min-width: 64em) {
+ .layout-reverse .content {
+ margin-left: 4rem;
+ margin-right: 22rem;
+ }
+}
+
+
+
+/*
+ * Themes
+ *
+ * As of v1.1, Hyde includes optional themes to color the sidebar and links
+ * within blog posts. To use, add the class of your choosing to the `body`.
+ */
+
+/* Base16 (http://chriskempson.github.io/base16/#default) */
+
+/* Red */
+.theme-base-08 .sidebar {
+ background-color: #ac4142;
+}
+.theme-base-08 .content a,
+.theme-base-08 .related-posts li a:hover {
+ color: #ac4142;
+}
+
+/* Orange */
+.theme-base-09 .sidebar {
+ background-color: #d28445;
+}
+.theme-base-09 .content a,
+.theme-base-09 .related-posts li a:hover {
+ color: #d28445;
+}
+
+/* Yellow */
+.theme-base-0a .sidebar {
+ background-color: #f4bf75;
+}
+.theme-base-0a .content a,
+.theme-base-0a .related-posts li a:hover {
+ color: #f4bf75;
+}
+
+/* Green */
+.theme-base-0b .sidebar {
+ background-color: #90a959;
+}
+.theme-base-0b .content a,
+.theme-base-0b .related-posts li a:hover {
+ color: #90a959;
+}
+
+/* Cyan */
+.theme-base-0c .sidebar {
+ background-color: #75b5aa;
+}
+.theme-base-0c .content a,
+.theme-base-0c .related-posts li a:hover {
+ color: #75b5aa;
+}
+
+/* Blue */
+.theme-base-0d .sidebar {
+ background-color: #6a9fb5;
+}
+.theme-base-0d .content a,
+.theme-base-0d .related-posts li a:hover {
+ color: #6a9fb5;
+}
+
+/* Magenta */
+.theme-base-0e .sidebar {
+ background-color: #aa759f;
+}
+.theme-base-0e .content a,
+.theme-base-0e .related-posts li a:hover {
+ color: #aa759f;
+}
+
+/* Brown */
+.theme-base-0f .sidebar {
+ background-color: #8f5536;
+}
+.theme-base-0f .content a,
+.theme-base-0f .related-posts li a:hover {
+ color: #8f5536;
+}
diff --git a/public/css/poole.css b/public/css/poole.css
new file mode 100644
index 0000000..8ec27e7
--- /dev/null
+++ b/public/css/poole.css
@@ -0,0 +1,430 @@
+/*
+ * ___
+ * /\_ \
+ * _____ ___ ___\//\ \ __
+ * /\ '__`\ / __`\ / __`\\ \ \ /'__`\
+ * \ \ \_\ \/\ \_\ \/\ \_\ \\_\ \_/\ __/
+ * \ \ ,__/\ \____/\ \____//\____\ \____\
+ * \ \ \/ \/___/ \/___/ \/____/\/____/
+ * \ \_\
+ * \/_/
+ *
+ * Designed, built, and released under MIT license by @mdo. Learn more at
+ * https://github.com/poole/poole.
+ */
+
+
+/*
+ * Contents
+ *
+ * Body resets
+ * Custom type
+ * Messages
+ * Container
+ * Masthead
+ * Posts and pages
+ * Pagination
+ * Reverse layout
+ * Themes
+ */
+
+
+/*
+ * Body resets
+ *
+ * Update the foundational and global aspects of the page.
+ */
+
+* {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+}
+
+html,
+body {
+ margin: 0;
+ padding: 0;
+}
+
+html {
+ font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+ font-size: 16px;
+ line-height: 1.5;
+}
+@media (min-width: 38em) {
+ html {
+ font-size: 20px;
+ }
+}
+
+body {
+ color: #515151;
+ background-color: #fff;
+ -webkit-text-size-adjust: 100%;
+ -ms-text-size-adjust: 100%;
+}
+
+/* No `:visited` state is required by default (browsers will use `a`) */
+a {
+ color: #268bd2;
+ text-decoration: none;
+}
+a strong {
+ color: inherit;
+}
+/* `:focus` is linked to `:hover` for basic accessibility */
+a:hover,
+a:focus {
+ text-decoration: underline;
+}
+
+/* Headings */
+h1, h2, h3, h4, h5, h6 {
+ margin-bottom: .5rem;
+ font-weight: bold;
+ line-height: 1.25;
+ color: #313131;
+ text-rendering: optimizeLegibility;
+}
+h1 {
+ font-size: 2rem;
+}
+h2 {
+ margin-top: 1rem;
+ font-size: 1.5rem;
+}
+h3 {
+ margin-top: 1.5rem;
+ font-size: 1.25rem;
+}
+h4, h5, h6 {
+ margin-top: 1rem;
+ font-size: 1rem;
+}
+
+/* Body text */
+p {
+ margin-top: 0;
+ margin-bottom: 1rem;
+}
+
+strong {
+ color: #303030;
+}
+
+
+/* Lists */
+ul, ol, dl {
+ margin-top: 0;
+ margin-bottom: 1rem;
+}
+
+dt {
+ font-weight: bold;
+}
+dd {
+ margin-bottom: .5rem;
+}
+
+/* Misc */
+hr {
+ position: relative;
+ margin: 1.5rem 0;
+ border: 0;
+ border-top: 1px solid #eee;
+ border-bottom: 1px solid #fff;
+}
+
+abbr {
+ font-size: 85%;
+ font-weight: bold;
+ color: #555;
+ text-transform: uppercase;
+}
+abbr[title] {
+ cursor: help;
+ border-bottom: 1px dotted #e5e5e5;
+}
+
+/* Code */
+code,
+pre {
+ font-family: Menlo, Monaco, "Courier New", monospace;
+}
+code {
+ padding: .25em .5em;
+ font-size: 85%;
+ color: #bf616a;
+ background-color: #f9f9f9;
+ border-radius: 3px;
+}
+pre {
+ display: block;
+ margin-top: 0;
+ margin-bottom: 1rem;
+ padding: 1rem;
+ font-size: .8rem;
+ line-height: 1.4;
+ white-space: pre;
+ white-space: pre-wrap;
+ word-break: break-all;
+ word-wrap: break-word;
+ background-color: #f9f9f9;
+}
+pre code {
+ padding: 0;
+ font-size: 100%;
+ color: inherit;
+ background-color: transparent;
+}
+
+/* Pygments via Jekyll */
+.highlight {
+ margin-bottom: 1rem;
+ border-radius: 4px;
+}
+.highlight pre {
+ margin-bottom: 0;
+}
+
+/* Gist via GitHub Pages */
+.gist .gist-file {
+ font-family: Menlo, Monaco, "Courier New", monospace !important;
+}
+.gist .markdown-body {
+ padding: 15px;
+}
+.gist pre {
+ padding: 0;
+ background-color: transparent;
+}
+.gist .gist-file .gist-data {
+ font-size: .8rem !important;
+ line-height: 1.4;
+}
+.gist code {
+ padding: 0;
+ color: inherit;
+ background-color: transparent;
+ border-radius: 0;
+}
+
+/* Quotes */
+blockquote {
+ padding: .5rem 1rem;
+ margin: .8rem 0;
+ color: #7a7a7a;
+ border-left: .25rem solid #e5e5e5;
+}
+blockquote p:last-child {
+ margin-bottom: 0;
+}
+@media (min-width: 30em) {
+ blockquote {
+ padding-right: 5rem;
+ padding-left: 1.25rem;
+ }
+}
+
+img {
+ display: block;
+ max-width: 100%;
+ margin: 0 0 1rem;
+ border-radius: 5px;
+}
+
+/* Tables */
+table {
+ margin-bottom: 1rem;
+ width: 100%;
+ border: 1px solid #e5e5e5;
+ border-collapse: collapse;
+}
+td,
+th {
+ padding: .25rem .5rem;
+ border: 1px solid #e5e5e5;
+}
+tbody tr:nth-child(odd) td,
+tbody tr:nth-child(odd) th {
+ background-color: #f9f9f9;
+}
+
+
+/*
+ * Custom type
+ *
+ * Extend paragraphs with `.lead` for larger introductory text.
+ */
+
+.lead {
+ font-size: 1.25rem;
+ font-weight: 300;
+}
+
+
+/*
+ * Messages
+ *
+ * Show alert messages to users. You may add it to single elements like a `<p>`,
+ * or to a parent if there are multiple elements to show.
+ */
+
+.message {
+ margin-bottom: 1rem;
+ padding: 1rem;
+ color: #717171;
+ background-color: #f9f9f9;
+}
+
+
+/*
+ * Container
+ *
+ * Center the page content.
+ */
+
+.container {
+ max-width: 38rem;
+ padding-left: 1rem;
+ padding-right: 1rem;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+
+/*
+ * Masthead
+ *
+ * Super small header above the content for site name and short description.
+ */
+
+.masthead {
+ padding-top: 1rem;
+ padding-bottom: 1rem;
+ margin-bottom: 3rem;
+}
+.masthead-title {
+ margin-top: 0;
+ margin-bottom: 0;
+ color: #505050;
+}
+.masthead-title a {
+ color: #505050;
+}
+.masthead-title small {
+ font-size: 75%;
+ font-weight: 400;
+ color: #c0c0c0;
+ letter-spacing: 0;
+}
+
+
+/*
+ * Posts and pages
+ *
+ * Each post is wrapped in `.post` and is used on default and post layouts. Each
+ * page is wrapped in `.page` and is only used on the page layout.
+ */
+
+.page,
+.post {
+ margin-bottom: 4em;
+}
+
+/* Blog post or page title */
+.page-title,
+.post-title,
+.post-title a {
+ color: #303030;
+}
+.page-title,
+.post-title {
+ margin-top: 0;
+}
+
+/* Meta data line below post title */
+.post-date {
+ display: block;
+ margin-top: -.5rem;
+ margin-bottom: 1rem;
+ color: #9a9a9a;
+}
+
+/* Related posts */
+.related {
+ padding-top: 2rem;
+ padding-bottom: 2rem;
+ border-top: 1px solid #eee;
+}
+.related-posts {
+ padding-left: 0;
+ list-style: none;
+}
+.related-posts h3 {
+ margin-top: 0;
+}
+.related-posts li small {
+ font-size: 75%;
+ color: #999;
+}
+.related-posts li a:hover {
+ color: #268bd2;
+ text-decoration: none;
+}
+.related-posts li a:hover small {
+ color: inherit;
+}
+
+
+/*
+ * Pagination
+ *
+ * Super lightweight (HTML-wise) blog pagination. `span`s are provide for when
+ * there are no more previous or next posts to show.
+ */
+
+.pagination {
+ overflow: hidden; /* clearfix */
+ margin-left: -1rem;
+ margin-right: -1rem;
+ font-family: "PT Sans", Helvetica, Arial, sans-serif;
+ color: #ccc;
+ text-align: center;
+}
+
+/* Pagination items can be `span`s or `a`s */
+.pagination-item {
+ display: block;
+ padding: 1rem;
+ border: 1px solid #eee;
+}
+.pagination-item:first-child {
+ margin-bottom: -1px;
+}
+
+/* Only provide a hover state for linked pagination items */
+a.pagination-item:hover {
+ background-color: #f5f5f5;
+}
+
+@media (min-width: 30em) {
+ .pagination {
+ margin: 3rem 0;
+ }
+ .pagination-item {
+ float: left;
+ width: 50%;
+ }
+ .pagination-item:first-child {
+ margin-bottom: 0;
+ border-top-left-radius: 4px;
+ border-bottom-left-radius: 4px;
+ }
+ .pagination-item:last-child {
+ margin-left: -1px;
+ border-top-right-radius: 4px;
+ border-bottom-right-radius: 4px;
+ }
+}
diff --git a/public/css/syntax.css b/public/css/syntax.css
new file mode 100644
index 0000000..15ad797
--- /dev/null
+++ b/public/css/syntax.css
@@ -0,0 +1,65 @@
+.highlight .hll { background-color: #ffc; }
+.highlight .c { color: #999; } /* Comment */
+.highlight .err { color: #a00; background-color: #faa } /* Error */
+.highlight .k { color: #069; } /* Keyword */
+.highlight .o { color: #555 } /* Operator */
+.highlight .cm { color: #09f; font-style: italic } /* Comment.Multiline */
+.highlight .cp { color: #099 } /* Comment.Preproc */
+.highlight .c1 { color: #999; } /* Comment.Single */
+.highlight .cs { color: #999; } /* Comment.Special */
+.highlight .gd { background-color: #fcc; border: 1px solid #c00 } /* Generic.Deleted */
+.highlight .ge { font-style: italic } /* Generic.Emph */
+.highlight .gr { color: #f00 } /* Generic.Error */
+.highlight .gh { color: #030; } /* Generic.Heading */
+.highlight .gi { background-color: #cfc; border: 1px solid #0c0 } /* Generic.Inserted */
+.highlight .go { color: #aaa } /* Generic.Output */
+.highlight .gp { color: #009; } /* Generic.Prompt */
+.highlight .gs { } /* Generic.Strong */
+.highlight .gu { color: #030; } /* Generic.Subheading */
+.highlight .gt { color: #9c6 } /* Generic.Traceback */
+.highlight .kc { color: #069; } /* Keyword.Constant */
+.highlight .kd { color: #069; } /* Keyword.Declaration */
+.highlight .kn { color: #069; } /* Keyword.Namespace */
+.highlight .kp { color: #069 } /* Keyword.Pseudo */
+.highlight .kr { color: #069; } /* Keyword.Reserved */
+.highlight .kt { color: #078; } /* Keyword.Type */
+.highlight .m { color: #f60 } /* Literal.Number */
+.highlight .s { color: #d44950 } /* Literal.String */
+.highlight .na { color: #4f9fcf } /* Name.Attribute */
+.highlight .nb { color: #366 } /* Name.Builtin */
+.highlight .nc { color: #0a8; } /* Name.Class */
+.highlight .no { color: #360 } /* Name.Constant */
+.highlight .nd { color: #99f } /* Name.Decorator */
+.highlight .ni { color: #999; } /* Name.Entity */
+.highlight .ne { color: #c00; } /* Name.Exception */
+.highlight .nf { color: #c0f } /* Name.Function */
+.highlight .nl { color: #99f } /* Name.Label */
+.highlight .nn { color: #0cf; } /* Name.Namespace */
+.highlight .nt { color: #2f6f9f; } /* Name.Tag */
+.highlight .nv { color: #033 } /* Name.Variable */
+.highlight .ow { color: #000; } /* Operator.Word */
+.highlight .w { color: #bbb } /* Text.Whitespace */
+.highlight .mf { color: #f60 } /* Literal.Number.Float */
+.highlight .mh { color: #f60 } /* Literal.Number.Hex */
+.highlight .mi { color: #f60 } /* Literal.Number.Integer */
+.highlight .mo { color: #f60 } /* Literal.Number.Oct */
+.highlight .sb { color: #c30 } /* Literal.String.Backtick */
+.highlight .sc { color: #c30 } /* Literal.String.Char */
+.highlight .sd { color: #c30; font-style: italic } /* Literal.String.Doc */
+.highlight .s2 { color: #c30 } /* Literal.String.Double */
+.highlight .se { color: #c30; } /* Literal.String.Escape */
+.highlight .sh { color: #c30 } /* Literal.String.Heredoc */
+.highlight .si { color: #a00 } /* Literal.String.Interpol */
+.highlight .sx { color: #c30 } /* Literal.String.Other */
+.highlight .sr { color: #3aa } /* Literal.String.Regex */
+.highlight .s1 { color: #c30 } /* Literal.String.Single */
+.highlight .ss { color: #fc3 } /* Literal.String.Symbol */
+.highlight .bp { color: #366 } /* Name.Builtin.Pseudo */
+.highlight .vc { color: #033 } /* Name.Variable.Class */
+.highlight .vg { color: #033 } /* Name.Variable.Global */
+.highlight .vi { color: #033 } /* Name.Variable.Instance */
+.highlight .il { color: #f60 } /* Literal.Number.Integer.Long */
+
+.css .o,
+.css .o + .nt,
+.css .nt + .nt { color: #999; }
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 0000000..a758c7a
--- /dev/null
+++ b/public/favicon.ico
Binary files differ
diff --git a/public/img/web-screenshot.png b/public/img/web-screenshot.png
new file mode 100644
index 0000000..fb292e3
--- /dev/null
+++ b/public/img/web-screenshot.png
Binary files differ
diff --git a/public/img/zipkin-logo-200x119.jpg b/public/img/zipkin-logo-200x119.jpg
new file mode 100644
index 0000000..9bbd23f
--- /dev/null
+++ b/public/img/zipkin-logo-200x119.jpg
Binary files differ