Intial Commit

2020-01-24 16:50:29 +05:30
commit 4582790774
66 changed files with 2835 additions and 0 deletions
--- a/_sass/_animations.scss
+++ b/_sass/_animations.scss
@@ -0,0 +1,60 @@
+/*!
+Animate.css - http://daneden.me/animate
+Licensed under the MIT license - http://opensource.org/licenses/MIT
+
+Copyright (c) 2014 Daniel Eden
+*/
+
+.animated {
+  -webkit-animation-duration: 1s;
+          animation-duration: 1s;
+  -webkit-animation-fill-mode: both;
+          animation-fill-mode: both;
+}
+
+.animated.infinite {
+  -webkit-animation-iteration-count: infinite;
+          animation-iteration-count: infinite;
+}
+
+.animated.hinge {
+  -webkit-animation-duration: 2s;
+          animation-duration: 2s;
+}
+
+@-webkit-keyframes fadeInDown {
+  0% {
+    opacity: 0;
+    -webkit-transform: translateY(-20px);
+            transform: translateY(-20px);
+  }
+
+  100% {
+    opacity: 1;
+    -webkit-transform: translateY(0);
+            transform: translateY(0);
+  }
+}
+
+@keyframes fadeInDown {
+  0% {
+    opacity: 0;
+
+    -webkit-transform: translateY(-20px) translate3d(0, 0, 0);
+        -ms-transform: translateY(-20px) translate3d(0, 0, 0);
+            transform: translateY(-20px) translate3d(0, 0, 0);
+  }
+
+  100% {
+    opacity: 1;
+
+    -webkit-transform: translateY(0) translate3d(0, 0, 0);
+        -ms-transform: translateY(0) translate3d(0, 0, 0);
+            transform: translateY(0) translate3d(0, 0, 0);
+  }
+}
+
+.fade-in-down {
+  -webkit-animation-name: fadeInDown;
+          animation-name: fadeInDown;
+}
--- a/_sass/_base.scss
+++ b/_sass/_base.scss
@@ -0,0 +1,34 @@
+@charset "UTF-8";
+/*!
+
+Pixyll
+
+A simple, beautiful theme for Jekyll that emphasizes content rather than
+aesthetic fluff.
+
+Built upon BASSCSS (http://jxnblk.github.io/basscss).
+
+Crafted with <3 by John Otander (@4lpine) - ©2015-2019 John Otander
+MIT License http://opensource.org/licenses/MIT
+
+*/
+
+html, body {
+  height: auto;
+  min-height: 100%;
+}
+
+img {
+  max-width: 100%;
+}
+
+em img {
+  max-width: 100%;
+  margin-left: 0;
+}
+
+body {
+          box-sizing: border-box;
+     -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+}
--- a/_sass/_basscss.scss
+++ b/_sass/_basscss.scss
@@ -0,0 +1,25 @@
+/*!
+
+  BASSCSS
+
+  Next-level CSS toolkit - basscss.com
+
+  Made with love by Jxnblk - ©2014 Brent Jackson
+  MIT License http://opensource.org/licenses/MIT
+
+*/
+
+@import 'basscss/base-buttons';
+@import 'basscss/base-forms';
+@import 'basscss/base-reset';
+@import 'basscss/base-typography';
+
+@import 'basscss/buttons-blue';
+
+@import 'basscss/syntax-highlighting';
+@import 'basscss/color-base';
+@import 'basscss/colors';
+
+@import 'basscss/utility-headings';
+@import 'basscss/utility-typography';
+@import 'basscss/utility-white-space';
--- a/_sass/_blockquotes.scss
+++ b/_sass/_blockquotes.scss
@@ -0,0 +1,16 @@
+blockquote {
+  border-left: 5px solid #7a7a7a;
+  font-style: italic;
+  margin-left: $space-1;
+  padding: $space-1;
+}
+
+blockquote footer {
+  background-color: #fff;
+  border-color: transparent;
+  color: #7a7a7a;
+  font-size: .85rem;
+  font-style: normal;
+  text-align: left;
+  padding: 0;
+}
--- a/_sass/_clearfix.scss
+++ b/_sass/_clearfix.scss
@@ -0,0 +1,8 @@
+.clearfix:before, .clearfix:after {
+  content: ' ';
+  display: table;
+}
+
+.clearfix:after {
+  clear: both;
+}
--- a/_sass/_code.scss
+++ b/_sass/_code.scss
@@ -0,0 +1,82 @@
+pre,
+pre code {
+  background-color: transparent;
+  border-radius: $pre-border-radius;
+}
+
+pre,
+code {
+  font-family: $monospace-font-family;
+}
+
+code {
+  color: #bf616a;
+}
+
+p {
+  code {
+    background-color: #f9f9f9;
+    border-radius: 3px;
+    padding: .25em .5em;
+  }
+}
+
+pre {
+  padding: 1.125em;
+  line-height: 1.11;
+  overflow-x: scroll;
+  margin-bottom: 0.88em;
+  background-color: $pre-background-color;
+}
+
+.highlight {
+  margin: 1rem 0;
+}
+
+.highlight .p {
+  font-size: 1.125rem;
+  line-height: 1;
+}
+
+pre {
+    counter-reset: line-numbering;
+    white-space: pre;
+    overflow-x: auto;
+    word-break: inherit;
+    word-wrap: inherit;
+}
+
+pre a {
+    background-image: none;
+}
+
+pre a::before {
+  content: counter(line-numbering);
+  counter-increment: line-numbering;
+  padding-right: 1em; /* space after numbers */
+  width: 25px;
+  text-align: right;
+  opacity: 0.7;
+  display: inline-block;
+  color: $light-gray;
+  margin-right: 16px;
+  font-size: 13px;
+  -webkit-touch-callout: none;
+  -webkit-user-select: none;
+  -khtml-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+}
+
+pre a:first-of-type::before {
+  padding-top: 10px;
+}
+
+pre a:last-of-type::before {
+  padding-bottom: 10px;
+}
+
+pre a:only-of-type::before {
+  padding: 10px;
+}
--- a/_sass/_footer.scss
+++ b/_sass/_footer.scss
@@ -0,0 +1,38 @@
+.site {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+  -webkit-flex-direction: column;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  min-height: 100vh;
+}
+
+.site-wrap {
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+      -ms-flex: 1 0 auto;
+          flex: 1 0 auto;
+  padding-bottom: $h1-responsive-max;
+}
+
+footer {
+  background-color: $footer-bg-color;
+  border-top: $footer-border-top;
+  color: $footer-color;
+  font-size: $footer-font-size;
+  font-weight: $footer-font-weight;
+  padding: $space-2 $footer-padding;
+  text-align: center;
+}
+
+footer .measure {
+  line-height: $space-2;
+}
+
+footer small {
+  font-family: $heading-font-family;
+}
--- a/_sass/_forms.scss
+++ b/_sass/_forms.scss
@@ -0,0 +1,106 @@
+input,
+select,
+textarea,
+fieldset {
+  font-size: $form-field-font-size;
+  margin-top: 0;
+  margin-bottom: $space-1;
+}
+
+input[type=text],
+input[type=datetime],
+input[type=datetime-local],
+input[type=email],
+input[type=month],
+input[type=number],
+input[type=password],
+input[type=search],
+input[type=tel],
+input[type=time],
+input[type=url],
+input[type=week] {
+  box-sizing: border-box;
+  height: $form-field-height;
+  padding: $form-field-padding-y $form-field-padding-x;
+  vertical-align: middle;
+  -webkit-appearance: none;
+}
+
+select {
+  box-sizing: border-box;
+  line-height: 1.75;
+  padding: $form-field-padding-y $form-field-padding-x;
+}
+
+select:not([multiple]) {
+  height: $form-field-height;
+  vertical-align: middle;
+}
+
+textarea {
+  box-sizing: border-box;
+  line-height: 1.75;
+  padding: $form-field-padding-y $form-field-padding-x;
+}
+
+.form-stacked input,
+.form-stacked textarea,
+.form-stacked select {
+  width: 100%;
+}
+
+.field-light {
+  background-color: white;
+  transition: box-shadow .2s ease;
+  border-style: solid;
+  border-width: $border-width;
+  border-color: $border-color;
+  border-radius: $border-radius;
+}
+
+.field-light:focus {
+  outline: none;
+  border-color: $blue;
+  box-shadow: 0 0 2px rgba($blue,.5);
+}
+
+.field-light:disabled {
+  color: $mid-gray;
+  background-color: $darken-2;
+}
+
+.field-light:read-only:not(select) {
+  background-color: $darken-2;
+}
+
+.field-light:invalid {
+  border-color: $red;
+}
+
+.field-light.is-success {
+  border-color: $green;
+}
+
+.field-light.is-warning {
+  border-color: $yellow;
+}
+
+.field-light.is-error {
+  border-color: $red;
+}
+
+
+.radio-light,
+.checkbox-light {
+  transition: box-shadow .2s ease;
+}
+
+.radio-light {
+  border-radius: 50%;
+}
+
+.radio-light:focus,
+.checkbox-light:focus {
+  outline: none;
+  box-shadow: 0 0 2px rgba($blue, .5);
+}
--- a/_sass/_gists.scss
+++ b/_sass/_gists.scss
@@ -0,0 +1,12 @@
+.gist,
+.gist .highlight .p {
+  font-size: .75rem;
+}
+
+.gist .lines {
+  width: 100%;
+}
+
+.gist table>tbody>tr>td {
+  border-top: 0px;
+}
--- a/_sass/_header.scss
+++ b/_sass/_header.scss
@@ -0,0 +1,65 @@
+.site-header {
+  padding-top: $space-1;
+  padding-bottom: $space-2;
+}
+
+.share-page {
+  padding: $space-2 0;
+}
+
+.share-links a {
+  margin: 0 0.2em;
+}
+
+.site-header a,
+.social-icons a,
+.share-links a {
+  color: $header-color;
+  font-size: $h3;
+  font-weight: $header-font-weight;
+  background-image: none;
+}
+
+.site-header .site-title {
+  font-size: $h2;
+}
+
+.site-header nav a {
+  color: $nav-color;
+}
+
+.site-header nav a:hover,
+.site-header nav a:focus,
+.site-header nav a:active,
+.site-header nav a.nav-active:hover,
+.site-header nav a.nav-active:focus,
+.site-header nav a.nav-active:active {
+  color: $nav-link-color;
+  opacity: 1;
+  border-bottom: $nav-link-border-bottom;
+}
+
+.site-header nav a.nav-active {
+  border-bottom: $nav-active-border-bottom;
+}
+
+.site-nav a + a {
+  margin-left: $nav-link-padding-x;
+}
+
+.site-header a:hover,
+.posts .post a:hover .post-meta,
+.posts .post a:hover .post-title,
+.posts .post a:hover .post-summary,
+.social-icons a:hover,
+.share-links a:hover {
+  opacity: 0.88;
+}
+
+.site-header {
+  text-align: center;
+}
+
+.site-header .site-nav {
+  text-align: center;
+}
--- a/_sass/_links.scss
+++ b/_sass/_links.scss
@@ -0,0 +1,40 @@
+a {
+  color: $link-color;
+  background-image: linear-gradient(to top,
+    rgba(0,0,0,0) 13%,
+    rgba($link-color,.8) 13%,
+    rgba($link-color,.8) 18%,
+    rgba(0,0,0,0) 17%
+  );
+  text-shadow: white 1px 0px 0px, white -1px 0px 0px;
+}
+
+a:hover,
+a:focus,
+a:active {
+  border: 0;
+  color: $link-hover-color;
+  text-decoration: none;
+  background-image: linear-gradient(to top,
+    rgba(0,0,0,0) 13%,
+    rgba($link-hover-color,.8) 13%,
+    rgba($link-hover-color,.8) 17%,
+    rgba(0,0,0,0) 17%
+  );
+  text-shadow: white 1px 0px 0px, white -1px 0px 0px;
+}
+
+// Correct issues with buttons
+button,
+.button {
+  text-shadow: none;
+  background-image: none;
+}
+
+.button:hover,
+.button:focus,
+.button:active {
+  color: white;
+  text-shadow: none;
+  background-image: none;
+}
--- a/_sass/_measure.scss
+++ b/_sass/_measure.scss
@@ -0,0 +1,4 @@
+.measure {
+  margin: 0 auto;
+  max-width: $measure-width;
+}
--- a/_sass/_media-queries.scss
+++ b/_sass/_media-queries.scss
@@ -0,0 +1,59 @@
+@media screen and (min-width: $viewport-small) {
+  html {
+    font-size: 16px;
+  }
+
+  h1,
+  .h1 {
+    font-size: $h1;
+  }
+
+  .site-header {
+    text-align: left;
+  }
+
+  .site-nav {
+    margin-top: 0;
+  }
+
+  .site-header a,
+  .social-icons a,
+  .share-links a {
+    font-size: $h5;
+  }
+
+  .site-header .site-title {
+    font-size: $h4;
+    float: left;
+    font-weight: $bold-font-weight;
+  }
+
+  .site-header .site-nav {
+    float: right;
+    margin-top: .25rem;
+  }
+
+  blockquote {
+    margin: 0 0 0 $space-2;
+    padding: $space-2 $space-1 + $space-2;
+  }
+}
+
+@media screen and (min-width: $viewport-medium) {
+  html {
+    font-size: 18px;
+  }
+}
+
+@media screen and (min-width: $viewport-large) {
+  html {
+    font-size: 20px;
+  }
+}
+
+@media screen and (min-width: $viewport-large + 14) {
+  em img {
+    max-width: $measure-width + 14;
+    margin-left: -7em;
+  }
+}
--- a/_sass/_pagination.scss
+++ b/_sass/_pagination.scss
@@ -0,0 +1,53 @@
+.pagination {
+  font-size: $h5;
+  font-family: $heading-font-family;
+  font-weight: 300;
+  text-align: center;
+}
+
+.pagination a, .pagination .disabled {
+  -webkit-transition: all 0.2s ease-in-out;
+  -moz-transition: all 0.2s ease-in-out;
+  transition: all 0.2s ease-in-out;
+  background: #fafafa;
+  border-radius: 0.1875em;
+  border: 1px solid #f3f3f3;
+  color: #333333;
+  padding: .75em 1.5em;
+  font-size: $h5;
+}
+
+.pagination .disabled, .pagination .pagination-meta {
+  opacity: 0.5;
+}
+
+.pagination .pagination-meta {
+  overflow: hidden;
+}
+
+.pagination a:hover, .pagination a:focus {
+  background: white;
+  color: #477dca;
+}
+
+.pagination a:active {
+  background: #f7f7f7;
+}
+
+.pagination .button {
+  font-size: 1rem;
+  font-weight: 300;
+  letter-spacing: 1px;
+}
+
+.button-disabled {
+  opacity: 0.55;
+  background-color: #999;
+}
+
+.button-disabled:hover,
+.button-disabled:active,
+.button-disabled:focus {
+  cursor: not-allowed;
+  background-color: #999;
+}
--- a/_sass/_positions.scss
+++ b/_sass/_positions.scss
@@ -0,0 +1,7 @@
+.left {
+  float: left;
+}
+
+.right {
+  float: right;
+}
--- a/_sass/_posts.scss
+++ b/_sass/_posts.scss
@@ -0,0 +1,67 @@
+
+.posts {
+  margin: 0;
+}
+
+.posts .post {
+  margin-bottom: 0.75em;
+  border-bottom: thin solid #f3f3f3;
+}
+
+.posts .post:last-child {
+  border-bottom: none;
+  margin-bottom: .375em;
+  padding-bottom: 0;
+}
+
+.post-link .post-title {
+  margin-top: 0;
+  font-weight: 600;
+  color: #333;
+}
+
+.post-footer {
+  @extend .italic;
+
+  margin-top: .75rem;
+  text-align: center;
+}
+
+.post-footer .avatar {
+  margin: 2rem 0;
+  width: 100px;
+  border-radius: 50%;
+}
+
+.meta,
+.post-meta {
+  width: auto;
+  font-weight: 300;
+  margin: 0;
+  padding: .25em 0;
+  color: #7a7a7a;
+  font-size: $h6;
+}
+
+.post-summary {
+  line-height: $h1;
+}
+
+.related-post-title {
+  padding-bottom: 0.25em;
+  border-bottom: thin solid #f3f3f3;
+}
+
+.related-posts {
+  line-height: $h1;
+  padding-top: $space-2;
+}
+
+.related-posts a {
+  color: $dark-gray;
+  background-image: none;
+}
+
+.related-posts a:hover {
+  text-decoration: underline;
+}
--- a/_sass/_social-icons.scss
+++ b/_sass/_social-icons.scss
@@ -0,0 +1,18 @@
+.social-icons {
+  font-size: 1.25rem;
+}
+
+.social-icons a.fa {
+  cursor: pointer;
+  opacity: 0.8;
+  padding: 0 0.2em;
+}
+
+.social-icons a.fa:hover {
+  opacity: 1;
+}
+
+.social-icons iframe[title=Flattr] {
+  position: relative;
+  top: 0.1em;
+}
--- a/_sass/_tables.scss
+++ b/_sass/_tables.scss
@@ -0,0 +1,47 @@
+/*
+  Table styles copied from Bootstrap
+  Copyright (c) 2013 Twitter, Inc
+*/
+
+table {
+  width: 100%;
+  max-width: 100%;
+  margin-bottom: 1.5rem;
+  font-size: 1.125rem;
+  overflow-x:auto;
+  display:block;
+  // Cells
+  > thead,
+  > tbody,
+  > tfoot {
+    > tr {
+      > th,
+      > td {
+        padding: 12px;
+        line-height: 1.2;
+        vertical-align: top;
+        border-top: 1px solid #333;
+      }
+    }
+  }
+  // Bottom align for column headings
+  > thead > tr > th {
+    vertical-align: bottom;
+    border-bottom: 2px solid #333;
+  }
+  // Remove top border from thead by default
+  > caption + thead,
+  > colgroup + thead,
+  > thead:first-child {
+    > tr:first-child {
+      > th,
+      > td {
+        border-top: 0;
+      }
+    }
+  }
+  // Account for multiple tbody instances
+  > tbody + tbody {
+    border-top: 2px solid #333;
+  }
+}
--- a/_sass/_typography.scss
+++ b/_sass/_typography.scss
@@ -0,0 +1,24 @@
+html {
+  font-size: $base-font-size;
+}
+
+abbr {
+  border-bottom: $abbr-border-bottom;
+  cursor: help;
+}
+
+p {
+  color: #333;
+  line-height: 1.5;
+}
+
+small,
+.small {
+  font-size: 0.707rem;
+}
+
+sup {
+  position: relative;
+  vertical-align: middle;
+  top: -0.9ex;
+}
--- a/_sass/_variables.scss
+++ b/_sass/_variables.scss
@@ -0,0 +1,134 @@
+// Typography
+$base-font-size: 14px !default;
+$bold-font-weight: bold !default;
+$font-family: 'Merriweather', 'PT Serif', Georgia, 'Times New Roman', serif !default;
+$line-height: 1.5 !default;
+$heading-font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif !default;
+$heading-font-weight: 900 !default;
+$heading-line-height: 1.25 !default;
+$monospace-font-family: 'Source Code Pro', Consolas, monospace !default;
+$h1: 1.5rem !default;
+$h2: 1.5rem !default;
+$h3: 1.25rem !default;
+$h4: 1rem !default;
+$h5: .875rem !default;
+$h6: .75rem !default;
+$h00: 4rem !default;
+$h0: 3rem !default;
+$h00-responsive: 8vw !default;
+$h0-responsive: 6vw !default;
+$h1-responsive: 4vw !default;
+$h00-responsive-max: 7.68rem !default;
+$h0-responsive-max: 5.76rem !default;
+$h1-responsive-max: 3.84rem !default;
+$abbr-border-bottom: 1px black dotted;
+
+// Page width
+$measure-width: 42rem !default;
+
+// Viewport widths
+$viewport-small: 32em;
+$viewport-medium: 48em;
+$viewport-large: 64em;
+
+// Colors
+$blue: #0076df !default;
+$red: #f95020 !default;
+$green: #00cf26 !default;
+$yellow: #efcc00 !default;
+$orange: #ffcc22 !default;
+$purple: #f92080 !default;
+$dark-blue: #00369f !default;
+$green: #00ab37 !default;
+$dark-green: #009f06 !default;
+$light-pink: #ffdddd !default;
+$light-green: #ddffdd !default;
+$dark-gray: #444 !default;
+$mid-gray: #777 !default;
+$light-gray: #ccc !default;
+$lighter-gray: #eee !default;
+$darken-1: rgba(#000,.0625) !default;
+$darken-2: rgba(#000,.125) !default;
+$darken-3: rgba(#000,.25) !default;
+$darken-4: rgba(#000,.5) !default;
+
+// Links
+$link-color: $blue;
+$link-hover-color: darken($blue, 40%);
+
+// Breakpoints
+$breakpoint-md: '(min-width: 52em)';
+$breakpoint-xl: '(min-width: 96em)';
+
+// Whitespace
+$space-1: .5rem !default;
+$space-2: 1rem !default;
+$space-3: 2rem !default;
+$space-4: 4rem !default;
+
+// Buttons
+$button-font-size: inherit !default;
+$button-font-weight: normal !default;
+$button-line-height: 1.125rem !default;
+$button-padding-y: .5rem !default;
+$button-padding-x: 1rem !default;
+$button-font-family: $heading-font-family;
+
+// Forms
+$form-field-font-size: 1rem !default;
+$form-field-height: 2.25rem !default;
+$form-field-padding-y: .5rem !default;
+$form-field-padding-x: .5rem !default;
+
+// Borders
+$border-color: $light-gray !default;
+$border-width: 1px !default;
+$border-radius: 3px !default;
+
+// Forms
+$form-field-font-size: 1rem;
+$form-field-height: 2.25rem;
+$form-field-padding-y: .5rem;
+$form-field-padding-x: .5rem;
+
+// Code
+$pre-border-radius: 0;
+$pre-background-color: #fafafa;
+$hljs-comment: $mid-gray;
+$hljs-keyword: $dark-blue;
+$hljs-name: $dark-gray;
+$hljs-number: $dark-green;
+$hljs-string: $red;
+$hljs-title: $red;
+$hljs-type: $dark-blue;
+$hljs-tag: $dark-blue;
+$hljs-attribute: $dark-green;
+$hljs-regexp: $dark-green;
+$hljs-symbol: $purple;
+$hljs-built-in: $dark-blue;
+$hljs-preprocessor: $mid-gray;
+$hljs-deletion: $light-pink;
+$hljs-addition: $light-green;
+$hljs-change: $dark-blue;
+$hljs-chunk: $light-gray;
+
+// Header
+$header-border-top: thin solid #f3f3f3;
+$header-color: $dark-gray;
+$header-bg-color: #fafafa;
+$header-font-weight: 300;
+
+// Nav
+$nav-color: $mid-gray;
+$nav-link-color: #444;
+$nav-link-padding-x: $space-2;
+$nav-link-border-bottom: 2px solid #444;
+$nav-active-border-bottom: 1px solid $light-gray;
+
+// Footer
+$footer-border-top: thin solid #f3f3f3;
+$footer-padding: $space-3;
+$footer-color: #7a7a7a;
+$footer-bg-color: #fafafa;
+$footer-font-weight: 300;
+$footer-font-size: .75rem;
--- a/_sass/basscss/_base-buttons.scss
+++ b/_sass/basscss/_base-buttons.scss
@@ -0,0 +1,29 @@
+/* Basscss Base Buttons */
+
+button,
+.button {
+  font-family: $button-font-family;
+  font-size: $button-font-size;
+  font-weight: $button-font-weight;
+  text-decoration: none;
+  cursor: pointer;
+  display: inline-block;
+  box-sizing: border-box;
+  line-height: $button-line-height;
+  padding: $button-padding-y $button-padding-x;
+  margin: 0;
+  height: auto;
+  border: 1px solid transparent;
+  vertical-align: middle;
+  -webkit-appearance: none;
+}
+
+::-moz-focus-inner {
+  border: 0;
+  padding: 0;
+}
+
+.button:hover {
+  text-decoration: none;
+  border: 1px solid transparent;
+}
--- a/_sass/basscss/_base-forms.scss
+++ b/_sass/basscss/_base-forms.scss
@@ -0,0 +1,57 @@
+/* Basscss Base Forms */
+
+input,
+select,
+textarea,
+fieldset {
+  font-size: $form-field-font-size;
+  margin-top: 0;
+  margin-bottom: $space-1;
+}
+
+input[type=text],
+input[type=datetime],
+input[type=datetime-local],
+input[type=email],
+input[type=month],
+input[type=number],
+input[type=password],
+input[type=search],
+input[type=tel],
+input[type=time],
+input[type=url],
+input[type=week] {
+  box-sizing: border-box;
+  height: $form-field-height;
+  padding: $form-field-padding-y $form-field-padding-x;
+  vertical-align: middle;
+  -webkit-appearance: none;
+}
+
+select {
+  box-sizing: border-box;
+  line-height: 1.75;
+  padding: $form-field-padding-y $form-field-padding-x;
+}
+
+select:not([multiple]) {
+  height: $form-field-height;
+  vertical-align: middle;
+}
+
+textarea {
+  box-sizing: border-box;
+  line-height: 1.75;
+  padding: $form-field-padding-y $form-field-padding-x;
+}
+
+.fieldset-reset {
+  padding: 0;
+  margin-left: 0;
+  margin-right: 0;
+  border: 0;
+}
+
+.fieldset-reset legend {
+  padding: 0;
+}
--- a/_sass/basscss/_base-reset.scss
+++ b/_sass/basscss/_base-reset.scss
@@ -0,0 +1,20 @@
+body,
+button {
+  margin: 0;
+}
+
+button,
+input,
+select,
+textarea {
+  font-family: inherit;
+  font-size: 100%;
+}
+
+img {
+  max-width: 100%;
+}
+
+svg {
+  max-height: 100%;
+}
--- a/_sass/basscss/_base-typography.scss
+++ b/_sass/basscss/_base-typography.scss
@@ -0,0 +1,101 @@
+/* Basscss Base Typography */
+
+body {
+  font-family: $font-family;
+  line-height: $line-height;
+  font-size: 88%;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: $heading-font-family;
+  font-weight: $heading-font-weight;
+  line-height: $heading-line-height;
+  margin-top: 1em;
+  margin-bottom: .5em;
+}
+
+p,
+dl,
+ol,
+ul {
+  font-size: $h5;
+  margin-top: 0;
+  margin-bottom: $space-2;
+}
+
+ol,
+ul {
+  padding-left: $space-3;
+}
+
+pre,
+code,
+samp {
+  font-family: $monospace-font-family;
+  font-size: inherit;
+}
+
+pre {
+  margin-top: 0;
+  margin-bottom: $space-2;
+  overflow-x: scroll;
+}
+
+hr {
+  margin-top: $space-3;
+  margin-bottom: $space-3;
+}
+
+blockquote {
+  margin-top: $space-3;
+  margin-bottom: $space-3;
+  margin-left: 0;
+  padding-left: $space-2;
+  padding-right: $space-2;
+}
+
+blockquote,
+blockquote p {
+  font-size: $h3;
+  font-style: italic;
+}
+
+h1,
+.h1 {
+  font-size: $h1;
+}
+
+h2,
+.h2 {
+  font-size: $h2;
+}
+
+h3,
+.h3 {
+  font-size: $h3;
+}
+
+h4,
+.h4 {
+  font-size: $h4;
+}
+
+h5,
+.h5 {
+  font-size: $h5;
+}
+
+h6,
+.h6 {
+  font-size: $h6;
+}
+
+.list-reset {
+  list-style: none;
+  padding-left: 0;
+}
--- a/_sass/basscss/_buttons-blue.scss
+++ b/_sass/basscss/_buttons-blue.scss
@@ -0,0 +1,27 @@
+.button-blue {
+  color: white;
+  background-color: $blue;
+  border-radius: $border-radius;
+  transition-duration: .1s;
+  transition-timing-function: ease-out;
+  transition-property: box-shadow, background-color;
+}
+
+.button-blue:hover {
+  opacity: .875;
+}
+
+.button-blue:active,
+.button-blue.is-active {
+  box-shadow: inset 0 0 0 32px rgba(#000,.125), inset 0 2px 3px 0 rgba(#000,.25);
+}
+
+.button-blue:focus {
+  outline: none;
+  box-shadow: 0 0 0 2px rgba(white, .5), 0 0 1px 4px rgba($blue, .5);
+}
+
+.button-blue:disabled,
+.button-blue.is-disabled {
+  opacity: .5;
+}
--- a/_sass/basscss/_color-base.scss
+++ b/_sass/basscss/_color-base.scss
@@ -0,0 +1,28 @@
+/* Basscss Color Base */
+
+body {
+  color: $dark-gray;
+  background-color: white;
+}
+
+a {
+  color: $blue;
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+pre,
+code {
+  background-color: $lighter-gray;
+  border-radius: $border-radius;
+}
+
+hr {
+  border: 0;
+  border-bottom-style: solid;
+  border-bottom-width: $border-width;
+  border-bottom-color: $border-color;
+}
--- a/_sass/basscss/_colors.scss
+++ b/_sass/basscss/_colors.scss
@@ -0,0 +1,97 @@
+/* Basscss Colors */
+
+.dark-gray {
+  color: $dark-gray;
+}
+
+.white {
+  color: white;
+}
+
+.blue {
+  color: $blue;
+}
+
+.mid-gray {
+  color: $mid-gray;
+}
+
+.light-gray {
+  color: $light-gray;
+}
+
+.lighter-gray {
+  color: $lighter-gray;
+}
+
+.red {
+  color: $red;
+}
+
+.green {
+  color: $green;
+}
+
+.yellow {
+  color: $yellow;
+}
+
+.orange {
+  color: $orange;
+}
+
+.bg-dark-gray {
+  background-color: $dark-gray;
+}
+
+.bg-white {
+  background-color: white;
+}
+
+.bg-blue {
+  background-color: $blue;
+}
+
+.bg-mid-gray {
+  background-color: $mid-gray;
+}
+
+.bg-light-gray {
+  background-color: $light-gray;
+}
+
+.bg-lighter-gray {
+  background-color: $lighter-gray;
+}
+
+.bg-red {
+  background-color: $red;
+}
+
+.bg-green {
+  background-color: $green;
+}
+
+.bg-yellow {
+  background-color: $yellow;
+}
+
+.bg-orange {
+  background-color: $orange;
+}
+
+.bg-darken-1 {
+  background-color: $darken-1;
+}
+
+.bg-darken-2 {
+  background-color: $darken-2;
+}
+
+.bg-darken-3 {
+  background-color: $darken-3;
+}
+
+.bg-darken-4 {
+  background-color: $darken-4;
+}
--- a/_sass/basscss/_syntax-highlighting.scss
+++ b/_sass/basscss/_syntax-highlighting.scss
@@ -0,0 +1,119 @@
+.highlight {
+  -webkit-text-size-adjust: none;
+}
+
+.highlight .c,
+.highlight .cs,
+.highlight .cm,
+.highlight .cp,
+.highlight .c1 {
+  color: $hljs-comment;
+  font-style: italic;
+}
+
+.highlight .k,
+.highlight .kc,
+.highlight .kd,
+.highlight .kn,
+.highlight .kr,
+.highlight .kt,
+.highlight .kp {
+  color: $hljs-keyword;
+}
+
+.highlight .na,
+.highlight .nb,
+.highlight .nc,
+.highlight .no,
+.highlight .nd,
+.highlight .ni,
+.highlight .ne,
+.highlight .nf,
+.highlight .nl,
+.highlight .nn,
+.highlight .nx {
+  color: $hljs-name;
+}
+
+.highlight .mi,
+.highlight .il {
+  color: $hljs-number;
+}
+
+.highlight .s,
+.highlight .sb,
+.highlight .sc,
+.highlight .sd,
+.highlight .s2,
+.highlight .s3,
+.highlight .sh,
+.highlight .si,
+.highlight .sx,
+.highlight .sr,
+.highlight .ss,
+.highlight .s1 {
+  color: $hljs-string;
+}
+
+.hljs-title,
+.hljs-id,
+.scss .hljs-preprocessor {
+  color: $hljs-title;
+  font-weight: bold;
+}
+
+.highlight .k {
+  font-weight: normal;
+}
+
+.highlight .nc,
+.highlight .no {
+  color: $hljs-type;
+}
+
+.highlight .o {
+  color: $hljs-tag;
+  font-weight: normal;
+}
+
+.highlight .nb {
+  color: $hljs-attribute;
+}
+
+.highlight .sr {
+  color: $hljs-regexp;
+}
+
+.highlight .ss {
+  color: $hljs-symbol;
+}
+
+.hljs-built_in {
+  color: $hljs-built-in;
+}
+
+.hljs-preprocessor,
+.hljs-pragma,
+.hljs-pi,
+.hljs-doctype,
+.hljs-shebang,
+.hljs-cdata {
+  color: $hljs-preprocessor;
+  font-weight: bold;
+}
+
+.hljs-deletion {
+  background: $hljs-deletion;
+}
+
+.hljs-addition {
+  background: $hljs-addition;
+}
+
+.diff .hljs-change {
+  background: $hljs-change;
+}
+
+.hljs-chunk {
+  color: $hljs-chunk;
+}
--- a/_sass/basscss/_utility-headings.scss
+++ b/_sass/basscss/_utility-headings.scss
@@ -0,0 +1,37 @@
+/* Basscss Utility Headings */
+
+.h00 {
+  font-size: $h00;
+}
+
+.h0 {
+  font-size: $h0;
+}
+
+@media #{$breakpoint-md} {
+  .h00-responsive {
+    font-size: $h00-responsive;
+  }
+
+  .h0-responsive {
+    font-size: $h0-responsive;
+  }
+
+  .h1-responsive {
+    font-size: $h1-responsive;
+  }
+}
+
+@media #{$breakpoint-xl} {
+  .h00-responsive {
+    font-size: $h00-responsive-max;
+  }
+
+  .h0-responsive {
+    font-size: $h0-responsive-max;
+  }
+
+  .h1-responsive {
+    font-size: $h1-responsive-max;
+  }
+}
--- a/_sass/basscss/_utility-typography.scss
+++ b/_sass/basscss/_utility-typography.scss
@@ -0,0 +1,38 @@
+/* Basscss Utility Typography */
+
+.bold {
+  font-weight: $bold-font-weight;
+}
+
+.regular {
+  font-weight: normal;
+}
+
+.italic {
+  font-style: italic;
+}
+
+.caps {
+  text-transform: uppercase;
+  letter-spacing: .2em;
+}
+
+.left-align {
+  text-align: left;
+}
+
+.center {
+  text-align: center;
+}
+
+.right-align {
+  text-align: right;
+}
+
+.justify {
+  text-align: justify;
+}
+
+.nowrap {
+  white-space: nowrap;
+}
--- a/_sass/basscss/_utility-white-space.scss
+++ b/_sass/basscss/_utility-white-space.scss
@@ -0,0 +1,182 @@
+/* Basscss Utility White Space */
+
+.m0 {
+  margin: 0;
+}
+
+.mt0 {
+  margin-top: 0;
+}
+
+.mr0 {
+  margin-right: 0;
+}
+
+.mb0 {
+  margin-bottom: 0;
+}
+
+.ml0 {
+  margin-left: 0;
+}
+
+.m1 {
+  margin: $space-1;
+}
+
+.mt1 {
+  margin-top: $space-1;
+}
+
+.mr1 {
+  margin-right: $space-1;
+}
+
+.mb1 {
+  margin-bottom: $space-1;
+}
+
+.ml1 {
+  margin-left: $space-1;
+}
+
+.m2 {
+  margin: $space-2;
+}
+
+.mt2 {
+  margin-top: $space-2;
+}
+
+.mr2 {
+  margin-right: $space-2;
+}
+
+.mb2 {
+  margin-bottom: $space-2;
+}
+
+.ml2 {
+  margin-left: $space-2;
+}
+
+.m3 {
+  margin: $space-3;
+}
+
+.mt3 {
+  margin-top: $space-3;
+}
+
+.mr3 {
+  margin-right: $space-3;
+}
+
+.mb3 {
+  margin-bottom: $space-3;
+}
+
+.ml3 {
+  margin-left: $space-3;
+}
+
+.m4 {
+  margin: $space-4;
+}
+
+.mt4 {
+  margin-top: $space-4;
+}
+
+.mr4 {
+  margin-right: $space-4;
+}
+
+.mb4 {
+  margin-bottom: $space-4;
+}
+
+.ml4 {
+  margin-left: $space-4;
+}
+
+.mxn1 {
+  margin-left: -$space-1;
+  margin-right: -$space-1;
+}
+
+.mxn2 {
+  margin-left: -$space-2;
+  margin-right: -$space-2;
+}
+
+.mxn3 {
+  margin-left: -$space-3;
+  margin-right: -$space-3;
+}
+
+.mxn4 {
+  margin-left: -$space-4;
+  margin-right: -$space-4;
+}
+
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto;
+}
+
+.p1 {
+  padding: $space-1;
+}
+
+.py1 {
+  padding-top: $space-1;
+  padding-bottom: $space-1;
+}
+
+.px1 {
+  padding-left: $space-1;
+  padding-right: $space-1;
+}
+
+.p2 {
+  padding: $space-2;
+}
+
+.py2 {
+  padding-top: $space-2;
+  padding-bottom: $space-2;
+}
+
+.px2 {
+  padding-left: $space-2;
+  padding-right: $space-2;
+}
+
+.p3 {
+  padding: $space-3;
+}
+
+.py3 {
+  padding-top: $space-2;
+  padding-bottom: $space-1 + $space-2;
+}
+
+.px3 {
+  padding-left: $space-3;
+  padding-right: $space-3;
+}
+
+.p4 {
+  padding: $space-4;
+}
+
+.py4 {
+  padding-top: $space-4;
+  padding-bottom: $space-4;
+}
+
+.px4 {
+  padding-left: $space-4;
+  padding-right: $space-4;
+}