Initial commit

8 files changed, 667 insertions, 0 deletions

diff --git a/_sass/_base.scss b/_sass/_base.scss
new file mode 100644
index 0000000..cdf20d3
--- /dev/null
+++ b/_sass/_base.scss
@@ -0,0 +1,59 @@
+* {
+    @include box-sizing;
+    line-height: 1.5;
+}
+
+html, body {
+    color: $default-color;
+    margin: 0;
+    padding: 0;
+}
+
+html {
+    font-family: $serif-primary;
+    font-size: 14px;
+
+    @media (min-width: 600px) {
+        font-size: 16px;
+    }
+}
+
+body {
+    -webkit-text-size-adjust: 100%;
+}
+
+h1, h2, h3, h4, h5, h6 {
+    color: $default-shade;
+    font-family: $sans-serif;
+    line-height: normal;
+}
+
+a {
+    color: $blue;
+    text-decoration: none;
+}
+
+blockquote {
+    border-left: .25rem solid $grey-2;
+    color: $grey-1;
+    margin: .8rem 0;
+    padding: .5rem 1rem;
+
+    p:last-child {
+        margin-bottom: 0;
+    }
+
+    @media (min-width: 600px) {
+        padding: 0 5rem 0 1.25rem;
+    }
+}
+
+img {
+    display: block;
+    margin: 0 0 1rem;
+    max-width: 100%;
+}
+
+td {
+    vertical-align: top;
+}
diff --git a/_sass/_catalogue.scss b/_sass/_catalogue.scss
new file mode 100644
index 0000000..efc113c
--- /dev/null
+++ b/_sass/_catalogue.scss
@@ -0,0 +1,39 @@
+.catalogue {
+    &-item {
+        border-bottom: 1px solid $grey-2;
+        color: $default-color;
+        display: inline-block;
+        padding: 2rem 0;
+
+        &:hover .catalogue-line,
+        &:focus .catalogue-line {
+            width: 5rem;
+        }
+
+        &:last-child {
+            border: 0;
+        }
+    }
+
+    &-time {
+        color: $default-tint;
+        font-family: $serif-secondary;
+        letter-spacing: .5px;
+    }
+
+    &-title {
+        color: $default-shade;
+        display: block;
+        font-family: $sans-serif;
+        font-size: 2rem;
+        font-weight: 700;
+        margin: .5rem 0;
+    }
+
+    &-line {
+        @include transition(all .3s ease-out);
+        border-top: .2rem solid $default-shade;
+        display: block;
+        width: 2rem;
+    }
+}
diff --git a/_sass/_code.scss b/_sass/_code.scss
new file mode 100644
index 0000000..1aab580
--- /dev/null
+++ b/_sass/_code.scss
@@ -0,0 +1,44 @@
+pre, code {
+    font-family: $monospaced;
+}
+
+code {
+    background-color: $grey-3;
+    border-radius: 3px;
+    color: $code-color;
+    font-size: 85%;
+    padding: .25em .5em;
+}
+
+pre {
+    margin: 0 0 1rem;
+}
+
+pre code {
+    background-color: transparent;
+    color: inherit;
+    font-size: 100%;
+    padding: 0;
+}
+
+.highlight {
+    background-color: $grey-3;
+    border-radius: 3px;
+    line-height: 1.4;
+    margin: 0 0 1rem;
+    padding: 1rem;
+
+    pre {
+        margin-bottom: 0;
+        overflow-x: auto;
+    }
+
+    .lineno {
+        color: $default-tint;
+        display: inline-block;
+        padding: 0 .75rem 0 .25rem;
+        -webkit-user-select: none;
+        -moz-user-select: none;
+        user-select: none;
+    }
+}
diff --git a/_sass/_layout.scss b/_sass/_layout.scss
new file mode 100644
index 0000000..58b03a2
--- /dev/null
+++ b/_sass/_layout.scss
@@ -0,0 +1,89 @@
+.container {
+    margin: 0 auto;
+    max-width: 800px;
+    width: 80%;
+}
+
+main, footer, .nav-container {
+    margin: 0 auto;
+    max-width: 800px;
+    width: 80%;
+}
+
+.nav {
+    box-shadow: 0 2px 2px -2px $shadow-color;
+    overflow: auto;
+
+    &-container {
+        margin: 1rem auto;
+        position: relative;
+        text-align: center;
+    }
+
+    &-title {
+        @include transition(all .2s ease-out);
+        color: $default-color;
+        display: inline-block;
+        margin: 0;
+        padding-right: .2rem;
+
+        &:hover,
+        &:focus {
+            opacity: .6;
+        }
+    }
+
+    ul {
+        list-style-type: none;
+        margin: 1rem 0 0;
+        padding: 0;
+        text-align: center;
+    }
+
+    li {
+        @include transition(all .2s ease-out);
+        color: $default-color;
+        display: inline-block;
+        opacity: .6;
+        padding: 0 2rem 0 0;
+
+        &:last-child {
+            padding-right: 0;
+        }
+
+        &:hover,
+        &:focus {
+            opacity: 1;
+        }
+    }
+
+    a {
+        color: $default-color;
+        font-family: $sans-serif;
+    }
+}
+
+@media (min-width: 600px) {
+    .nav {
+        &-container {
+            text-align: left;
+        }
+
+        ul {
+            bottom: 0;
+            position: absolute;
+            right: 0;
+        }
+    }
+}
+
+footer {
+    font-family: $serif-secondary;
+    padding: 2rem 0;
+    text-align: center;
+
+    span {
+        color: $default-color;
+        font-size: .8rem;
+    }
+}
diff --git a/_sass/_pagination.scss b/_sass/_pagination.scss
new file mode 100644
index 0000000..05adf90
--- /dev/null
+++ b/_sass/_pagination.scss
@@ -0,0 +1,44 @@
+.pagination {
+    border-top: .5px solid $grey-2;
+    font-family: $serif-secondary;
+    padding-top: 2rem;
+    position: relative;
+    text-align: center;
+
+    span {
+        color: $default-shade;
+        font-size: 1.1rem;
+    }
+
+    .top {
+        @include transition(all .3s ease-out);
+        color: $default-color;
+        font-family: $sans-serif;
+        font-size: 1.1rem;
+        opacity: .6;
+
+        &:hover {
+            opacity: 1;
+        }
+    }
+
+    .arrow {
+        @include transition(all .3s ease-out);
+        color: $default-color;
+        position: absolute;
+
+        &:hover,
+        &:focus {
+            opacity: .6;
+            text-decoration: none;
+        }
+    }
+
+    .left {
+        left: 0;
+    }
+
+    .right {
+        right: 0;
+    }
+}
diff --git a/_sass/_post.scss b/_sass/_post.scss
new file mode 100644
index 0000000..08949f3
--- /dev/null
+++ b/_sass/_post.scss
@@ -0,0 +1,51 @@
+.post {
+    padding: 3rem 0;
+
+    &-info {
+        color: $default-tint;
+        font-family: $serif-secondary;
+        letter-spacing: 0.5px;
+        text-align: center;
+
+        span {
+            font-style: italic;
+        }
+    }
+
+    &-title {
+        color: $default-shade;
+        font-family: $sans-serif;
+        font-size: 4rem;
+        margin: 1rem 0;
+        text-align: center;
+    }
+
+    &-line {
+        border-top: 0.4rem solid $default-shade;
+        display: block;
+        margin: 0 auto 3rem;
+        width: 4rem;
+    }
+
+    p {
+        margin: 0 0 1rem;
+        text-align: justify;
+    }
+
+    a:hover {
+        text-decoration: underline;
+    }
+
+    img {
+        margin: 0 auto 0.5rem;
+    }
+
+    img+em {
+        color: $default-tint;
+        display: block;
+        font-family: $sans-serif;
+        font-size: 0.9rem;
+        font-style: normal;
+        text-align: center;
+    }
+}
diff --git a/_sass/_syntax.scss b/_sass/_syntax.scss
new file mode 100644
index 0000000..38c22c4
--- /dev/null
+++ b/_sass/_syntax.scss
@@ -0,0 +1,312 @@
+.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/_sass/_variables.scss b/_sass/_variables.scss
new file mode 100644
index 0000000..288ade9
--- /dev/null
+++ b/_sass/_variables.scss
@@ -0,0 +1,29 @@
+// Colors
+$default-color: #555;
+$default-shade: #353535;
+$default-tint: #aaa;
+$grey-1: #979797;
+$grey-2: #e5e5e5;
+$grey-3: #f9f9f9;
+$white: #fff;
+$blue: #4a9ae1;
+$shadow-color: rgba(0, 0, 0, .2);
+$code-color: #bf616a;
+
+// Fonts
+$serif-primary: 'Libre Baskerville', 'Times New Roman', Times, serif;
+$serif-secondary: Palatino, 'Palatino LT STD', 'Palatino Linotype', 'Book Antiqua', 'Georgia', serif;
+$sans-serif: 'Helvetica Neue', 'Segoe UI', Helvetica, Arial, sans-serif;
+$monospaced: Menlo, Monaco, monospace;
+
+@mixin box-sizing($type: border-box) {
+    -webkit-box-sizing: $type;
+    -moz-box-sizing: $type;
+    box-sizing: $type;
+}
+
+@mixin transition($args...) {
+    -webkit-transition: $args;
+    -moz-transition: $args;
+    transition: $args;
+}