Browse Source

Initial commit

master
Vincent Prouillet 7 years ago
commit
068416a53d
  1. 4
      .gitignore
  2. 21
      LICENSE
  3. 45
      README.md
  4. BIN
      image.png
  5. 100
      sass/_theme.scss
  6. 993
      sass/_vendor.scss
  7. 2
      sass/site.scss
  8. 80
      templates/index.html
  9. 28
      templates/page.html
  10. 16
      templates/post_macros.html
  11. 17
      theme.toml

4
.gitignore vendored

@ -0,0 +1,4 @@
.idea/
config.toml
content/
public

21
LICENSE

@ -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.

45
README.md

@ -0,0 +1,45 @@
# after-dark
![after-dark screenshot](https://f.cloud.github.com/assets/98681/1831228/42af6c6a-7384-11e3-98fb-e0b923ee0468.png)
## 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/Keats/after-dark.git
```
and then enable it in your `config.toml`:
```toml
theme = "after-dark"
```
## Options
### 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.

BIN
image.png

Binary file not shown.

After

Width:  |  Height:  |  Size: 131 KiB

100
sass/_theme.scss

@ -0,0 +1,100 @@
:root {
--screen-size-small: 30em; /* breakpoint reference only */
}
@keyframes intro {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.muted {
color: rgba(255, 255, 255, 0.5);
}
.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: 20px;
margin-top: 20px;
}
article [itemprop="summary"] p {
margin: 0;
}
@media screen and (min-width: 768px) {
html {
font-size: 1em;
}
.container {
max-width: 50rem;
}
}

993
sass/_vendor.scss

@ -0,0 +1,993 @@
html {
font-size: 12px
}
* {
box-sizing: border-box;
text-rendering: geometricPrecision
}
body {
font-size: 1rem;
line-height: 1.5rem;
margin: 0;
font-family: 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: 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 30px;
margin: 0;
overflow: hidden
}
.hack h1:after {
content: "====================================================================================================";
position: absolute;
bottom: 10px;
left: 0
}
.hack h1 + * {
margin-top: 0
}
.hack h2, .hack h3, .hack h4, .hack h5, .hack h6 {
position: relative;
margin-bottom: 1.75rem
}
.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
}

2
sass/site.scss

@ -0,0 +1,2 @@
@import "vendor";
@import "theme";

80
templates/index.html

@ -0,0 +1,80 @@
{% 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">
<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") }}">
{% endif %}
{% block css %}
<link rel="stylesheet" href="{{ get_url(path="site.css") }}">
{% endblock css %}
{% block extra_head %}
{% endblock extra_head %}
</head>
<body class="hack dark main container">
{% block content %}
{% 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 | replace(from="$BASE_URL", to=config.base_url) }}">
<span itemprop="name">{{ item.name }}
</span></a>
{% endfor %}
</nav>
</header>
{% endif %}
<main>
{% if config.extra.after_dark_title %}
<header>
<h1>{{ config.extra.after_dark_title }}</h1>
</header>
{% endif %}
{% for page in paginator.pages %}
<article itemscope itemtype="http://schema.org/CreativeWork">
<header>
<h2 itemprop="name">
<a href="{{ page.permalink }}">{{ page.title }}</a>
</h2>
<span class="muted">{{ post_macros::meta(page=page) }}</span>
</header>
{% if page.summary %}
<div itemprop="summary">
{{ page.summary | safe }}
<nav class="readmore"><a itemprop="url" href="{{ page.permalink }}">Read More&nbsp;&raquo;</a></nav>
</div>
{% endif %}
</article>
{% endfor %}
<nav>
<p>
{% if paginator.previous %}
<a href="{{ paginator.previous }}">&laquo; Previous</a> |
{% endif %}
<span>Page {{ paginator.current_index }} of {{ paginator.pagers | length }}</span>
{% if paginator.next %}
| <a href="{{ paginator.next }}">Next &raquo;</a>
{% endif %}
</p>
</nav>
</main>
{% endblock content %}
</body>
</html>

28
templates/page.html

@ -0,0 +1,28 @@
{% extends "index.html" %}
{% import "post_macros.html" as post_macros %}
{% block content %}
<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 %}
</p>
</footer>
{% endblock page_footer %}
</article>
{% endblock content %}

16
templates/post_macros.html

@ -0,0 +1,16 @@
{% 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 %}

17
theme.toml

@ -0,0 +1,17 @@
name = "after-dark"
description = "A robust, elegant dark theme"
license = "MIT"
homepage = "https://github.com/Keats/after-dark"
min_version = "0.2"
[extra]
[author]
name = "Vincent Prouillet"
homepage = "https://vincent.is"
[original]
author = "comfusion"
homepage = "https://comfusion.github.io/after-dark/"
repo = "https://github.com/comfusion/after-dark"
Loading…
Cancel
Save