From 3920b24306687528f35764800b48aa45ca2fbddb Mon Sep 17 00:00:00 2001 From: Hylke Visser Date: Wed, 9 Dec 2015 18:30:16 +0100 Subject: initial commit --- LICENSE | 21 ++ README.md | 46 +++ archetypes/default.md | 2 + images/screenshot.png | Bin 0 -> 70718 bytes images/tn.png | Bin 0 -> 107404 bytes layouts/404.html | 16 + layouts/_default/list.html | 8 + layouts/_default/single.html | 7 + layouts/index.html | 5 + layouts/partials/article-list-item.html | 10 + layouts/partials/article.html | 28 ++ layouts/partials/footer.html | 10 + layouts/partials/header.html | 21 ++ layouts/partials/hero.html | 12 + layouts/partials/homepage.html | 36 +++ static/css/style-cssnext.css | 494 +++++++++++++++++++++++++++++++ static/css/style.css | 508 ++++++++++++++++++++++++++++++++ static/css/style.min.css | 1 + static/img/base16-eighties.svg | 21 ++ theme.toml | 15 + 20 files changed, 1261 insertions(+) create mode 100644 LICENSE create mode 100644 README.md create mode 100644 archetypes/default.md create mode 100644 images/screenshot.png create mode 100644 images/tn.png create mode 100644 layouts/404.html create mode 100644 layouts/_default/list.html create mode 100644 layouts/_default/single.html create mode 100644 layouts/index.html create mode 100644 layouts/partials/article-list-item.html create mode 100644 layouts/partials/article.html create mode 100644 layouts/partials/footer.html create mode 100644 layouts/partials/header.html create mode 100644 layouts/partials/hero.html create mode 100644 layouts/partials/homepage.html create mode 100644 static/css/style-cssnext.css create mode 100644 static/css/style.css create mode 100644 static/css/style.min.css create mode 100644 static/img/base16-eighties.svg create mode 100644 theme.toml diff --git a/LICENSE b/LICENSE new file mode 100644 index 0000000..f5b0534 --- /dev/null +++ b/LICENSE @@ -0,0 +1,21 @@ +The MIT License (MIT) + +Copyright © 2015 Hylke Visser + +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. diff --git a/README.md b/README.md new file mode 100644 index 0000000..9264502 --- /dev/null +++ b/README.md @@ -0,0 +1,46 @@ +# Base16 Theme for Hugo + +![Hugo Base16 Theme screenshot](https://raw.githubusercontent.com/htdvisser/hugo-base16-theme/master/images/screenshot.png) + +## Installation + + $ mkdir themes + $ cd themes + $ git clone https://github.com/htdvisser/hugo-base16-theme.git base16 + +See [the Hugo documentation](http://gohugo.io/themes/installing/) for more information. + +## Extra Features + +### Syntax highlighting + +This theme has support for `highlight` shortcode (with Pygments), +see [the Hugo documentation](http://gohugo.io/extras/highlighting/) for more information. + +To use this feature install Pygments (`pip install Pygments`) and add `pygmentsuseclasses = true` to your `config.toml`. + +### Figure shortcode + +Use the `figure` shortcode if you want nice rendering of pictures, see [the Hugo documentation](http://gohugo.io/extras/shortcodes/) for more information. + + +## Customization + +You probably want to edit the homepage. Get started by copying the supplied homepage to your own site. + + $ mkdir -p layouts/partials + $ cp themes/base16/layouts/partials/hero.html layouts/partials/hero.html + +After this, you can edit `layouts/partials/hero.html` and make it awesome. + + +## License + +MIT Licensed, see [LICENSE](https://github.com/htdvisser/hugo-base16-theme/blob/master/LICENSE). + + +## Don't forget to thank... + +[Steve Francia](https://github.com/spf13) for Hugo. +[Chris Kempson](http://chriskempson.com) for the Base16 Eighties Colorscheme. +[Jan T. Sott](https://github.com/idleberg) for the Pygments template. diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..ac36e06 --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,2 @@ ++++ ++++ diff --git a/images/screenshot.png b/images/screenshot.png new file mode 100644 index 0000000..1c5fff5 Binary files /dev/null and b/images/screenshot.png differ diff --git a/images/tn.png b/images/tn.png new file mode 100644 index 0000000..9ea329a Binary files /dev/null and b/images/tn.png differ diff --git a/layouts/404.html b/layouts/404.html new file mode 100644 index 0000000..2340809 --- /dev/null +++ b/layouts/404.html @@ -0,0 +1,16 @@ +{{ partial "header.html" . }} + +
+ +

+ [404] + # _ +

+ +

+ not found +

+ +
+ +{{ partial "footer.html" . }} diff --git a/layouts/_default/list.html b/layouts/_default/list.html new file mode 100644 index 0000000..cf5b2b2 --- /dev/null +++ b/layouts/_default/list.html @@ -0,0 +1,8 @@ +{{ partial "header.html" . }} +
+

{{ .Title }}

+ {{ range .Data.Pages }} + {{ partial "article-list-item.html" . }} + {{ end }} +
+{{ partial "footer.html" . }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..b9ff539 --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,7 @@ +{{ partial "header.html" . }} + +
+ {{ partial "article.html" . }} +
+ +{{ partial "footer.html" . }} diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..2744d98 --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,5 @@ +{{ partial "header.html" . }} + +{{ partial "homepage.html" . }} + +{{ partial "footer.html" . }} diff --git a/layouts/partials/article-list-item.html b/layouts/partials/article-list-item.html new file mode 100644 index 0000000..7f52120 --- /dev/null +++ b/layouts/partials/article-list-item.html @@ -0,0 +1,10 @@ + diff --git a/layouts/partials/article.html b/layouts/partials/article.html new file mode 100644 index 0000000..ef401d4 --- /dev/null +++ b/layouts/partials/article.html @@ -0,0 +1,28 @@ +{{ $baseurl := .Site.BaseURL }} +
+
+ published on + +{{ with .Params.categories }} + in + +{{ range . }} + {{ . }} +{{ end }} + +{{ end }} +{{ with .Params.tags }} +
+ tags: + +{{ range . }} + {{ . }} +{{ end }} + +{{ end }} +
+

{{ .Title }}

+
+ {{ .Content }} +
+
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html new file mode 100644 index 0000000..f2e865c --- /dev/null +++ b/layouts/partials/footer.html @@ -0,0 +1,10 @@ + + +
+
+ © {{ if eq .Title .Site.Title }}{{ .Site.LastChange.Format "2006" }}{{ else }}{{ .Date.Format "2006" }} {{ end }} {{ .Site.Title }} - CC BY 4.0 +
+
+ + + diff --git a/layouts/partials/header.html b/layouts/partials/header.html new file mode 100644 index 0000000..205181c --- /dev/null +++ b/layouts/partials/header.html @@ -0,0 +1,21 @@ + + + + +{{ .Hugo.Generator }} + + + + +{{ $isHomePage := eq .Title .Site.Title }}{{ .Title }}{{ if eq $isHomePage false }} - {{ .Site.Title }}{{ end }} + + + +
+
+ [{{ .Site.Title }}] + # _ +
+
+ +
diff --git a/layouts/partials/hero.html b/layouts/partials/hero.html new file mode 100644 index 0000000..3425f28 --- /dev/null +++ b/layouts/partials/hero.html @@ -0,0 +1,12 @@ +

+ [base16] + # _ +

+ + + +
+ Add your own "layouts/partials/hero.html" to replace this text. +
diff --git a/layouts/partials/homepage.html b/layouts/partials/homepage.html new file mode 100644 index 0000000..ced99ad --- /dev/null +++ b/layouts/partials/homepage.html @@ -0,0 +1,36 @@ +{{ $baseurl := .Site.BaseURL }} +
+ + {{ partial "hero.html" . }} + +

Recent Posts

+ +
+ {{ range first 3 .Data.Pages }} + {{ partial "article-list-item.html" . }} + {{ end }} +
+ +

Categories

+ +
+ {{ range $name, $value := .Site.Taxonomies.categories }} +

+ {{ title $name }} + ({{ .Count }}) +

+ {{ end }} +
+ +

Tags

+ +
+ {{ range $name, $value := .Site.Taxonomies.tags }} + + {{ $name }} + ({{ .Count }}) + + {{ end }} +
+ +
diff --git a/static/css/style-cssnext.css b/static/css/style-cssnext.css new file mode 100644 index 0000000..96d12d0 --- /dev/null +++ b/static/css/style-cssnext.css @@ -0,0 +1,494 @@ +/* Base16 Eighties Colorscheme by Chris Kempson (http://chriskempson.com) */ + +:root { + --base00: #2d2d2d; + --base01: #393939; + --base02: #515151; + --base03: #747369; + --base04: #a09f93; + --base05: #d3d0c8; + --base06: #e8e6df; + --base07: #f2f0ec; + --base08: #f2777a; + --base09: #f99157; + --base0a: #ffcc66; + --base0b: #99cc99; + --base0c: #66cccc; + --base0d: #6699cc; + --base0e: #cc99cc; + --base0f: #d27b53; +} + +.base00 { color: var(--base00); } +.base01 { color: var(--base01); } +.base02 { color: var(--base02); } +.base03 { color: var(--base03); } +.base04 { color: var(--base04); } +.base05 { color: var(--base05); } +.base06 { color: var(--base06); } +.base07 { color: var(--base07); } +.base08 { color: var(--base08); } +.base09 { color: var(--base09); } +.base0a { color: var(--base0a); } +.base0b { color: var(--base0b); } +.base0c { color: var(--base0c); } +.base0d { color: var(--base0d); } +.base0e { color: var(--base0e); } +.base0f { color: var(--base0f); } + +@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700); +@custom-media --breakpoint-md (max-width: 52em); + +/* General Page Layout */ + +body { + margin: 0; + background-color: var(--base00); + color: var(--base07); + line-height: 1.5; + font-size: 100%; + font-family: 'Source Code Pro', monospace; +} + +.container { + max-width: 52em; + margin-left: auto; + margin-right: auto; +} + +@media (--breakpoint-md) { + .container { + width: 100%; + } +} + +article.single section, +.article-list article { + background-color: var(--base07); + color: var(--base00); + padding-left: 8rem; + padding-right: 8rem; + padding-top: 1rem; + padding-bottom: 1rem; +} + +@media (--breakpoint-md) { + article.single section, + .article-list article { + padding-left: 2rem; + padding-right: 2rem; + } +} + +header, footer { + background-color: var(--base01); + padding-top: 1rem; + padding-bottom: 1rem; +} + +header { + margin-top: 1rem; + margin-bottom: 2rem; +} + +@media (--breakpoint-md) { + header { + margin-top: 0; + padding-left: 2rem; + padding-right: 2rem; + } +} + +footer { + margin-top: 2rem; + margin-bottom: 1rem; + text-align: center; + font-size: 0.9em; + color: var(--base03); +} + +@media (--breakpoint-md) { + footer { + margin-top: 0; + margin-bottom: 0; + } +} + +/* Typography */ + +h1, h2, h3, h4, h5, h6 { + font-weight: bold; + line-height: 1.25; + margin-top: 1em; + margin-bottom: .5em; +} + +p { + margin-top: 0; + margin-bottom: 1rem; +} + +h1 { font-size: 2rem } +h2 { font-size: 1.5rem } +h3 { font-size: 1.25rem } +h4 { font-size: 1rem } +h5 { font-size: .875rem } +h6 { font-size: .75rem } + +pre, code { + font-family: inherit; + font-size: inherit; +} + +/* Header Layout */ + +header a.path { + color: var(--base0d); +} + +header span.caret { + color: var(--base07); +} + +/* Footer Layout */ + +footer a { + color: var(--base03); + text-decoration: none; +} + +/* 404 Page Layout */ + +.page-not-found h1 { + text-align: center; + font-size: 5em; +} + +.page-not-found h2 { + text-align: center; + font-size: 3em; + color: var(--base04); + margin-bottom: 4rem; +} + +@media (--breakpoint-md) { + .page-not-found h1 { + font-size: 3em; + } + + .page-not-found h2 { + font-size: 2em; + } +} + +/* Homepage Layout */ + +@media (--breakpoint-md) { + .homepage { + margin-bottom: 2rem; + } +} + +.homepage h1.site-title { + text-align: center; + font-size: 5em; + color: var(--base0c); +} + +@media (--breakpoint-md) { + .homepage h1.site-title { + font-size: 3em; + } +} + +.homepage h1.headline { + font-size: 3em; + color: var(--base0a); +} + +@media (--breakpoint-md) { + .homepage h1.headline { + padding-left: 2rem; + padding-right: 2rem; + } +} + +.homepage .hero-logo img { + width: 100%; +} + +.homepage section.categories, +.homepage section.tags { + padding-left: 2rem; + padding-right: 2rem; +} + +.homepage .category, +.homepage .category a, +.homepage .tag, +.homepage .tag a { + color: var(--base0e); +} + +.homepage .tag { + margin-right: 2em; +} + +/* Post List Layout */ + +.article-list h1.list-title { + font-size: 3em; + color: var(--base0a); +} + +.article-list article { + padding-top: 4rem; + padding-bottom: 4rem; + margin-bottom: 4rem; +} + +.article-list article h2.headline, +.article-list article h2.headline a { + margin-top: 0; + color: var(--base0d); +} + +.article-list article .meta { + margin-bottom: 1rem; +} + +.article-list article .meta .key { + color: var(--base03); +} + +.article-list article .meta .val, +.article-list article .meta .val a { + color: var(--base0e); +} + +.article-list article section.summary a { color: var(--base0f); } + + +/* Single Post Layout */ + +article.single .meta { + font-size: 0.9em; + text-align: right; +} + +article.single .meta .key { + color: var(--base03); +} + +article.single .meta .val, article.single .meta .val a { + color: var(--base0e); +} + +@media (--breakpoint-md) { + article.single .meta { + padding-left: 2rem; + padding-right: 2rem; + } +} + +article.single h1.headline { + margin-top: 0; + font-size: 3em; + color: var(--base0a); +} + +@media (--breakpoint-md) { + article.single h1.headline { + padding-left: 2rem; + padding-right: 2rem; + } +} + +article.single section.body { + padding-top: 4rem; + padding-bottom: 3rem; +} + +@media (--breakpoint-md) { + article.single section.body { + padding-top: 2rem; + padding-bottom: 1rem; + } +} + +/* Highlight Colors */ + +article.single section.body h1 { color: var(--base0d); } +article.single section.body h2 { color: var(--base0b); } +article.single section.body h3 { color: var(--base09); } +article.single section.body h4 { color: var(--base08); } +article.single section.body h5 { color: var(--base02); } +article.single section.body h6 { color: var(--base03); } + +article.single section.body a { color: var(--base0f); } + +/* Article Elements */ + +article.single pre { + margin-top: 0; + margin-bottom: 1rem; + overflow-x: scroll; + border-radius: 3px; + padding: 2rem; +} + +article.single p code { + padding: 0.2em 0.5em; + border-radius: 3px; + background: var(--base03); + color: var(--base07); +} + +article.single figure { + box-sizing: border-box; + max-width: 52rem; + width: 52rem; + margin-left: -8rem; + margin-right: -8rem; + margin-bottom: 1rem; + padding: 1em; + background-color: var(--base01); +} + +@media (--breakpoint-md) { + article.single figure { + width: 100%; + margin-left: 0; + margin-right: 0; + border-radius: 3px; + } +} + +article.single figure img { + max-width: 100%; + width: 100%; + border-radius: 3px; +} + +article.single figure figcaption { + margin-top: 1rem; +} + +article.single figure figcaption h4 { + margin-top: 0; + text-align: center; + font-style: italic; + font-weight: normal; + color: var(--base07); +} + +article.single table { + border-collapse: separate; + border-spacing: 0; + max-width: 100%; + width: 100%; +} + +article.single th, +article.single td { + padding: .25rem 1rem; + line-height: inherit; + border-bottom-width: 1px; + border-bottom-style: solid; + border-bottom-color: var(--base04); +} + +article.single tr:last-child td { + border-bottom: 0; +} + +article.single th { + text-align: left; + font-weight: bold; + vertical-align: bottom; +} + +article.single td { vertical-align: top } + +article.single blockquote { + margin-left: 2rem; + margin-right: 3rem; + padding-left: 1rem; + border-left: 5px solid var(--base0c); +} + +article.single hr { + border: 0; + border-bottom-style: solid; + border-bottom-width: 1px; + border-bottom-color: var(--base04); +} + +/* Pygments template by Jan T. Sott (https://github.com/idleberg) */ + +pre { background: var(--base00); color: var(--base07) } + +.highlight .hll { background-color: var(--base02) } +.highlight .c { color: var(--base03) } /* Comment */ +.highlight .err { color: var(--base08) } /* Error */ +.highlight .k { color: var(--base0e) } /* Keyword */ +.highlight .l { color: var(--base09) } /* Literal */ +.highlight .n { color: var(--base07) } /* Name */ +.highlight .o { color: var(--base0c) } /* Operator */ +.highlight .p { color: var(--base07) } /* Punctuation */ +.highlight .cm { color: var(--base03) } /* Comment.Multiline */ +.highlight .cp { color: var(--base03) } /* Comment.Preproc */ +.highlight .c1 { color: var(--base03) } /* Comment.Single */ +.highlight .cs { color: var(--base03) } /* Comment.Special */ +.highlight .gd { color: var(--base08) } /* Generic.Deleted */ +.highlight .ge { font-style: italic } /* Generic.Emph */ +.highlight .gh { color: var(--base07); font-weight: bold } /* Generic.Heading */ +.highlight .gi { color: var(--base0b) } /* Generic.Inserted */ +.highlight .gp { color: var(--base03); font-weight: bold } /* Generic.Prompt */ +.highlight .gs { font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: var(--base0c); font-weight: bold } /* Generic.Subheading */ +.highlight .kc { color: var(--base0e) } /* Keyword.Constant */ +.highlight .kd { color: var(--base0e) } /* Keyword.Declaration */ +.highlight .kn { color: var(--base0c) } /* Keyword.Namespace */ +.highlight .kp { color: var(--base0e) } /* Keyword.Pseudo */ +.highlight .kr { color: var(--base0e) } /* Keyword.Reserved */ +.highlight .kt { color: var(--base0a) } /* Keyword.Type */ +.highlight .ld { color: var(--base0b) } /* Literal.Date */ +.highlight .m { color: var(--base09) } /* Literal.Number */ +.highlight .s { color: var(--base0b) } /* Literal.String */ +.highlight .na { color: var(--base0d) } /* Name.Attribute */ +.highlight .nb { color: var(--base07) } /* Name.Builtin */ +.highlight .nc { color: var(--base0a) } /* Name.Class */ +.highlight .no { color: var(--base08) } /* Name.Constant */ +.highlight .nd { color: var(--base0c) } /* Name.Decorator */ +.highlight .ni { color: var(--base07) } /* Name.Entity */ +.highlight .ne { color: var(--base08) } /* Name.Exception */ +.highlight .nf { color: var(--base0d) } /* Name.Function */ +.highlight .nl { color: var(--base07) } /* Name.Label */ +.highlight .nn { color: var(--base0a) } /* Name.Namespace */ +.highlight .nx { color: var(--base0d) } /* Name.Other */ +.highlight .py { color: var(--base07) } /* Name.Property */ +.highlight .nt { color: var(--base0c) } /* Name.Tag */ +.highlight .nv { color: var(--base08) } /* Name.Variable */ +.highlight .ow { color: var(--base0c) } /* Operator.Word */ +.highlight .w { color: var(--base07) } /* Text.Whitespace */ +.highlight .mf { color: var(--base09) } /* Literal.Number.Float */ +.highlight .mh { color: var(--base09) } /* Literal.Number.Hex */ +.highlight .mi { color: var(--base09) } /* Literal.Number.Integer */ +.highlight .mo { color: var(--base09) } /* Literal.Number.Oct */ +.highlight .sb { color: var(--base0b) } /* Literal.String.Backtick */ +.highlight .sc { color: var(--base07) } /* Literal.String.Char */ +.highlight .sd { color: var(--base03) } /* Literal.String.Doc */ +.highlight .s2 { color: var(--base0b) } /* Literal.String.Double */ +.highlight .se { color: var(--base09) } /* Literal.String.Escape */ +.highlight .sh { color: var(--base0b) } /* Literal.String.Heredoc */ +.highlight .si { color: var(--base09) } /* Literal.String.Interpol */ +.highlight .sx { color: var(--base0b) } /* Literal.String.Other */ +.highlight .sr { color: var(--base0b) } /* Literal.String.Regex */ +.highlight .s1 { color: var(--base0b) } /* Literal.String.Single */ +.highlight .ss { color: var(--base0b) } /* Literal.String.Symbol */ +.highlight .bp { color: var(--base07) } /* Name.Builtin.Pseudo */ +.highlight .vc { color: var(--base08) } /* Name.Variable.Class */ +.highlight .vg { color: var(--base08) } /* Name.Variable.Global */ +.highlight .vi { color: var(--base08) } /* Name.Variable.Instance */ +.highlight .il { color: var(--base09) } /* Literal.Number.Integer.Long */ diff --git a/static/css/style.css b/static/css/style.css new file mode 100644 index 0000000..0717cd2 --- /dev/null +++ b/static/css/style.css @@ -0,0 +1,508 @@ + + +@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700); + +/* Base16 Eighties Colorscheme by Chris Kempson (http://chriskempson.com) */ + +.base00 { color: #2d2d2d; } +.base01 { color: #393939; } +.base02 { color: #515151; } +.base03 { color: #747369; } +.base04 { color: #a09f93; } +.base05 { color: #d3d0c8; } +.base06 { color: #e8e6df; } +.base07 { color: #f2f0ec; } +.base08 { color: #f2777a; } +.base09 { color: #f99157; } +.base0a { color: #ffcc66; } +.base0b { color: #99cc99; } +.base0c { color: #66cccc; } +.base0d { color: #6699cc; } +.base0e { color: #cc99cc; } +.base0f { color: #d27b53; } + +/* General Page Layout */ + +body { + margin: 0; + background-color: #2d2d2d; + color: #f2f0ec; + line-height: 1.5; + font-size: 100%; + font-family: 'Source Code Pro', monospace; +} + +.container { + max-width: 52em; + margin-left: auto; + margin-right: auto; +} + +@media (max-width: 52em) { + .container { + width: 100%; + } +} + +article.single section, +.article-list article { + background-color: #f2f0ec; + color: #2d2d2d; + padding-left: 128px; + padding-left: 8rem; + padding-right: 128px; + padding-right: 8rem; + padding-top: 16px; + padding-top: 1rem; + padding-bottom: 16px; + padding-bottom: 1rem; +} + +@media (max-width: 52em) { + article.single section, + .article-list article { + padding-left: 2rem; + padding-right: 2rem; + } +} + +header, footer { + background-color: #393939; + padding-top: 16px; + padding-top: 1rem; + padding-bottom: 16px; + padding-bottom: 1rem; +} + +header { + margin-top: 16px; + margin-top: 1rem; + margin-bottom: 32px; + margin-bottom: 2rem; +} + +@media (max-width: 52em) { + header { + margin-top: 0; + padding-left: 2rem; + padding-right: 2rem; + } +} + +footer { + margin-top: 32px; + margin-top: 2rem; + margin-bottom: 16px; + margin-bottom: 1rem; + text-align: center; + font-size: 0.9em; + color: #747369; +} + +@media (max-width: 52em) { + footer { + margin-top: 0; + margin-bottom: 0; + } +} + +/* Typography */ + +h1, h2, h3, h4, h5, h6 { + font-weight: bold; + line-height: 1.25; + margin-top: 1em; + margin-bottom: .5em; +} + +p { + margin-top: 0; + margin-bottom: 16px; + margin-bottom: 1rem; +} + +h1 { font-size: 32px; font-size: 2rem } +h2 { font-size: 24px; font-size: 1.5rem } +h3 { font-size: 20px; font-size: 1.25rem } +h4 { font-size: 16px; font-size: 1rem } +h5 { font-size: 14px; font-size: .875rem } +h6 { font-size: 12px; font-size: .75rem } + +pre, code { + font-family: inherit; + font-size: inherit; +} + +/* Header Layout */ + +header a.path { + color: #6699cc; +} + +header span.caret { + color: #f2f0ec; +} + +/* Footer Layout */ + +footer a { + color: #747369; + text-decoration: none; +} + +/* 404 Page Layout */ + +.page-not-found h1 { + text-align: center; + font-size: 5em; +} + +.page-not-found h2 { + text-align: center; + font-size: 3em; + color: #a09f93; + margin-bottom: 64px; + margin-bottom: 4rem; +} + +@media (max-width: 52em) { + .page-not-found h1 { + font-size: 3em; + } + + .page-not-found h2 { + font-size: 2em; + } +} + +/* Homepage Layout */ + +@media (max-width: 52em) { + .homepage { + margin-bottom: 2rem; + } +} + +.homepage h1.site-title { + text-align: center; + font-size: 5em; + color: #66cccc; +} + +@media (max-width: 52em) { + .homepage h1.site-title { + font-size: 3em; + } +} + +.homepage h1.headline { + font-size: 3em; + color: #ffcc66; +} + +@media (max-width: 52em) { + .homepage h1.headline { + padding-left: 2rem; + padding-right: 2rem; + } +} + +.homepage .hero-logo img { + width: 100%; +} + +.homepage section.categories, +.homepage section.tags { + padding-left: 32px; + padding-left: 2rem; + padding-right: 32px; + padding-right: 2rem; +} + +.homepage .category, +.homepage .category a, +.homepage .tag, +.homepage .tag a { + color: #cc99cc; +} + +.homepage .tag { + margin-right: 2em; +} + +/* Post List Layout */ + +.article-list h1.list-title { + font-size: 3em; + color: #ffcc66; +} + +.article-list article { + padding-top: 64px; + padding-top: 4rem; + padding-bottom: 64px; + padding-bottom: 4rem; + margin-bottom: 64px; + margin-bottom: 4rem; +} + +.article-list article h2.headline, +.article-list article h2.headline a { + margin-top: 0; + color: #6699cc; +} + +.article-list article .meta { + margin-bottom: 16px; + margin-bottom: 1rem; +} + +.article-list article .meta .key { + color: #747369; +} + +.article-list article .meta .val, +.article-list article .meta .val a { + color: #cc99cc; +} + +.article-list article section.summary a { color: #d27b53; } + + +/* Single Post Layout */ + +article.single .meta { + font-size: 0.9em; + text-align: right; +} + +article.single .meta .key { + color: #747369; +} + +article.single .meta .val, article.single .meta .val a { + color: #cc99cc; +} + +@media (max-width: 52em) { + article.single .meta { + padding-left: 2rem; + padding-right: 2rem; + } +} + +article.single h1.headline { + margin-top: 0; + font-size: 3em; + color: #ffcc66; +} + +@media (max-width: 52em) { + article.single h1.headline { + padding-left: 2rem; + padding-right: 2rem; + } +} + +article.single section.body { + padding-top: 64px; + padding-top: 4rem; + padding-bottom: 48px; + padding-bottom: 3rem; +} + +@media (max-width: 52em) { + article.single section.body { + padding-top: 2rem; + padding-bottom: 1rem; + } +} + +/* Highlight Colors */ + +article.single section.body h1 { color: #6699cc; } +article.single section.body h2 { color: #99cc99; } +article.single section.body h3 { color: #f99157; } +article.single section.body h4 { color: #f2777a; } +article.single section.body h5 { color: #515151; } +article.single section.body h6 { color: #747369; } + +article.single section.body a { color: #d27b53; } + +/* Article Elements */ + +article.single pre { + margin-top: 0; + margin-bottom: 16px; + margin-bottom: 1rem; + overflow-x: scroll; + border-radius: 3px; + padding: 32px; + padding: 2rem; +} + +article.single p code { + padding: 0.2em 0.5em; + border-radius: 3px; + background: #747369; + color: #f2f0ec; +} + +article.single figure { + box-sizing: border-box; + max-width: 832px; + max-width: 52rem; + width: 832px; + width: 52rem; + margin-left: -128px; + margin-left: -8rem; + margin-right: -128px; + margin-right: -8rem; + margin-bottom: 16px; + margin-bottom: 1rem; + padding: 1em; + background-color: #393939; +} + +@media (max-width: 52em) { + article.single figure { + width: 100%; + margin-left: 0; + margin-right: 0; + border-radius: 3px; + } +} + +article.single figure img { + max-width: 100%; + width: 100%; + border-radius: 3px; +} + +article.single figure figcaption { + margin-top: 16px; + margin-top: 1rem; +} + +article.single figure figcaption h4 { + margin-top: 0; + text-align: center; + font-style: italic; + font-weight: normal; + color: #f2f0ec; +} + +article.single table { + border-collapse: separate; + border-spacing: 0; + max-width: 100%; + width: 100%; +} + +article.single th, +article.single td { + padding: 4px 16px; + padding: .25rem 1rem; + line-height: inherit; + border-bottom-width: 1px; + border-bottom-style: solid; + border-bottom-color: #a09f93; +} + +article.single tr:last-child td { + border-bottom: 0; +} + +article.single th { + text-align: left; + font-weight: bold; + vertical-align: bottom; +} + +article.single td { vertical-align: top } + +article.single blockquote { + margin-left: 32px; + margin-left: 2rem; + margin-right: 48px; + margin-right: 3rem; + padding-left: 16px; + padding-left: 1rem; + border-left: 5px solid #66cccc; +} + +article.single hr { + border: 0; + border-bottom-style: solid; + border-bottom-width: 1px; + border-bottom-color: #a09f93; +} + +/* Pygments template by Jan T. Sott (https://github.com/idleberg) */ + +pre { background: #2d2d2d; color: #f2f0ec } + +.highlight .hll { background-color: #515151 } +.highlight .c { color: #747369 } /* Comment */ +.highlight .err { color: #f2777a } /* Error */ +.highlight .k { color: #cc99cc } /* Keyword */ +.highlight .l { color: #f99157 } /* Literal */ +.highlight .n { color: #f2f0ec } /* Name */ +.highlight .o { color: #66cccc } /* Operator */ +.highlight .p { color: #f2f0ec } /* Punctuation */ +.highlight .cm { color: #747369 } /* Comment.Multiline */ +.highlight .cp { color: #747369 } /* Comment.Preproc */ +.highlight .c1 { color: #747369 } /* Comment.Single */ +.highlight .cs { color: #747369 } /* Comment.Special */ +.highlight .gd { color: #f2777a } /* Generic.Deleted */ +.highlight .ge { font-style: italic } /* Generic.Emph */ +.highlight .gh { color: #f2f0ec; font-weight: bold } /* Generic.Heading */ +.highlight .gi { color: #99cc99 } /* Generic.Inserted */ +.highlight .gp { color: #747369; font-weight: bold } /* Generic.Prompt */ +.highlight .gs { font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: #66cccc; font-weight: bold } /* Generic.Subheading */ +.highlight .kc { color: #cc99cc } /* Keyword.Constant */ +.highlight .kd { color: #cc99cc } /* Keyword.Declaration */ +.highlight .kn { color: #66cccc } /* Keyword.Namespace */ +.highlight .kp { color: #cc99cc } /* Keyword.Pseudo */ +.highlight .kr { color: #cc99cc } /* Keyword.Reserved */ +.highlight .kt { color: #ffcc66 } /* Keyword.Type */ +.highlight .ld { color: #99cc99 } /* Literal.Date */ +.highlight .m { color: #f99157 } /* Literal.Number */ +.highlight .s { color: #99cc99 } /* Literal.String */ +.highlight .na { color: #6699cc } /* Name.Attribute */ +.highlight .nb { color: #f2f0ec } /* Name.Builtin */ +.highlight .nc { color: #ffcc66 } /* Name.Class */ +.highlight .no { color: #f2777a } /* Name.Constant */ +.highlight .nd { color: #66cccc } /* Name.Decorator */ +.highlight .ni { color: #f2f0ec } /* Name.Entity */ +.highlight .ne { color: #f2777a } /* Name.Exception */ +.highlight .nf { color: #6699cc } /* Name.Function */ +.highlight .nl { color: #f2f0ec } /* Name.Label */ +.highlight .nn { color: #ffcc66 } /* Name.Namespace */ +.highlight .nx { color: #6699cc } /* Name.Other */ +.highlight .py { color: #f2f0ec } /* Name.Property */ +.highlight .nt { color: #66cccc } /* Name.Tag */ +.highlight .nv { color: #f2777a } /* Name.Variable */ +.highlight .ow { color: #66cccc } /* Operator.Word */ +.highlight .w { color: #f2f0ec } /* Text.Whitespace */ +.highlight .mf { color: #f99157 } /* Literal.Number.Float */ +.highlight .mh { color: #f99157 } /* Literal.Number.Hex */ +.highlight .mi { color: #f99157 } /* Literal.Number.Integer */ +.highlight .mo { color: #f99157 } /* Literal.Number.Oct */ +.highlight .sb { color: #99cc99 } /* Literal.String.Backtick */ +.highlight .sc { color: #f2f0ec } /* Literal.String.Char */ +.highlight .sd { color: #747369 } /* Literal.String.Doc */ +.highlight .s2 { color: #99cc99 } /* Literal.String.Double */ +.highlight .se { color: #f99157 } /* Literal.String.Escape */ +.highlight .sh { color: #99cc99 } /* Literal.String.Heredoc */ +.highlight .si { color: #f99157 } /* Literal.String.Interpol */ +.highlight .sx { color: #99cc99 } /* Literal.String.Other */ +.highlight .sr { color: #99cc99 } /* Literal.String.Regex */ +.highlight .s1 { color: #99cc99 } /* Literal.String.Single */ +.highlight .ss { color: #99cc99 } /* Literal.String.Symbol */ +.highlight .bp { color: #f2f0ec } /* Name.Builtin.Pseudo */ +.highlight .vc { color: #f2777a } /* Name.Variable.Class */ +.highlight .vg { color: #f2777a } /* Name.Variable.Global */ +.highlight .vi { color: #f2777a } /* Name.Variable.Instance */ +.highlight .il { color: #f99157 } /* Literal.Number.Integer.Long */ diff --git a/static/css/style.min.css b/static/css/style.min.css new file mode 100644 index 0000000..ed56850 --- /dev/null +++ b/static/css/style.min.css @@ -0,0 +1 @@ +@import url(https://fonts.googleapis.com/css?family=Roboto+Mono:400,700);.base00{color:#2d2d2d}.base01{color:#393939}.base02{color:#515151}.base03{color:#747369}.base04{color:#a09f93}.base05{color:#d3d0c8}.base06{color:#e8e6df}.base07{color:#f2f0ec}.base08{color:#f2777a}.base09{color:#f99157}.base0a{color:#fc6}.base0b{color:#9c9}.base0c{color:#6cc}.base0d{color:#69c}.base0e{color:#c9c}.base0f{color:#d27b53}body{margin:0;background-color:#2d2d2d;color:#f2f0ec;line-height:1.5;font-size:100%;font-family:Source Code Pro,monospace}.container{max-width:52em;margin-left:auto;margin-right:auto}@media (max-width:52em){.container{width:100%}}.article-list article,article.single section{background-color:#f2f0ec;color:#2d2d2d;padding-left:8pc;padding:1rem 8rem;padding-right:8pc;padding-top:1pc;padding-bottom:1pc}@media (max-width:52em){.article-list article,article.single section{padding-left:2rem;padding-right:2rem}}footer,header{background-color:#393939;padding-top:1pc;padding-top:1rem;padding-bottom:1pc;padding-bottom:1rem}header{margin-top:1pc;margin-top:1rem;margin-bottom:2pc;margin-bottom:2rem}@media (max-width:52em){header{margin-top:0;padding-left:2rem;padding-right:2rem}}footer{margin-top:2pc;margin-top:2rem;margin-bottom:1pc;margin-bottom:1rem;text-align:center;font-size:.9em;color:#747369}@media (max-width:52em){footer{margin-top:0;margin-bottom:0}}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.25;margin-top:1em;margin-bottom:.5em}p{margin-top:0;margin-bottom:1pc;margin-bottom:1rem}h1{font-size:2pc;font-size:2rem}h2{font-size:24px;font-size:1.5rem}h3{font-size:20px;font-size:1.25rem}h4{font-size:1pc;font-size:1rem}h5{font-size:14px;font-size:.875rem}h6{font-size:9pt;font-size:.75rem}code,pre{font-family:inherit;font-size:inherit}header a.path{color:#69c}header span.caret{color:#f2f0ec}footer a{color:#747369;text-decoration:none}.page-not-found h1{text-align:center;font-size:5em}.page-not-found h2{text-align:center;font-size:3em;color:#a09f93;margin-bottom:4pc;margin-bottom:4rem}@media (max-width:52em){.page-not-found h1{font-size:3em}.page-not-found h2{font-size:2em}}@media (max-width:52em){.homepage{margin-bottom:2rem}}.homepage h1.site-title{text-align:center;font-size:5em;color:#6cc}@media (max-width:52em){.homepage h1.site-title{font-size:3em}}.homepage h1.headline{font-size:3em;color:#fc6}@media (max-width:52em){.homepage h1.headline{padding-left:2rem;padding-right:2rem}}.homepage .hero-logo img{width:100%}.homepage section.categories,.homepage section.tags{padding-left:2pc;padding-left:2rem;padding-right:2pc;padding-right:2rem}.homepage .category,.homepage .category a,.homepage .tag,.homepage .tag a{color:#c9c}.homepage .tag{margin-right:2em}.article-list h1.list-title{font-size:3em;color:#fc6}.article-list article{padding-top:4pc;padding-top:4rem;padding-bottom:4pc;padding-bottom:4rem;margin-bottom:4pc;margin-bottom:4rem}.article-list article h2.headline,.article-list article h2.headline a{margin-top:0;color:#69c}.article-list article .meta{margin-bottom:1pc;margin-bottom:1rem}.article-list article .meta .key{color:#747369}.article-list article .meta .val,.article-list article .meta .val a{color:#c9c}.article-list article section.summary a{color:#d27b53}article.single .meta{font-size:.9em;text-align:right}article.single .meta .key{color:#747369}article.single .meta .val,article.single .meta .val a{color:#c9c}@media (max-width:52em){article.single .meta{padding-left:2rem;padding-right:2rem}}article.single h1.headline{margin-top:0;font-size:3em;color:#fc6}@media (max-width:52em){article.single h1.headline{padding-left:2rem;padding-right:2rem}}article.single section.body{padding-top:4pc;padding-top:4rem;padding-bottom:3pc;padding-bottom:3rem}@media (max-width:52em){article.single section.body{padding-top:2rem;padding-bottom:1rem}}article.single section.body h1{color:#69c}article.single section.body h2{color:#9c9}article.single section.body h3{color:#f99157}article.single section.body h4{color:#f2777a}article.single section.body h5{color:#515151}article.single section.body h6{color:#747369}article.single section.body a{color:#d27b53}article.single pre{margin-top:0;margin-bottom:1pc;margin-bottom:1rem;overflow-x:scroll;border-radius:3px;padding:2pc;padding:2rem}article.single p code{padding:.2em .5em;border-radius:3px;background:#747369;color:#f2f0ec}article.single figure{box-sizing:border-box;max-width:52pc;max-width:52rem;width:52pc;width:52rem;margin-left:-8pc;margin-left:-8rem;margin-right:-8pc;margin-right:-8rem;margin-bottom:1pc;margin-bottom:1rem;padding:1em;background-color:#393939}@media (max-width:52em){article.single figure{width:100%;margin-left:0;margin-right:0;border-radius:3px}}article.single figure img{max-width:100%;width:100%;border-radius:3px}article.single figure figcaption{margin-top:1pc;margin-top:1rem}article.single figure figcaption h4{margin-top:0;text-align:center;font-style:italic;font-weight:400;color:#f2f0ec}article.single table{border-collapse:separate;border-spacing:0;max-width:100%;width:100%}article.single td,article.single th{padding:4px 1pc;padding:.25rem 1rem;line-height:inherit;border-bottom-width:1px;border-bottom-style:solid;border-bottom-color:#a09f93}article.single tr:last-child td{border-bottom:0}article.single th{text-align:left;font-weight:700;vertical-align:bottom}article.single td{vertical-align:top}article.single blockquote{margin-left:2pc;margin-left:2rem;margin-right:3pc;margin-right:3rem;padding-left:1pc;padding-left:1rem;border-left:5px solid #6cc}article.single hr{border:0;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#a09f93}pre{background:#2d2d2d;color:#f2f0ec}.highlight .hll{background-color:#515151}.highlight .c{color:#747369}.highlight .err{color:#f2777a}.highlight .k{color:#c9c}.highlight .l{color:#f99157}.highlight .n{color:#f2f0ec}.highlight .o{color:#6cc}.highlight .p{color:#f2f0ec}.highlight .c1,.highlight .cm,.highlight .cp,.highlight .cs{color:#747369}.highlight .gd{color:#f2777a}.highlight .ge{font-style:italic}.highlight .gh{color:#f2f0ec;font-weight:700}.highlight .gi{color:#9c9}.highlight .gp{color:#747369}.highlight .gp,.highlight .gs,.highlight .gu{font-weight:700}.highlight .gu{color:#6cc}.highlight .kc,.highlight .kd{color:#c9c}.highlight .kn{color:#6cc}.highlight .kp,.highlight .kr{color:#c9c}.highlight .kt{color:#fc6}.highlight .ld{color:#9c9}.highlight .m{color:#f99157}.highlight .s{color:#9c9}.highlight .na{color:#69c}.highlight .nb{color:#f2f0ec}.highlight .nc{color:#fc6}.highlight .no{color:#f2777a}.highlight .nd{color:#6cc}.highlight .ni{color:#f2f0ec}.highlight .ne{color:#f2777a}.highlight .nf{color:#69c}.highlight .nl{color:#f2f0ec}.highlight .nn{color:#fc6}.highlight .nx{color:#69c}.highlight .py{color:#f2f0ec}.highlight .nt{color:#6cc}.highlight .nv{color:#f2777a}.highlight .ow{color:#6cc}.highlight .w{color:#f2f0ec}.highlight .mf,.highlight .mh,.highlight .mi,.highlight .mo{color:#f99157}.highlight .sb{color:#9c9}.highlight .sc{color:#f2f0ec}.highlight .sd{color:#747369}.highlight .s2{color:#9c9}.highlight .se{color:#f99157}.highlight .sh{color:#9c9}.highlight .si{color:#f99157}.highlight .s1,.highlight .sr,.highlight .ss,.highlight .sx{color:#9c9}.highlight .bp{color:#f2f0ec}.highlight .vc,.highlight .vg,.highlight .vi{color:#f2777a}.highlight .il{color:#f99157} \ No newline at end of file diff --git a/static/img/base16-eighties.svg b/static/img/base16-eighties.svg new file mode 100644 index 0000000..ff951bd --- /dev/null +++ b/static/img/base16-eighties.svg @@ -0,0 +1,21 @@ + + + Base16 Eighties + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/theme.toml b/theme.toml new file mode 100644 index 0000000..717471f --- /dev/null +++ b/theme.toml @@ -0,0 +1,15 @@ +# theme.toml template for a Hugo theme +# See https://github.com/spf13/hugoThemes#themetoml for an example + +name = "Base16" +license = "MIT" +licenselink = "http://htdvisser.mit-license.org/" +description = "Base16 is a simple and colorful theme with the base16 eighties colorscheme" +homepage = "https://htdvisser.github.io/hugo-base16-theme/" +tags = ["blog", "syntax highlighting"] +features = ["blog", "syntax highlighting"] +min_version = 0.14 + +[author] + name = "Hylke Visser" + homepage = "https://github.com/htdvisser" -- cgit v1.2.3