Copy from Nighttime

5 years ago · 3b53a15acf
18 changed files with 1472 additions and 0 deletions
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,2 @@
+.idea/
+public
--- a/21
+++ b/21
@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2017 Vincent Prouillet
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
--- a/README.md
+++ b/README.md
@ -0,0 +1,76 @@
+# nighttime
+
+This is a fork of [After Dark](https://github.com/getzola/after-dark/), a theme for [Zola](https://www.getzola.org/), with aditional suppot for tags and sections.
+
+![after-dark screenshot](https://github.com/jbiason/nighttime/blob/master/screenshot.png?raw=true)
+
+## Contents
+
+- [Installation](#installation)
+- [Options](#options)
+  - [Top menu](#top-menu)
+  - [Title](#title)
+
+## Installation
+First download this theme to your `themes` directory:
+
+```bash
+$ cd themes
+$ git clone https://github.com/jbiason/nighttime.git
+```
+and then enable it in your `config.toml`:
+
+```toml
+theme = "nighttime"
+```
+
+This theme requires your index section (`content/_index.md`) to be paginated to work:
+
+```toml
+paginate_by = 5
+```
+
+The posts should therefore be in directly under the `content` folder.
+
+The theme requires tags and categories taxonomies to be enabled in your `config.toml`:
+
+```toml
+taxonomies = [
+    # You can enable/disable RSS
+    {name = "categories", rss = true},
+    {name = "tags", rss = true},
+]
+```
+If you want to paginate taxonomies pages, you will need to overwrite the templates
+as it only works for non-paginated taxonomies by default.
+
+
+## Options
+
+Because this is, mostly, After Dark with support for extra stuff, it still uses the same options as After Dark.
+
+If you're already using After Dark, there are no changes in your configs that need to be done, besides changing the theme name.
+
+### Top-menu
+
+Set a field in `extra` with a key of `after_dark_menu`:
+
+```toml
+after_dark_menu = [
+    {url = "$BASE_URL", name = "Home"},
+    {url = "$BASE_URL/categories", name = "Categories"},
+    {url = "$BASE_URL/tags", name = "Tags"},
+    {url = "https://google.com", name = "Google"},
+]
+```
+
+If you put `$BASE_URL` in a url, it will automatically be replaced by the actual
+site URL.
+
+### Title
+The site title is shown on the homepage. As it might be different from the `<title>`
+element that the `title` field in the config represents, you can set the `after_dark_title`
+instead.
+
+## Original
+This template is based on the Hugo template https://github.com/comfusion/after-dark
--- a/config.toml
+++ b/config.toml
@ -0,0 +1,18 @@
+base_url = "https://zola-after-dark.netlify.com"
+compile_sass = true
+title = "after-dark theme"
+description = ""
+
+taxonomies = [
+    {name = "categories", rss = true},
+    {name = "tags", rss = true},
+]
+
+[extra]
+author = "Vincent"
+after_dark_menu = [
+    {url = "$BASE_URL", name = "Home"},
+    {url = "$BASE_URL/categories", name = "Categories"},
+    {url = "$BASE_URL/tags", name = "Tags"},
+]
+after_dark_title = "My blog"
--- a/sass/_theme.scss
+++ b/sass/_theme.scss
@ -0,0 +1,101 @@
+:root {
+  --screen-size-small: 30em; /* breakpoint reference only */
+}
+@keyframes intro {
+  0% {
+    opacity: 0;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+.muted {
+  color: rgba(255, 255, 255, 0.5);
+  margin-top: 5px;
+}
+.responsive-iframe {
+  position: relative;
+  padding-bottom: 56.25%; /* 16:9 */
+  padding-top: 25px;
+  height: 0;
+}
+.responsive-iframe iframe {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+iframe {
+  border: 0;
+}
+main, footer {
+  animation: intro 0.3s both;
+  animation-delay: 0.15s;
+}
+footer time[datetime$="M"]:before {
+  content: "\2013\0020";
+}
+@media only screen
+  and ( max-width: 30em ) {
+  footer time[datetime$="M"] {
+    display: none;
+  }
+}
+blockquote cite {
+  display: block;
+}
+blockquote cite::before {
+   content: "\2014";
+}
+:target {
+  color: #fff;
+}
+/* hack.css overrides and enhancements */
+.hack li ul {
+  margin: 0;
+}
+.main {
+  padding: 20px 10px;
+}
+nav a.active {
+  background-color: #ff2e88;
+  color: #fff;
+}
+a[itemprop="url"] {
+  color: #ff9800;
+}
+a[itemprop="url"]:hover {
+  color: #fff;
+}
+a[href*="://"]::after,
+a[rel*="external"] {
+  content: " " url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20class='i-external'%20viewBox='0%200%2032%2032'%20width='14'%20height='14'%20fill='none'%20stroke='%23ff9800'%20stroke-linecap='round'%20stroke-linejoin='round'%20stroke-width='9.38%'%3E%3Cpath%20d='M14%209%20L3%209%203%2029%2023%2029%2023%2018%20M18%204%20L28%204%2028%2014%20M28%204%20L14%2018'/%3E%3C/svg%3E");
+}
+figure a[href*="://"]::after,
+figure a[rel*="external"] {
+  content: "";
+}
+html {
+  font-size: 13px;
+}
+.hack pre {
+  font-size: 17px;
+}
+article [itemprop="description"], article [itemprop="summary"] {
+  margin-bottom: 30px;
+  margin-top: 5px;
+}
+
+article [itemprop="summary"] p {
+  margin: 0;
+}
+
+@media screen and (min-width: 768px) {
+  html {
+    font-size: 1em;
+  }
+  .container {
+    max-width: 50rem;
+  }
+}
--- a/sass/_vendor.scss
+++ b/sass/_vendor.scss
@ -0,0 +1,994 @@
+html {
+  font-size: 12px
+}
+
+* {
+  box-sizing: border-box;
+  text-rendering: geometricPrecision
+}
+
+body {
+  font-size: 1rem;
+  line-height: 1.5rem;
+  margin: 0;
+  font-family: Anonymous Pro, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
+  word-wrap: break-word
+}
+
+h1, h2, h3, h4, h5, h6 {
+  line-height: 1.3em
+}
+
+fieldset {
+  border: none;
+  padding: 0;
+  margin: 0
+}
+
+pre {
+  padding: 2rem;
+  margin: 1.75rem 0;
+  background-color: #fff;
+  border: 1px solid #ccc;
+  overflow: auto
+}
+
+code[class*=language-], pre[class*=language-], pre code {
+  font-weight: 100;
+  text-shadow: none;
+  margin: 1.75rem 0
+}
+
+a {
+  cursor: pointer;
+  color: #ff2e88;
+  text-decoration: none;
+  border-bottom: 1px solid #ff2e88
+}
+
+a:hover {
+  background-color: #ff2e88;
+  color: #fff
+}
+
+.grid {
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap
+}
+
+.grid.\-top {
+  -ms-flex-align: start;
+  -ms-grid-row-align: flex-start;
+  align-items: flex-start
+}
+
+.grid.\-middle {
+  -ms-flex-align: center;
+  -ms-grid-row-align: center;
+  align-items: center
+}
+
+.grid.\-bottom {
+  -ms-flex-align: end;
+  -ms-grid-row-align: flex-end;
+  align-items: flex-end
+}
+
+.grid.\-stretch {
+  -ms-flex-align: stretch;
+  -ms-grid-row-align: stretch;
+  align-items: stretch
+}
+
+.grid.\-baseline {
+  -ms-flex-align: baseline;
+  -ms-grid-row-align: baseline;
+  align-items: baseline
+}
+
+.grid.\-left {
+  -ms-flex-pack: start;
+  justify-content: flex-start
+}
+
+.grid.\-center {
+  -ms-flex-pack: center;
+  justify-content: center
+}
+
+.grid.\-right {
+  -ms-flex-pack: end;
+  justify-content: flex-end
+}
+
+.grid.\-between {
+  -ms-flex-pack: justify;
+  justify-content: space-between
+}
+
+.grid.\-around {
+  -ms-flex-pack: distribute;
+  justify-content: space-around
+}
+
+.cell {
+  -ms-flex: 1;
+  flex: 1;
+  box-sizing: border-box
+}
+
+@media screen and (min-width: 768px) {
+  .cell.\-1of12 {
+    -ms-flex: 0 0 8.33333%;
+    flex: 0 0 8.33333%
+  }
+  .cell.\-2of12 {
+    -ms-flex: 0 0 16.66667%;
+    flex: 0 0 16.66667%
+  }
+  .cell.\-3of12 {
+    -ms-flex: 0 0 25%;
+    flex: 0 0 25%
+  }
+  .cell.\-4of12 {
+    -ms-flex: 0 0 33.33333%;
+    flex: 0 0 33.33333%
+  }
+  .cell.\-5of12 {
+    -ms-flex: 0 0 41.66667%;
+    flex: 0 0 41.66667%
+  }
+  .cell.\-6of12 {
+    -ms-flex: 0 0 50%;
+    flex: 0 0 50%
+  }
+  .cell.\-7of12 {
+    -ms-flex: 0 0 58.33333%;
+    flex: 0 0 58.33333%
+  }
+  .cell.\-8of12 {
+    -ms-flex: 0 0 66.66667%;
+    flex: 0 0 66.66667%
+  }
+  .cell.\-9of12 {
+    -ms-flex: 0 0 75%;
+    flex: 0 0 75%
+  }
+  .cell.\-10of12 {
+    -ms-flex: 0 0 83.33333%;
+    flex: 0 0 83.33333%
+  }
+  .cell.\-11of12 {
+    -ms-flex: 0 0 91.66667%;
+    flex: 0 0 91.66667%
+  }
+}
+
+@media screen and (max-width: 768px) {
+  .grid {
+    -ms-flex-direction: column;
+    flex-direction: column
+  }
+  .cell {
+    -ms-flex: 0 0 auto;
+    flex: 0 0 auto
+  }
+}
+
+.hack, .hack blockquote, .hack code, .hack em, .hack h1, .hack h2, .hack h3, .hack h4, .hack h5, .hack h6, .hack strong {
+  font-size: 1rem;
+  font-style: normal;
+  font-family: Anonymous Pro, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif
+}
+
+.hack blockquote, .hack code, .hack em, .hack strong {
+  line-height: 20px
+}
+
+.hack blockquote, .hack code, .hack footer, .hack h1, .hack h2, .hack h3, .hack h4, .hack h5, .hack h6, .hack header, .hack li, .hack ol, .hack p, .hack section, .hack ul {
+  float: none;
+  margin: 0;
+  padding: 0
+}
+
+.hack blockquote, .hack h1, .hack ol, .hack p, .hack ul {
+  margin-top: 20px;
+  margin-bottom: 20px
+}
+
+.hack h1 {
+  position: relative;
+  display: inline-block;
+  display: table-cell;
+  padding: 20px 0 10px;
+  margin: 0;
+  overflow: hidden
+}
+
+.hack h1:after {
+  content: "====================================================================================================";
+  position: absolute;
+  bottom: -7px;
+  left: 0
+}
+
+.hack h1 + * {
+  margin-top: 0
+}
+
+.hack h2, .hack h3, .hack h4, .hack h5, .hack h6 {
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 10px;
+}
+
+.hack h2:before, .hack h3:before, .hack h4:before, .hack h5:before, .hack h6:before {
+  display: inline
+}
+
+.hack h2:before {
+  content: "## "
+}
+
+.hack h3:before {
+  content: "### "
+}
+
+.hack h4:before {
+  content: "#### "
+}
+
+.hack h5:before {
+  content: "##### "
+}
+
+.hack h6:before {
+  content: "###### "
+}
+
+.hack li {
+  position: relative;
+  display: block;
+  padding-left: 20px
+}
+
+.hack li:after {
+  position: absolute;
+  top: 0;
+  left: 0
+}
+
+.hack ul > li:after {
+  content: "-"
+}
+
+.hack ol {
+  counter-reset: a
+}
+
+.hack ol > li:after {
+  content: counter(a) ".";
+  counter-increment: a
+}
+
+.hack blockquote {
+  position: relative;
+  padding-left: 17px;
+  padding-left: 2ch;
+  overflow: hidden
+}
+
+.hack blockquote:after {
+  content: ">\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>\A>";
+  white-space: pre;
+  position: absolute;
+  top: 0;
+  left: 0;
+  line-height: 20px
+}
+
+.hack em:after, .hack em:before {
+  content: "*";
+  display: inline
+}
+
+.hack pre code:after, .hack pre code:before {
+  content: ''
+}
+
+.hack code {
+  font-weight: 700
+}
+
+.hack code:after, .hack code:before {
+  content: "`";
+  display: inline
+}
+
+.hack hr {
+  position: relative;
+  height: 20px;
+  overflow: hidden;
+  border: 0;
+  margin: 20px 0
+}
+
+.hack hr:after {
+  content: "----------------------------------------------------------------------------------------------------";
+  position: absolute;
+  top: 0;
+  left: 0;
+  line-height: 20px;
+  width: 100%;
+  word-wrap: break-word
+}
+
+@-moz-document url-prefix() {
+  .hack h1 {
+    display: block
+  }
+}
+
+.hack-ones ol > li:after {
+  content: "1."
+}
+
+p {
+  margin: 0 0 1.75rem
+}
+
+.container {
+  max-width: 70rem
+}
+
+.container, .container-fluid {
+  margin: 0 auto;
+  padding: 0 1rem
+}
+
+.inner {
+  padding: 1rem
+}
+
+.inner2x {
+  padding: 2rem
+}
+
+.pull-left {
+  float: left
+}
+
+.pull-right {
+  float: right
+}
+
+.progress-bar {
+  height: 8px;
+  opacity: .8;
+  background-color: #ccc;
+  margin-top: 12px
+}
+
+.progress-bar.progress-bar-show-percent {
+  margin-top: 38px
+}
+
+.progress-bar-filled {
+  background-color: gray;
+  height: 100%;
+  transition: width .3s ease;
+  position: relative;
+  width: 0
+}
+
+.progress-bar-filled:before {
+  content: '';
+  border: 6px solid transparent;
+  border-top-color: gray;
+  position: absolute;
+  top: -12px;
+  right: -6px
+}
+
+.progress-bar-filled:after {
+  color: gray;
+  content: attr(data-filled);
+  display: block;
+  font-size: 12px;
+  white-space: nowrap;
+  position: absolute;
+  border: 6px solid transparent;
+  top: -38px;
+  right: 0;
+  -ms-transform: translateX(50%);
+  transform: translateX(50%)
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: 1.75rem 0;
+  color: #778087
+}
+
+table td, table th {
+  vertical-align: top;
+  border: 1px solid #ccc;
+  line-height: 15px;
+  padding: 10px
+}
+
+table thead th {
+  font-size: 10px
+}
+
+table tbody td:first-child {
+  font-weight: 700;
+  color: #333
+}
+
+.form {
+  width: 30rem
+}
+
+.form-group {
+  margin-bottom: 1.75rem;
+  overflow: auto
+}
+
+.form-group label {
+  border-bottom: 2px solid #ccc;
+  color: #333;
+  width: 10rem;
+  display: inline-block;
+  height: 38px;
+  line-height: 38px;
+  padding: 0;
+  float: left;
+  position: relative
+}
+
+.form-group.form-success label {
+  color: #4caf50 !important;
+  border-color: #4caf50 !important
+}
+
+.form-group.form-warning label {
+  color: #ff9800 !important;
+  border-color: #ff9800 !important
+}
+
+.form-group.form-error label {
+  color: #f44336 !important;
+  border-color: #f44336 !important
+}
+
+.form-control {
+  outline: none;
+  border: none;
+  border-bottom: 2px solid #ccc;
+  padding: .5rem 0;
+  width: 20rem;
+  height: 38px;
+  background-color: transparent
+}
+
+.form-control:focus {
+  border-color: #555
+}
+
+.form-group.form-textarea label:after {
+  position: absolute;
+  content: '';
+  width: 2px;
+  background-color: #fff;
+  right: -2px;
+  top: 0;
+  bottom: 0
+}
+
+textarea.form-control {
+  height: auto;
+  resize: none;
+  padding: 1rem 0;
+  border-bottom: 2px solid #ccc;
+  border-left: 2px solid #ccc;
+  padding: .5rem
+}
+
+select.form-control {
+  border-radius: 0;
+  background-color: transparent;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  -ms-appearance: none
+}
+
+.help-block {
+  color: #999;
+  margin-top: .5rem
+}
+
+.form-actions {
+  margin-bottom: 1.75rem
+}
+
+.btn {
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -ms-flex-align: center;
+  align-items: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  cursor: pointer;
+  outline: none;
+  padding: .65rem 2rem;
+  font-size: 1rem;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  position: relative;
+  z-index: 1
+}
+
+.btn:active {
+  box-shadow: inset 0 1px 3px rgba(0, 0, 0, .12)
+}
+
+.btn.btn-ghost {
+  border-color: #757575;
+  color: #757575;
+  background-color: transparent
+}
+
+.btn.btn-ghost:focus, .btn.btn-ghost:hover {
+  border-color: #424242;
+  color: #424242;
+  z-index: 2
+}
+
+.btn.btn-ghost:hover {
+  background-color: transparent
+}
+
+.btn-block {
+  width: 100%;
+  display: -ms-flexbox;
+  display: flex
+}
+
+.btn-default {
+  color: #fff;
+  background-color: #e0e0e0;
+  border: 1px solid #e0e0e0;
+  color: #333
+}
+
+.btn-default:focus:not(.btn-ghost), .btn-default:hover {
+  background-color: #dcdcdc;
+  border-color: #dcdcdc
+}
+
+.btn-success {
+  color: #fff;
+  background-color: #4caf50;
+  border: 1px solid #4caf50
+}
+
+.btn-success:focus:not(.btn-ghost), .btn-success:hover {
+  background-color: #43a047;
+  border-color: #43a047
+}
+
+.btn-success.btn-ghost {
+  border-color: #4caf50;
+  color: #4caf50
+}
+
+.btn-success.btn-ghost:focus, .btn-success.btn-ghost:hover {
+  border-color: #388e3c;
+  color: #388e3c;
+  z-index: 2
+}
+
+.btn-error {
+  color: #fff;
+  background-color: #f44336;
+  border: 1px solid #f44336
+}
+
+.btn-error:focus:not(.btn-ghost), .btn-error:hover {
+  background-color: #e53935;
+  border-color: #e53935
+}
+
+.btn-error.btn-ghost {
+  border-color: #f44336;
+  color: #f44336
+}
+
+.btn-error.btn-ghost:focus, .btn-error.btn-ghost:hover {
+  border-color: #d32f2f;
+  color: #d32f2f;
+  z-index: 2
+}
+
+.btn-warning {
+  color: #fff;
+  background-color: #ff9800;
+  border: 1px solid #ff9800
+}
+
+.btn-warning:focus:not(.btn-ghost), .btn-warning:hover {
+  background-color: #fb8c00;
+  border-color: #fb8c00
+}
+
+.btn-warning.btn-ghost {
+  border-color: #ff9800;
+  color: #ff9800
+}
+
+.btn-warning.btn-ghost:focus, .btn-warning.btn-ghost:hover {
+  border-color: #f57c00;
+  color: #f57c00;
+  z-index: 2
+}
+
+.btn-info {
+  color: #fff;
+  background-color: #00bcd4;
+  border: 1px solid #00bcd4
+}
+
+.btn-info:focus:not(.btn-ghost), .btn-info:hover {
+  background-color: #00acc1;
+  border-color: #00acc1
+}
+
+.btn-info.btn-ghost {
+  border-color: #00bcd4;
+  color: #00bcd4
+}
+
+.btn-info.btn-ghost:focus, .btn-info.btn-ghost:hover {
+  border-color: #0097a7;
+  color: #0097a7;
+  z-index: 2
+}
+
+.btn-primary {
+  color: #fff;
+  background-color: #2196f3;
+  border: 1px solid #2196f3
+}
+
+.btn-primary:focus:not(.btn-ghost), .btn-primary:hover {
+  background-color: #1e88e5;
+  border-color: #1e88e5
+}
+
+.btn-primary.btn-ghost {
+  border-color: #2196f3;
+  color: #2196f3
+}
+
+.btn-primary.btn-ghost:focus, .btn-primary.btn-ghost:hover {
+  border-color: #1976d2;
+  color: #1976d2;
+  z-index: 2
+}
+
+.btn-group {
+  overflow: auto
+}
+
+.btn-group .btn {
+  float: left
+}
+
+.btn-group .btn-ghost:not(:first-child) {
+  margin-left: -1px
+}
+
+.card {
+  border: 1px solid #ccc
+}
+
+.card .card-header {
+  color: #333;
+  text-align: center;
+  background-color: #ddd;
+  padding: .5rem 0
+}
+
+.alert {
+  color: #ccc;
+  padding: 1rem;
+  border: 1px solid #ccc;
+  margin-bottom: 1.75rem
+}
+
+.alert-success {
+  color: #4caf50;
+  border-color: #4caf50
+}
+
+.alert-error {
+  color: #f44336;
+  border-color: #f44336
+}
+
+.alert-info {
+  color: #00bcd4;
+  border-color: #00bcd4
+}
+
+.alert-warning {
+  color: #ff9800;
+  border-color: #ff9800
+}
+
+.media:not(:last-child) {
+  margin-bottom: 1.25rem
+}
+
+.media-left {
+  padding-right: 1rem
+}
+
+.media-left, .media-right {
+  display: table-cell;
+  vertical-align: top
+}
+
+.media-right {
+  padding-left: 1rem
+}
+
+.media-body {
+  display: table-cell;
+  vertical-align: top
+}
+
+.media-heading {
+  font-size: 1.16667rem;
+  font-weight: 700
+}
+
+.media-content {
+  margin-top: .3rem
+}
+
+.avatarholder, .placeholder {
+  background-color: #f0f0f0;
+  text-align: center;
+  color: #b9b9b9;
+  font-size: 1rem;
+  border: 1px solid #f0f0f0
+}
+
+.avatarholder {
+  width: 48px;
+  height: 48px;
+  line-height: 46px;
+  font-size: 2rem;
+  background-size: cover;
+  background-position: 50%;
+  background-repeat: no-repeat
+}
+
+.avatarholder.rounded {
+  border-radius: 33px
+}
+
+.loading {
+  display: inline-block;
+  content: '&nbsp;';
+  height: 20px;
+  width: 20px;
+  margin: 0 .5rem;
+  animation: a .6s infinite linear;
+  border: 2px solid #e91e63;
+  border-right-color: transparent;
+  border-radius: 50%
+}
+
+.btn .loading {
+  margin-bottom: 0;
+  width: 14px;
+  height: 14px
+}
+
+.btn div.loading {
+  float: left
+}
+
+.alert .loading {
+  margin-bottom: -5px
+}
+
+@keyframes a {
+  0% {
+    transform: rotate(0deg)
+  }
+  to {
+    transform: rotate(1turn)
+  }
+}
+
+.menu {
+  width: 100%
+}
+
+.menu .menu-item {
+  display: block;
+  color: #616161;
+  border-color: #616161
+}
+
+.menu .menu-item.active, .menu .menu-item:hover {
+  color: #000;
+  border-color: #000;
+  background-color: transparent
+}
+
+@media screen and (max-width: 768px) {
+  .form-group label {
+    display: block;
+    border-bottom: none;
+    width: 100%
+  }
+  .form-group.form-textarea label:after {
+    display: none
+  }
+  .form-control {
+    width: 100%
+  }
+  textarea.form-control {
+    border-left: none;
+    padding: .5rem 0
+  }
+  pre::-webkit-scrollbar {
+    height: 3px
+  }
+}
+
+@media screen and (max-width: 480px) {
+  .form {
+    width: 100%
+  }
+}
+
+.dark {
+  color: #ccc
+}
+
+.dark, .dark pre {
+  background-color: #000
+}
+
+.dark pre {
+  padding: 0;
+  border: none
+}
+
+.dark pre code {
+  color: #00bcd4
+}
+
+.dark h1 a, .dark h2 a, .dark h3 a, .dark h4 a, .dark h5 a {
+  color: #ccc
+}
+
+.dark code, .dark strong {
+  color: #fff
+}
+
+.dark code {
+  font-weight: 100
+}
+
+.dark table {
+  color: #ccc
+}
+
+.dark table td, .dark table th {
+  border-color: #444
+}
+
+.dark table tbody td:first-child {
+  color: #fff
+}
+
+.dark .form-group label {
+  color: #ccc;
+  border-color: rgba(95, 95, 95, .78)
+}
+
+.dark .form-group.form-textarea label:after {
+  background-color: #000
+}
+
+.dark .form-control {
+  color: #ccc;
+  border-color: rgba(95, 95, 95, .78)
+}
+
+.dark .form-control:focus {
+  border-color: #ccc;
+  color: #ccc
+}
+
+.dark textarea.form-control {
+  color: #ccc
+}
+
+.dark .card {
+  border-color: rgba(95, 95, 95, .78)
+}
+
+.dark .card .card-header {
+  background-color: transparent;
+  color: #ccc;
+  border-bottom: 1px solid rgba(95, 95, 95, .78)
+}
+
+.dark .btn.btn-ghost.btn-default {
+  border-color: #ababab;
+  color: #ababab
+}
+
+.dark .btn.btn-ghost.btn-default:focus, .dark .btn.btn-ghost.btn-default:hover {
+  border-color: #9c9c9c;
+  color: #9c9c9c;
+  z-index: 1
+}
+
+.dark .btn.btn-ghost.btn-default:focus, .dark .btn.btn-ghost.btn-default:hover {
+  border-color: #e0e0e0;
+  color: #e0e0e0
+}
+
+.dark .btn.btn-ghost.btn-primary:focus, .dark .btn.btn-ghost.btn-primary:hover {
+  border-color: #64b5f6;
+  color: #64b5f6
+}
+
+.dark .btn.btn-ghost.btn-success:focus, .dark .btn.btn-ghost.btn-success:hover {
+  border-color: #81c784;
+  color: #81c784
+}
+
+.dark .btn.btn-ghost.btn-info:focus, .dark .btn.btn-ghost.btn-info:hover {
+  border-color: #4dd0e1;
+  color: #4dd0e1
+}
+
+.dark .btn.btn-ghost.btn-error:focus, .dark .btn.btn-ghost.btn-error:hover {
+  border-color: #e57373;
+  color: #e57373
+}
+
+.dark .btn.btn-ghost.btn-warning:focus, .dark .btn.btn-ghost.btn-warning:hover {
+  border-color: #ffb74d;
+  color: #ffb74d
+}
+
+.dark .avatarholder, .dark .placeholder {
+  background-color: transparent;
+  border-color: #333
+}
+
+.dark .menu .menu-item {
+  color: #ccc;
+  border-color: rgba(95, 95, 95, .78)
+}
+
+.dark .menu .menu-item.active, .dark .menu .menu-item:hover {
+  color: #fff;
+  border-color: #ccc
+}
--- a/sass/site.scss
+++ b/sass/site.scss
@ -0,0 +1,2 @@
+@import "vendor";
+@import "theme";
--- a/static/.gitkeep
+++ b/static/.gitkeep
--- a/templates/categories/list.html
+++ b/templates/categories/list.html
@ -0,0 +1,19 @@
+{% extends "index.html" %}
+
+{% block content %}
+    {% block header %}
+        {{ super() }}
+    {% endblock header %}
+
+    <h1>Categories</h1>
+
+    {% if terms %}
+        <ul>
+            {% for term in terms %}
+                <li>
+                    <a href="{{ term.permalink | safe }}">{{ term.name }}</a>({{ term.pages | length }})
+                </li>
+            {% endfor %}
+        </ul>
+    {% endif %}
+{% endblock content %}
--- a/templates/categories/single.html
+++ b/templates/categories/single.html
@ -0,0 +1,14 @@
+{% extends "index.html" %}
+{% import "post_macros.html" as post_macros %}
+
+{% block content %}
+    {% block header %}
+        {{ super() }}
+    {% endblock header %}
+
+    <h1>{{ term.name }}</h1>
+
+    {% for page in term.pages %}
+        {{ post_macros::page_in_list(page=page) }}
+    {% endfor %}
+{% endblock content %}
--- a/templates/index.html
+++ b/templates/index.html
@ -0,0 +1,70 @@
+{% import "post_macros.html" as post_macros %}
+
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+      <meta http-equiv="X-UA-Compatible" content="IE=edge">
+      <meta http-equiv="content-type" content="text/html; charset=utf-8">
+
+      <!-- Enable responsiveness on mobile devices-->
+      <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
+	  <link href="https://fonts.googleapis.com/css?family=Anonymous+Pro" rel="stylesheet">
+
+      <title>{% block title %}{{ config.title }}{% endblock title %}</title>
+
+      {% if config.generate_rss %}
+        <link rel="alternate" type="application/rss+xml" title="RSS" href="{{ get_url(path="rss.xml") | safe }}">
+      {% endif %}
+
+      {% block css %}
+          <link rel="stylesheet" href="{{ get_url(path="site.css", trailing_slash=false) | safe }}">
+      {% endblock css %}
+
+      {% block extra_head %}
+      {% endblock extra_head %}
+    </head>
+
+    <body class="hack dark main container">
+        {% block content %}
+            {% block header %}
+                {% if config.extra.after_dark_menu %}
+                    <header>
+                        <nav itemscope itemtype="http://schema.org/SiteNavigationElement">
+                        {% for item in config.extra.after_dark_menu %}
+                            <a itemprop="url"
+                               class="{% if item.url | replace(from="$BASE_URL", to=config.base_url) == current_url %}active{% endif %}"
+                               href="{{ item.url | safe | replace(from="$BASE_URL", to=config.base_url) }}">
+                                <span itemprop="name">{{ item.name }}
+                                </span></a>
+                        {% endfor %}
+                        </nav>
+                    </header>
+                {% endif %}
+            {% endblock header %}
+
+            <main>
+                {% if config.extra.after_dark_title %}
+                    <header>
+                        <h1>{{ config.extra.after_dark_title }}</h1>
+                    </header>
+                {% endif %}
+                {% for page in paginator.pages %}
+                    {{ post_macros::page_in_list(page=page) }}
+                {% endfor %}
+
+                <nav>
+                  <p>
+                    {% if paginator.previous %}
+                      <a href="{{ paginator.previous }}">&laquo; Previous</a> |
+                    {% endif %}
+                    <span>Page {{ paginator.current_index }} of {{ paginator.number_pagers }}</span>
+                    {% if paginator.next %}
+                      | <a href="{{ paginator.next }}">Next &raquo;</a>
+                    {% endif %}
+                  </p>
+                </nav>
+            </main>
+        {% endblock content %}
+    </body>
+
+</html>
--- a/templates/page.html
+++ b/templates/page.html
@ -0,0 +1,50 @@
+{% extends "index.html" %}
+{% import "post_macros.html" as post_macros %}
+
+{% block content %}
+    {% block header %}
+        {{ super() }}
+    {% endblock header %}
+
+<article itemscope itemtype="http://schema.org/BlogPosting">
+    <header>
+        <h1 itemprop="headline">{{ page.title }}</h1>
+        <span class="muted">{{ post_macros::meta(page=page) }}</span>
+    </header>
+    <div itemprop="articleBody">
+      {{ page.content | safe }}
+    </div>
+
+    {% block page_footer %}
+        <footer>
+            <hr>
+            <p>
+                {% if config.extra.author %}
+                    Published by {{ config.extra.author }}
+                {% endif %}
+                {% if page.taxonomies.categories %}
+                    {% set category = page.taxonomies.categories[0] %}
+                    in <a href="{{ get_taxonomy_url(kind="categories", name=category) | safe }}">{{ category }}</a>
+                {% endif %}
+                {% if page.taxonomies.tags %}
+                    and tagged
+                    {% for tag in page.taxonomies.tags %}
+                        <a href="{{ get_taxonomy_url(kind="tags", name=tag) | safe }}">{{ tag }}</a>
+                        {% if page.taxonomies.tags | length > 1 %}
+                            {% if loop.index != page.taxonomies.tags | length %}
+                                {% if loop.index == page.taxonomies.tags | length - 1 %}
+                                    and
+                                {% else %}
+                                    ,
+                                {% endif %}
+                            {% endif %}
+                        {% endif %}
+                    {% endfor %}
+                {% endif %}
+            </p>
+        </footer>
+    {% endblock page_footer %}
+</article>
+
+{% endblock content %}
+
--- a/templates/post_macros.html
+++ b/templates/post_macros.html
@ -0,0 +1,33 @@
+{% macro meta(page) %}
+    <svg style="margin-bottom:-3px" class="i-clock" viewBox="0 0 32 32"
+         width="16" height="16" fill="none" stroke="currentcolor"
+         stroke-linecap="round" stroke-linejoin="round" stroke-width="6.25%">
+        <circle cx="16" cy="16" r="14"/>
+        <path d="M16 8 L16 16 20 20"/>
+    </svg>
+    <span>{{ page.reading_time }} minute read</span>
+    <svg style="margin-bottom: -3px" class="i-edit" viewBox="0 0 32 32"
+         width="16" height="16" fill="none" stroke="currentcolor"
+         stroke-linecap="round" stroke-linejoin="round" stroke-width="6.25%">
+        <path d="M30 7 L25 2 5 22 3 29 10 27 Z M21 6 L26 11 Z M5 22 L10 27 Z"/>
+    </svg>
+
+    Published: {{ page.date | date(format="%F") }}
+{% endmacro meta %}
+
+{% macro page_in_list(page) %}
+    <article itemscope itemtype="http://schema.org/CreativeWork">
+        <header>
+            <h2 itemprop="name">
+                <a href="{{ page.permalink | safe }}">{{ page.title }}</a>
+            </h2>
+            <span class="muted">{{ self::meta(page=page) }}</span>
+        </header>
+        {% if page.summary %}
+            <div itemprop="summary">
+                {{ page.summary | safe }}
+                <nav class="readmore"><a itemprop="url" href="{{ page.permalink | safe }}">Read More&nbsp;&raquo;</a></nav>
+            </div>
+        {% endif %}
+    </article>
+{% endmacro page_in_list %}
--- a/templates/section-contentless.html
+++ b/templates/section-contentless.html
@ -0,0 +1,6 @@
+{% extends "index.html" %}
+
+{% block content %}
+    <h1>{{ section.title }}</h1>
+    {{ section.content | safe }}
+{% endblock content %}
--- a/templates/section.html
+++ b/templates/section.html
@ -0,0 +1,18 @@
+{% extends "index.html" %}
+
+{% block content %}
+    <h1>{{ section.title }}</h1>
+    {{ section.content | safe }}
+
+	{% for page in section.pages %}
+	  <div class="post">
+		<h2 class="post-title">
+		  <a href="{{ page.permalink }}">
+			{{ page.title }}
+		  </a>
+		</h2>
+
+		<span class="post-date">{{ page.date | date(format="%Y-%m-%d") }}</span>
+	  </div>
+	{% endfor %}
+{% endblock content %}
--- a/templates/tags/list.html
+++ b/templates/tags/list.html
@ -0,0 +1,17 @@
+{% extends "index.html" %}
+
+{% block content %}
+    {% block header %}
+        {{ super() }}
+    {% endblock header %}
+
+    <h1>Tags</h1>
+
+    {% if terms %}
+        <ul>
+            {% for term in terms %}
+                <li><a href="{{ term.permalink | safe }}">{{ term.name }}</a> ({{ term.pages | length }})</li>
+            {% endfor %}
+        </ul>
+    {% endif %}
+{% endblock content %}
--- a/templates/tags/single.html
+++ b/templates/tags/single.html
@ -0,0 +1,13 @@
+{% extends "index.html" %}
+
+{% block content %}
+    {% block header %}
+        {{ super() }}
+    {% endblock header %}
+
+    <h1>{{ term.name }}</h1>
+
+    {% for page in term.pages %}
+        {{ post_macros::page_in_list(page=page) }}
+    {% endfor %}
+{% endblock content %}
--- a/theme.toml
+++ b/theme.toml
@ -0,0 +1,18 @@
+name = "after-dark"
+description = "A robust, elegant dark theme"
+license = "MIT"
+homepage = "https://github.com/getzola/after-dark"
+min_version = "0.5.0"
+demo = "https://zola-after-dark.netlify.com"
+
+[extra]
+
+
+[author]
+name = "Vincent Prouillet"
+homepage = "https://www.vincentprouillet.com"
+
+[original]
+author =  "comfusion"
+homepage = "https://git.habd.as/comfusion/after-dark/"
+repo = "https://git.habd.as/comfusion/after-dark/"