chore: merge from master

2 files changed, 163 insertions, 112 deletions

diff --git a/static/css/dark.css b/static/css/dark.css
new file mode 100644
index 0000000..1b6eb1f
--- /dev/null
+++ b/static/css/dark.css
@@ -0,0 +1,44 @@
+body {
+	color: #fff;
+	background-color: #000;
+}
+
+::-moz-selection {
+    background: #666;
+    text-shadow: none
+}
+
+::selection {
+    background: #666;
+    text-shadow: none
+}
+
+hr {
+    border-color: #333;
+}
+
+blockquote {
+	border-color: #fff;
+}
+
+h1,h2,h3,h4,h5,h6 {
+	color: #fff;
+}
+
+a,a:hover {
+	color: #fff;
+	text-decoration: underline;
+}
+
+a:hover {
+	opacity: 0.8;
+}
+
+.header nav,
+.footer {
+	border-color: #333;
+}
+
+.highlight {
+	background-color: #333;
+}
diff --git a/static/css/main.css b/static/css/main.css
index 62577ad..355f437 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -1,28 +1,29 @@
 body {
     font-family: "ubuntu", sans-serif;
     font-weight: 300;
-	color: #333;
-	line-height: 1.6;
-	font-size: 16px;
+    color: #333;
+    line-height: 1.6;
+    font-size: 16px;
 }
 
 a, a:hover {
     color: #a00;
     text-decoration: none;
+    word-break: break-word;
 }
 
 html,button,input,select,textarea {
-    color: #222
+    color: #333;
 }
 
 ::-moz-selection {
     background: #b3d4fc;
-    text-shadow: none
+    text-shadow: none;
 }
 
 ::selection {
     background: #b3d4fc;
-    text-shadow: none
+    text-shadow: none;
 }
 
 hr {
@@ -31,32 +32,32 @@ hr {
     border: 0;
     border-top: 1px solid #ccc;
     margin: 1rem 0;
-    padding: 0
+    padding: 0;
 }
 
 img {
-	margin: 10px auto 10px auto;
-	max-width: 100%;
-	display: block;
+    margin: 10px auto 10px auto;
+    max-width: 100%;
+    display: block;
 }
 
 a img {
-	border:none;
+    border:none;
 }
 
 figure {
-	margin: 0;
-	text-align: center;
+    margin: 0;
+    text-align: center;
 }
 
 fieldset {
     border: 0;
     margin: 0;
-    padding: 0
+    padding: 0;
 }
 
 textarea {
-    resize: vertical
+    resize: vertical;
 }
 
 blockquote {
@@ -66,12 +67,12 @@ blockquote {
     font-family: Georgia,bitstream charter,serif;
     border-left: 3px solid;
     border-color: #a00;
-    padding-left: 20px
+    padding-left: 20px;
 }
 
 blockquote cite {
     font-size: 70%;
-    opacity: .8
+    opacity: .8;
 }
 
 blockquote em {
@@ -91,64 +92,64 @@ h1,h2,h3,h4,h5,h6 {
     font-family: raleway,sans-serif;
     line-height: 1.2;
     color: #333;
-    font-weight: 100
+    font-weight: 200;
 }
 
 h1 {
-    font-size: 2.75rem
+    font-size: 2.75rem;
 }
 
 h2 {
-    font-size: 2rem
+    font-size: 2rem;
 }
 
 h3 {
-    font-size: 1.6rem
+    font-size: 1.6rem;
 }
 
 h4 {
-    font-size: 1.2rem
+    font-size: 1.2rem;
 }
 
 h5 {
     font-weight: 300;
-    font-size: 1rem
+    font-size: 1rem;
 }
 
 h6 {
     font-weight: 300;
-    font-size: .9rem
+    font-size: .9rem;
 }
 
 .align-center {
-	text-align: center;
+    text-align: center;
 }
 
 .align-left {
-	text-align: left;
+    text-align: left;
 }
 
 .align-right {
-	text-align: right;
+    text-align: right;
 }
 
 .container {
-    max-width: 800px
+    max-width: 800px;
 }
 
 ul {
-	padding-left: 15px;
+    padding-left: 15px;
 }
 
 ul.flat {
-	margin: 0;
-	padding: 0;
+    margin: 0;
+    padding: 0;
 }
 
 ul.flat li {
     display: inline-block;
     list-style: none;
-	margin-left: 0
+    margin-left: 0;
 }
 
 .prevent-collapse {
@@ -156,19 +157,19 @@ ul.flat li {
 }
 
 .page-title {
-    margin: 0
+    margin: 0;
 }
 
 .smaller {
-    font-size: 70%
+    font-size: 70%;
 }
 
 ul {
-    list-style: disc inside
+    list-style: disc inside;
 }
 
 .post ul li {
-	margin-bottom: 10px;
+    margin-bottom: 10px;
 }
 
 .post ul li p {
@@ -177,27 +178,28 @@ ul {
 
 .highlight pre {
     margin-bottom: 0;
-	margin-top: 0;
-	padding: 20px;
-	background-color: #FAFAFA !important;
+    margin-top: 0;
+    padding: 20px;
+    background-color: transparent !important;
 }
 
 .highlight {
-    background: 0 0
+    background: 0 0;
+    background-color: #FAFAFA;
 }
 
 .wrapper {
-	max-width: 760px;
-	margin: 0 auto;
+    max-width: 760px;
+    margin: 0 auto;
 }
 
 .container {
-	margin-top: 50px;
+    margin-top: 50px;
 }
 
 .header {
-	margin-bottom: 20px;
-	padding-bottom: 20px;
+    margin-bottom: 20px;
+    padding-bottom: 20px;
 }
 
 .header h1,
@@ -213,17 +215,17 @@ ul {
 }
 
 .header nav {
-	margin-top: 20px;
-	border-top: 1px solid #f4f4f4;
+    margin-top: 20px;
+    border-top: 1px solid #f4f4f4;
 }
 
 .header nav ul,
 .header nav li {
-	margin: 0;
+    margin: 0;
 }
 
 .header nav ul.flat {
-	padding: 0;
+    padding: 0;
 }
 
 .header nav ul.flat li {
@@ -236,47 +238,49 @@ ul {
 }
 
 .header .site-description {
-	display: flex;
-	justify-content: space-between;
+    display: flex;
+    justify-content: space-between;
 }
 
 .header .site-description nav {
-	margin: 0;
-	padding: 0;
-	border: none;
+    margin: 0;
+    padding: 0;
+    border: none;
+    min-width: 50px;
+    margin-left: 15px;
 }
 
 .header .site-description nav ul svg {
-	max-height: 15px;
+    max-height: 15px;
 }
 
 .section .section-header {
-	font-size: 0.75rem;
-	font-weight: 600;
-	text-transform: uppercase;
-	color: #999;
-	margin-bottom: 20px;
-	letter-spacing: 1px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    text-transform: uppercase;
+    color: #999;
+    margin-bottom: 20px;
+    letter-spacing: 1px;
 }
 
 .recent-posts .posts .post {
-	margin-bottom: 30px;
+    margin-bottom: 30px;
 }
 
 .recent-posts .posts .post .meta,
 .post .post-header .meta,
 .list .posts .post .meta {
-	font-size: 0.725rem;
-	color: #999;
-	margin-bottom: 4px;
+    font-size: 0.725rem;
+    color: #999;
+    margin-bottom: 4px;
 }
 
 .post .post-header {
-	margin-bottom: 30px;
+    margin-bottom: 30px;
 }
 
 .post .post-header .title {
-	margin: 0;
+    margin: 0;
 }
 
 .post-tags a {
@@ -284,20 +288,29 @@ ul {
 }
 
 .post .post-header .meta {
-	padding-left: 5px;
-	margin-top: 10px;
+    padding-left: 5px;
+    margin-top: 10px;
+}
+
+.post .draft-label {
+    color: #a00;
+    text-decoration: none;
+    padding: 2px 4px;
+    border-radius: 4px;
+    margin-left: 6px;
+    background-color: #f9f2f4;
 }
 
 .list .posts .post .meta {
-	margin-bottom: 0;
-	margin-left: 5px;
+    margin-bottom: 0;
+    margin-left: 5px;
 }
 
 .footer {
-	text-align: right;
-	font-size: 0.75em;
-	color: #999;
-	border-top: 1px solid #f4f4f4;
+    text-align: right;
+    font-size: 0.75em;
+    color: #999;
+    border-top: 1px solid #f4f4f4;
     padding: 20px 0;
     margin-top: 40px;
 }
@@ -315,61 +328,55 @@ ul {
 }
 
 .pagination {
-	margin: 0;
-	padding: 0;
-	text-align: left;
-	display: flex;
-	justify-content: space-between;
+    margin: 0;
+    padding: 0;
+    text-align: left;
+    display: flex;
+    justify-content: space-between;
 }
 
 .pagination li {
-	list-style: none;
-	display: inline-block;
-	margin: 0;
-	padding: 0;
+    list-style: none;
+    display: inline-block;
+    margin: 0;
+    padding: 0;
 }
 
 .pagination .page-prev {
-	margin-right: 20px;
-	padding-right: 20px;
+    margin-right: 20px;
+    padding-right: 20px;
 }
 
 .pagination .page-item.page-prev {
-	text-align: left;
+    text-align: left;
 }
 
 .pagination .page-item.page-next {
-	text-align: right;
+    text-align: right;
 }
 
 @media (max-width: 767px) {
-	body {
-		padding: 20px;
-	}
+    body {
+        padding: 20px;
+    }
 
-	h1 {
-		font-size: 2rem
-	}
+    h1 {
+        font-size: 1.8rem;
+    }
 
-	h2 {
-		font-size: 1.6rem
-	}
+    h2 {
+        font-size: 1.6rem;
+    }
 
-	h3 {
-		font-size: 1.2rem
-	}
+    h3 {
+        font-size: 1.2rem;
+    }
 
-	h4 {
-		font-size: 1rem
-	}
-
-	.container {
-		margin-top: 10px;
-	}
-}
+    h4 {
+        font-size: 1rem;
+    }
 
-@media (max-width: 480px) {
-	body {
-		font-size: 14px;
-	}
+    .container {
+        margin-top: 10px;
+    }
 }