Initial commit

pull/3/head
Maik de Kruif 4 years ago
commit 7735f87ac0
No known key found for this signature in database
GPG Key ID: 9C085A705D588C2F
  1. 2
      .gitignore
  2. 13
      archetypes/default.md
  3. 13
      archetypes/posts.md
  4. 172
      config.toml
  5. 15
      content/about.md
  6. 18
      content/portfolio.md
  7. 14
      content/posts/test.md
  8. 3
      resources/_gen/assets/scss/scss/main.scss_de1a7f5f1c8c46959803c429bb697ff0.content
  9. 1
      resources/_gen/assets/scss/scss/main.scss_de1a7f5f1c8c46959803c429bb697ff0.json
  10. BIN
      static/android-chrome-192x192.png
  11. BIN
      static/android-chrome-512x512.png
  12. BIN
      static/apple-touch-icon.png
  13. BIN
      static/favicon-16x16.png
  14. BIN
      static/favicon-32x32.png
  15. BIN
      static/favicon.ico
  16. BIN
      static/mstile-150x150.png
  17. 33
      static/safari-pinned-tab.svg
  18. 19
      static/site.webmanifest
  19. 8
      themes/maik-blog/archetypes/default.md
  20. 10
      themes/maik-blog/archetypes/posts.md
  21. 1
      themes/maik-blog/assets/js/main.js
  22. 22
      themes/maik-blog/assets/js/menu.js
  23. 25
      themes/maik-blog/assets/js/theme.js
  24. 99
      themes/maik-blog/assets/scss/_buttons.scss
  25. 53
      themes/maik-blog/assets/scss/_fonts.scss
  26. 49
      themes/maik-blog/assets/scss/_footer.scss
  27. 50
      themes/maik-blog/assets/scss/_header.scss
  28. 72
      themes/maik-blog/assets/scss/_list.scss
  29. 71
      themes/maik-blog/assets/scss/_logo.scss
  30. 353
      themes/maik-blog/assets/scss/_main.scss
  31. 67
      themes/maik-blog/assets/scss/_menu.scss
  32. 3
      themes/maik-blog/assets/scss/_mixins.scss
  33. 367
      themes/maik-blog/assets/scss/_normalize.scss
  34. 34
      themes/maik-blog/assets/scss/_sharing-buttons.scss
  35. 191
      themes/maik-blog/assets/scss/_single.scss
  36. 24
      themes/maik-blog/assets/scss/_variables.scss
  37. 16
      themes/maik-blog/assets/scss/main.scss
  38. 36
      themes/maik-blog/i18n/en.toml
  39. 36
      themes/maik-blog/layouts/404.html
  40. 22
      themes/maik-blog/layouts/_default/baseof.html
  41. 35
      themes/maik-blog/layouts/_default/list.html
  42. 52
      themes/maik-blog/layouts/_default/single.html
  43. 21
      themes/maik-blog/layouts/index.html
  44. 10
      themes/maik-blog/layouts/partials/favicons.html
  45. 24
      themes/maik-blog/layouts/partials/footer.html
  46. 65
      themes/maik-blog/layouts/partials/head.html
  47. 19
      themes/maik-blog/layouts/partials/header.html
  48. 15
      themes/maik-blog/layouts/partials/javascript.html
  49. 15
      themes/maik-blog/layouts/partials/logo.html
  50. 8
      themes/maik-blog/layouts/partials/menu.html
  51. 20
      themes/maik-blog/layouts/partials/pagination.html
  52. 160
      themes/maik-blog/layouts/partials/sharing-buttons.html
  53. 4
      themes/maik-blog/layouts/partials/social-icons.html
  54. 279
      themes/maik-blog/layouts/partials/svg.html
  55. 5
      themes/maik-blog/layouts/partials/theme-icon.html
  56. 26
      themes/maik-blog/layouts/posts/rss.xml
  57. 153
      themes/maik-blog/layouts/posts/single.html
  58. 26
      themes/maik-blog/layouts/rss.xml
  59. 17
      themes/maik-blog/layouts/shortcodes/code.html
  60. 5
      themes/maik-blog/layouts/shortcodes/image.html
  61. BIN
      themes/maik-blog/static/fonts/Inter-UI-Bold.woff
  62. BIN
      themes/maik-blog/static/fonts/Inter-UI-Bold.woff2
  63. BIN
      themes/maik-blog/static/fonts/Inter-UI-BoldItalic.woff
  64. BIN
      themes/maik-blog/static/fonts/Inter-UI-BoldItalic.woff2
  65. BIN
      themes/maik-blog/static/fonts/Inter-UI-Italic.woff
  66. BIN
      themes/maik-blog/static/fonts/Inter-UI-Italic.woff2
  67. BIN
      themes/maik-blog/static/fonts/Inter-UI-Medium.woff
  68. BIN
      themes/maik-blog/static/fonts/Inter-UI-Medium.woff2
  69. BIN
      themes/maik-blog/static/fonts/Inter-UI-MediumItalic.woff
  70. BIN
      themes/maik-blog/static/fonts/Inter-UI-MediumItalic.woff2
  71. BIN
      themes/maik-blog/static/fonts/Inter-UI-Regular.woff
  72. BIN
      themes/maik-blog/static/fonts/Inter-UI-Regular.woff2
  73. 14
      themes/maik-blog/theme.toml

2
.gitignore vendored

@ -0,0 +1,2 @@
# Hugo default output directory
public/

@ -0,0 +1,13 @@
+++
author = "Maik de Kruif"
title = "{{ replace .Name "-" " " | title }}"
date = {{ .Date }}
description = ""
images = []
tags = [
"untagged",
]
categories = [
"uncategorized",
]
+++

@ -0,0 +1,13 @@
+++
author = "Maik de Kruif"
title = "{{ replace .Name "-" " " | title }}"
date = {{ .Date }}
description = ""
images = []
tags = [
"untagged",
]
categories = [
"uncategorized",
]
+++

@ -0,0 +1,172 @@
# baseURL = "https://blog.maik.dev/"
baseURL = "http://localhost:1313/"
title = "Maik de Kruif"
languageCode = "en-us"
# theme = "hello-friend-ng"
theme = "maik-blog"
paginate = 10
rssLimit = 10
copyright = "© Maik de Kruif (maik_dev). All rights reserved."
PygmentsCodeFences = true
PygmentsStyle = "monokai"
archetypeDir = "archetypes"
contentDir = "content"
dataDir = "data"
layoutDir = "layouts"
publishDir = "public"
buildDrafts = false
buildFuture = false
buildExpired = false
canonifyURLs = true
enableRobotsTXT = true
enableGitInfo = false
enableEmoji = true
enableMissingTranslationPlaceholders = false
disableRSS = false
disableSitemap = false
disable404 = false
disableHugoGeneratorInject = false
[permalinks]
posts = "/posts/:year/:month/:title/"
[author]
name = "Maik de Kruif"
[params]
dateform = "Jan 2, 2006"
dateformShort = "Jan 2"
dateformNum = "2006-01-02"
dateformNumTime = "2006-01-02 15:04 -0700"
# Metadata mostly used in document's head
description = "Hey there, my name is Maik de Kruif, I create websites, bots and other kinds of software. At the moment, I'm still studying computer science at Avans University of Applied Sciences. I am also a big fan of open-source software, which is why you'll find many of my projects on Github. And last but not least, I love playing around with cyber-security related stuff."
keywords = ""
images = [""]
homeSubtitle = "Maik de Kruif (maik_dev)"
# Prefix of link to the git commit detail page. GitInfo must be enabled.
# gitUrl = ""
# Set disableReadOtherPosts to true in order to hide the links to other posts.
disableReadOtherPosts = false
# Sharing buttons
# There are a lot of buttons preconfigured. If you want to change them,
# generate the buttons here: https://sharingbuttons.io
# and add them into your own `layouts/partials/sharing-buttons.html`
enableSharingButtons = true
# Integrate Javascript files or stylesheets by adding the url to the external assets or by
# linking local files with their path relative to the static folder, e.g. "css/styles.css"
customCSS = []
customJS = []
# Toggle this option need to rebuild SCSS, requires extended version of Hugo
justifyContent = false # Set "text-align: justify" to .post-content.
# Default theme "light" or "dark"
defaultTheme = "dark"
themeColor = "#252627"
# Colors for favicons
[params.favicon.color]
mask = "#252627"
msapplication = "#252627"
theme = "#252627"
[params.logo]
logoText = "$ cd /home/"
logoHomeLink = "/"
# Set true to remove the logo cursor entirely.
# logoCursorDisabled = false
# Set to a valid CSS color to change the cursor in the logo.
# logoCursorColor = "#67a2c9"
# Set to a valid CSS time value to change the animation duration, "0s" to disable.
# logoCursorAnimate = "2s"
# Uncomment this if you want a portrait on your start page
# [params.portrait]
# path = "/img/image.jpg"
# alt = "Portrait"
# maxWidth = "50px"
# Social icons
[[params.social]]
name = "email"
url = "mailto:maik@maik.dev"
[[params.social]]
name = "github"
url = "https://github.com/maikka39"
[[params.social]]
name = "linkedin"
url = "https://www.linkedin.com/in/maikdekruif/"
[[params.social]]
name = "stackoverflow"
url = "https://stackoverflow.com/users/9146982/maik-de-kruif"
[[params.social]]
name = "rss"
url = "posts/index.xml"
[[params.social]]
name = "twitter"
url = "https://twitter.com/maik_dev"
# [[params.social]]
# name = "hackerrank"
# url = "https://www.hackerrank.com/maik_dev"
[[params.social]]
name = "instagram"
url = "https://www.instagram.com/maik.dev/"
# [[params.social]]
# name = "medium"
# url = "https://medium.com/@maikka39"
[[params.social]]
name = "steam"
url = "https://steamcommunity.com/id/maikka39"
[[params.social]]
name = "reddit"
url = "https://www.reddit.com/user/maikka39"
[[params.social]]
name = "lbry"
url = "https://lbry.tv/@Maik:c"
[[params.social]]
name = "youtube"
url = "https://www.youtube.com/channel/UCepNO6s7q0Kcyn8cc3rZNFA"
[languages]
[languages.en]
subtitle = "maik.dev"
weight = 1
copyright = 'All rights reserved.'
[menu]
[[menu.main]]
identifier = "about"
name = "About"
url = "about/"
[[menu.main]]
identifier = "portfolio"
name = "Portfolio"
url = "portfolio/"
[[menu.main]]
identifier = "posts"
name = "Posts"
url = "posts/"

@ -0,0 +1,15 @@
+++
author = "Maik de Kruif"
title = "About"
date = 2020-07-06T16:33:01+02:00
description = ""
images = []
tags = [
"aboutme",
]
categories = [
"me",
]
+++
Hey there, my name is Maik de Kruif, I create websites, bots and other kinds of software. At the moment, I'm still studying computer science at Avans University of Applied Sciences. I am also a big fan of open-source software, which is why you'll find many of my projects on [GitHub](https://github.com/maikka39"). And last but not least, I love playing around with cyber-security related stuff.

@ -0,0 +1,18 @@
+++
author = "Maik de Kruif"
title = "Portfolio"
date = 2020-07-06T16:37:43+02:00
description = "Coming soon!"
images = []
tags = [
"portfolio",
"aboutme",
]
categories = [
"me",
]
+++
## Coming soon
Please come back later.

@ -0,0 +1,14 @@
+++
author = "Maik de Kruif"
title = "Test Post"
date = 2020-07-08T16:41:25+02:00
description = "My first post on this website."
tags = [
"untagged",
]
categories = [
"uncategorized",
]
+++
This page should be working

File diff suppressed because one or more lines are too long

@ -0,0 +1 @@
{"Target":"main.e9b492b7c8114a36f5efea9cdbb748d9ce34ab94852195af017a2411e8f19c3d.css","MediaType":"text/css","Data":{"Integrity":"sha256-6bSSt8gRSjb17+qc27dI2c40q5SFIZWvAXokEejxnD0="}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.3 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 754 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.3 KiB

@ -0,0 +1,33 @@
<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
"http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
width="700.000000pt" height="700.000000pt" viewBox="0 0 700.000000 700.000000"
preserveAspectRatio="xMidYMid meet">
<metadata>
Created by potrace 1.11, written by Peter Selinger 2001-2013
</metadata>
<g transform="translate(0.000000,700.000000) scale(0.100000,-0.100000)"
fill="#000000" stroke="none">
<path d="M3340 6189 c-479 -27 -931 -178 -1330 -444 -172 -115 -274 -198 -415
-340 -432 -433 -694 -971 -771 -1582 -21 -169 -21 -477 0 -646 105 -837 577
-1562 1295 -1991 329 -196 673 -314 1060 -362 167 -21 476 -21 645 0 1148 144
2068 984 2311 2111 32 150 44 243 54 418 30 513 -94 1040 -348 1482 -514 894
-1472 1413 -2501 1354z m1597 -1251 l23 -21 0 -1368 c0 -942 -3 -1376 -11
-1396 -14 -38 -57 -83 -96 -99 -27 -12 -254 -14 -1352 -14 -908 0 -1328 3
-1348 11 -38 14 -83 57 -99 96 -12 27 -14 261 -14 1400 l0 1367 22 23 21 23
1416 0 1415 0 23 -22z"/>
<path d="M2243 4852 c-34 -5 -73 -58 -73 -99 0 -25 8 -43 29 -64 56 -55 148
-30 167 45 7 28 -10 78 -31 96 -18 15 -66 26 -92 22z"/>
<path d="M2270 3320 l0 -910 1230 0 1230 0 0 910 0 910 -1230 0 -1230 0 0
-910z m1380 391 c0 -5 -43 -186 -95 -402 -52 -216 -95 -394 -95 -396 0 -2 -25
-3 -55 -3 -30 0 -55 4 -55 10 0 9 176 748 186 783 4 13 17 17 60 17 30 0 54
-4 54 -9z m-350 -175 l0 -74 -117 -45 c-65 -26 -145 -56 -178 -68 -33 -12 -63
-25 -67 -28 -4 -3 76 -39 177 -80 l185 -73 0 -74 c0 -41 -3 -74 -7 -74 -5 0
-125 51 -268 114 l-260 113 0 68 0 69 260 113 c143 62 263 113 268 113 4 0 7
-33 7 -74z m625 -21 c72 -31 172 -75 223 -97 l93 -41 -3 -65 -3 -66 -259 -113
c-142 -62 -263 -113 -268 -113 -4 0 -8 33 -8 73 l0 74 185 73 c102 40 184 75
182 76 -2 2 -84 34 -183 73 l-179 69 -3 76 -3 76 48 -19 c26 -11 107 -45 178
-76z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.8 KiB

@ -0,0 +1,19 @@
{
"name": "",
"short_name": "",
"icons": [
{
"src": "/android-chrome-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "/android-chrome-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"theme_color": "#ffffff",
"background_color": "#ffffff",
"display": "standalone"
}

@ -0,0 +1,8 @@
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
comments: false
images:
---

@ -0,0 +1,10 @@
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
toc: false
images:
tags:
- untagged
---

@ -0,0 +1 @@
// Some code could be here ...

@ -0,0 +1,22 @@
// Mobile menu
const menuTrigger = document.querySelector(".menu-trigger");
const menu = document.querySelector(".menu");
const mobileQuery = getComputedStyle(document.body).getPropertyValue(
"--phoneWidth"
);
const isMobile = () => window.matchMedia(mobileQuery).matches;
const isMobileMenu = () => {
menuTrigger && menuTrigger.classList.toggle("hidden", !isMobile());
menu && menu.classList.toggle("hidden", isMobile());
};
isMobileMenu();
menuTrigger &&
menuTrigger.addEventListener(
"click",
() => menu && menu.classList.toggle("hidden")
);
window.addEventListener("resize", isMobileMenu);

@ -0,0 +1,25 @@
// Toggle theme
const theme = window.localStorage && window.localStorage.getItem("theme");
const themeToggle = document.querySelector(".theme-toggle");
const isDark = theme === "dark";
var metaThemeColor = document.querySelector("meta[name=theme-color]");
if (theme !== null) {
document.body.classList.toggle("dark-theme", isDark);
isDark
? metaThemeColor.setAttribute("content", "#252627")
: metaThemeColor.setAttribute("content", "#fafafa");
}
themeToggle.addEventListener("click", () => {
document.body.classList.toggle("dark-theme");
window.localStorage &&
window.localStorage.setItem(
"theme",
document.body.classList.contains("dark-theme") ? "dark" : "light"
);
document.body.classList.contains("dark-theme")
? metaThemeColor.setAttribute("content", "#252627")
: metaThemeColor.setAttribute("content", "#fafafa");
});

@ -0,0 +1,99 @@
.button-container {
display: table;
margin-left: auto;
margin-right: auto;
}
button,
.button,
a.button {
position: relative;
display: flex;
align-items: center;
justify-content: center;
padding: 8px 18px;
margin-bottom: 5px;
background: $light-background-secondary;
text-decoration: none;
text-align: center;
font-weight: 500;
border-radius: 8px;
border: 1px solid transparent;
appearance: none;
cursor: pointer;
outline: none;
.dark-theme & {
background: $dark-background-secondary;
color: inherit;
}
/* variants */
&.outline {
background: transparent;
border-color: $light-background-secondary;
box-shadow: none;
padding: 8px 18px;
.dark-theme & {
border-color: $dark-background-secondary;
color: inherit;
}
:hover {
transform: none;
box-shadow: none;
}
}
&.primary {
box-shadow: 0 4px 6px rgba(50, 50, 93, .11), 0 1px 3px rgba(0, 0, 0, .08);
&:hover {
box-shadow: 0 2px 6px rgba(50, 50, 93, .21), 0 1px 3px rgba(0, 0, 0, .08);
}
}
&.link {
background: none;
font-size: 1rem;
}
&.small {
font-size: .8rem;
}
&.wide {
min-width: 200px;
padding: 14px 24px;
}
}
.code-toolbar {
margin-bottom: 20px;
.toolbar-item a {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
padding: 3px 8px;
margin-bottom: 5px;
background: $light-background-secondary;
text-decoration: none;
text-align: center;
font-size: 13px;
font-weight: 500;
border-radius: 8px;
border: 1px solid transparent;
appearance: none;
cursor: pointer;
outline: none;
.dark-theme & {
background: $dark-background-secondary;
color: inherit;
}
}
}

@ -0,0 +1,53 @@
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-display: auto;
font-weight: 400;
src: url("../fonts/Inter-UI-Regular.woff2") format("woff2"),
url("../fonts/Inter-UI-Regular.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-display: auto;
font-weight: 400;
src: url("../fonts/Inter-UI-Italic.woff2") format("woff2"),
url("../fonts/Inter-UI-Italic.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-display: auto;
font-weight: 600;
src: url("../fonts/Inter-UI-Medium.woff2") format("woff2"),
url("../fonts/Inter-UI-Medium.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-display: auto;
font-weight: 600;
src: url("../fonts/Inter-UI-MediumItalic.woff2") format("woff2"),
url("../fonts/Inter-UI-MediumItalic.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: normal;
font-display: auto;
font-weight: 800;
src: url("../fonts/Inter-UI-Bold.woff2") format("woff2"),
url("../fonts/Inter-UI-Bold.woff") format("woff");
}
@font-face {
font-family: 'Inter UI';
font-style: italic;
font-display: auto;
font-weight: 800;
src: url("../fonts/Inter-UI-BoldItalic.woff2") format("woff2"),
url("../fonts/Inter-UI-BoldItalic.woff") format("woff");
}

@ -0,0 +1,49 @@
.footer {
padding: 40px 20px;
flex-grow: 0;
color: $light-color-secondary;
&__inner {
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto;
width: 760px;
max-width: 100%;
@media #{$media-size-tablet} {
flex-direction: column;
}
}
&__content {
display: flex;
flex-direction: row;
align-items: center;
font-size: 1rem;
color: $light-color-secondary;
@media #{$media-size-tablet} {
flex-direction: column;
margin-top: 10px;
}
&>*:not(:last-child)::after {
content: "";
padding: 0 5px;
@media #{$media-size-tablet} {
content: "";
padding: 0;
}
}
&>*:last-child {
padding: 0 5px;
@media #{$media-size-tablet} {
padding: 0;
}
}
}
}

@ -0,0 +1,50 @@
.header {
background: #fafafa;
display: flex;
align-items: center;
justify-content: center;
position: relative;
padding: 20px;
.dark-theme & {
background: #252627;
}
&__right {
display: flex;
flex-direction: row;
align-items: center;
@media #{$media-size-phone} {
flex-direction: row-reverse;
}
}
&__inner {
display: flex;
align-items: center;
justify-content: space-between;
margin: 0 auto;
width: 760px;
max-width: 100%;
}
}
.theme-toggle {
display: flex;
align-items: center;
justify-content: center;
line-height: 1;
cursor: pointer;
}
.theme-toggler {
fill: currentColor;
}
.unselectable {
user-select: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
}

@ -0,0 +1,72 @@
.posts {
width: 100%;
max-width: 800px;
text-align: left;
padding: 20px;
margin: 20px auto;
@media #{$media-size-tablet} {
max-width: 660px;
}
&:not(:last-of-type) {
border-bottom: 1px solid $light-border-color;
.dark-theme & {
border-color: $dark-border-color;
}
}
&-group {
display: flex;
margin-bottom: 1.9em;
line-height: normal;
@media #{$media-size-tablet} {
display: block;
}
}
&-list {
flex-grow: 1;
margin: 0;
padding: 0;
list-style: none;
}
.post {
&-title {
font-size: 1rem;
margin: 5px 0 5px 0;
}
&-year {
padding-top: 6px;
margin-right: 1.8em;
font-size: 1.6em;
@include dimmed;
@media #{$media-size-tablet} {
margin: -6px 0 4px;
}
}
&-item {
border-bottom: 1px grey dashed;
a {
display: flex;
justify-content: space-between;
align-items: baseline;
padding: 12px 0;
text-decoration: none;
}
}
&-day {
flex-shrink: 0;
margin-left: 1em;
@include dimmed;
}
}
}

@ -0,0 +1,71 @@
.logo {
display: flex;
align-items: center;
text-decoration: none;
font-weight: bold;
font-display: auto;
font-family: monospace, monospace;
img {
height: 44px;
}
&__mark {
margin-right: 5px;
}
&__text {
font-size: 1.125rem;
}
&__cursor {
display: inline-block;
width: 10px;
height: 1rem;
background: #252627;
margin-left: 5px;
border-radius: 1px;
animation: cursor 1s infinite;
.dark-theme & {
background: #fafafa;
}
}
@media (prefers-reduced-motion: reduce) {
&__cursor {
animation: none;
}
}
}
// // Fading
// @keyframes cursor {
// 0% {
// opacity: 0;
// }
// 50% {
// opacity: 1;
// }
// 100% {
// opacity: 0;
// }
// }
// Blinking
@keyframes cursor {
0% {
visibility: hidden;
}
50% {
visibility: hidden;
}
100% {
visibility: visible;
}
}

@ -0,0 +1,353 @@
html {
box-sizing: border-box;
line-height: 1.6;
letter-spacing: .06em;
scroll-behavior: smooth;
}
*,
*:before,
*:after {
box-sizing: inherit;
}
body {
margin: 0;
padding: 0;
font-family: 'Inter UI', -apple-system, BlinkMacSystemFont, "Roboto", "Segoe UI", Helvetica, Arial, sans-serif;
font-display: auto;
font-size: 1rem;
line-height: 1.54;
background-color: $light-background;
color: $light-color;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
font-feature-settings: "liga", "tnum", "case", "calt", "zero", "ss01", "locl";
-webkit-overflow-scrolling: touch;
-webkit-text-size-adjust: 100%;
display: flex;
min-height: 100vh;
flex-direction: column;
@media #{$media-size-phone} {
font-size: 1rem;
}
&.dark-theme {
background-color: $dark-background;
color: $dark-color;
}
}
h2,
h3,
h4,
h5,
h6 {
display: flex;
align-items: center;
line-height: 1.3;
}
h1 {
font-size: 2.625rem;
}
h2 {
font-size: 1.625rem;
}
h3 {
font-size: 1.375rem;
}
h4 {
font-size: 1.125rem;
}
@media #{$media-size-phone} {
h1 {
font-size: 2rem;
}
h2 {
font-size: 1.4rem;
}
h3 {
font-size: 1.15rem;
}
h4 {
font-size: 1.125rem;
}
}
a {
color: inherit;
}
img {
display: block;
max-width: 100%;
&.left {
margin-right: auto;
}
&.center {
margin-left: auto;
margin-right: auto;
}
&.right {
margin-left: auto;
}
&.circle {
border-radius: 50%;
max-width: 25%;
margin: auto;
}
}
figure {
display: table;
max-width: 100%;
margin: 25px 0;
&.left {
margin-right: auto;
}
&.left-floated {
margin-right: auto;
float: left;
img {
margin: 20px 20px 20px 0;
}
}
&.center {
margin-left: auto;
margin-right: auto;
}
&.right {
margin-left: auto;
}
&.right-floated {
margin-left: auto;
float: right;
img {
margin: 20px 0 20px 20px;
}
}
&.rounded {
img {
border-radius: 50%;
}
}
figcaption {
font-size: 14px;
margin-top: 5px;
opacity: .8;
&.left {
text-align: left;
}
&.center {
text-align: center;
}
&.right {
text-align: right;
}
}
}
code {
font-family: Consolas, Monaco, Andale Mono, Ubuntu Mono, monospace;
font-display: auto;
font-feature-settings: normal;
background: $light-background-secondary;
padding: 1px 6px;
margin: 0 2px;
border-radius: 5px;
font-size: .95rem;
.dark-theme & {
background: $dark-background-secondary;
}
}
pre {
background: #212020;
padding: 10px 10px 10px 20px;
border-radius: 8px;
font-size: .95rem;
overflow: auto;
@media #{$media-size-phone} {
white-space: pre-wrap;
word-wrap: break-word;
}
code {
background: none !important;
color: #ccc;
margin: 0;
padding: 0;
font-size: inherit;
.dark-theme & {
color: inherit;
}
}
}
blockquote {
border-left: 2px solid;
margin: 40px;
padding: 10px 20px;
@media #{$media-size-phone} {
margin: 10px;
padding: 10px;
}
&:before {
content: '';
font-family: Georgia, serif;
font-display: auto;
font-size: 3.875rem;
position: absolute;
left: -40px;
top: -20px;
}
p:first-of-type {
margin-top: 0;
}
p:last-of-type {
margin-bottom: 0;
}
}
ul,
ol {
margin-left: 40px;
padding: 0;
@media #{$media-size-phone} {
margin-left: 20px;
}
}
ol ol {
list-style-type: lower-alpha;
}
.container {
flex: 1 auto;
display: flex;
flex-direction: column;
justify-content: center;
text-align: center;
}
.content {
display: flex;
flex-direction: column;
flex: 1 auto;
align-items: center;
justify-content: center;
margin: 0;
@media #{$media-size-phone} {
margin-top: 0;
}
}
hr {
width: 100%;
border: none;
background: $light-border-color;
height: 1px;
.dark-theme & {
background: $dark-border-color;
}
}
svg {
height: 1em;
}
.hidden {
display: none;
}
.hide-on-phone {
@media #{$media-size-phone} {
display: none;
}
}
.hide-on-tablet {
@media #{$media-size-tablet} {
display: none;
}
}
// Accessibility
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
}
.screen-reader-text:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
clip-path: none;
color: #21759b;
display: block;
font-size: 14px;
font-size: 0.875rem;
font-weight: bold;
height: auto;
width: auto;
top: 5px;
left: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
z-index: 100000;
}
// Custom
.socials {
user-select: none;
svg {
font-size: 1.5rem;
}
}

@ -0,0 +1,67 @@
.menu {
background: #fafafa;
border-right: 1px solid;
margin-right: 18px;
z-index: 9999;
.dark-theme & {
background: #252627;
}
@media #{$media-size-phone} {
position: absolute;
top: 50px;
right: 0;
border: none;
margin: 0;
padding: 10px;
}
&__inner {
display: flex;
align-items: center;
justify-content: flex-start;
max-width: 100%;
margin: 0 auto;
padding: 0 15px;
font-size: 1rem;
list-style: none;
li {
margin: 0 12px;
}
@media #{$media-size-phone} {
flex-direction: column;
align-items: flex-start;
padding: 0;
li {
margin: 0;
padding: 5px;
}
}
}
&-trigger {
width: 24px;
height: 24px;
fill: currentColor;
margin-left: 10px;
cursor: pointer;
}
a {
display: inline-block;
margin-right: 15px;
text-decoration: none;
&:hover {
text-decoration: underline;
}
&:last-of-type {
margin-right: 0;
}
}
}

@ -0,0 +1,3 @@
@mixin dimmed {
opacity: .6;
}

@ -0,0 +1,367 @@
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
/* Webkit Scrollbar Customize */
::-webkit-scrollbar {
width: 8px;
height: 8px;
background: #212020;
}
::-webkit-scrollbar-thumb {
background: #888;
&:hover {
background: #dcdcdc;
}
}
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
/* Sections
========================================================================== */
/**
* Remove the margin in all browsers.
*/
body {
margin: 0;
}
/**
* Render the `main` element consistently in IE.
*/
main {
display: block;
}
/**
* Correct the font size and margin on `h1` elements within `section` and
* `article` contexts in Chrome, Firefox, and Safari.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/* Grouping content
========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
* 2. Show the overflow in Edge and IE.
*/
hr {
box-sizing: content-box; /* 1 */
height: 0; /* 1 */
overflow: visible; /* 2 */
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
pre {
font-family: monospace, monospace; /* 1 */
font-display: auto;
font-size: 1em; /* 2 */
}
/* Text-level semantics
========================================================================== */
/**
* Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent;
}
/**
* 1. Remove the bottom border in Chrome 57-
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
*/
abbr[title] {
border-bottom: none; /* 1 */
text-decoration: underline; /* 2 */
text-decoration: underline dotted; /* 2 */
}
/**
* Add the correct font weight in Chrome, Edge, and Safari.
*/
b,
strong {
font-weight: bolder;
}
/**
* 1. Correct the inheritance and scaling of font size in all browsers.
* 2. Correct the odd `em` font sizing in all browsers.
*/
code,
kbd,
samp {
font-family: monospace, monospace; /* 1 */
font-display: auto;
font-size: 1em; /* 2 */
}
/**
* Add the correct font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
* all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sub {
bottom: -0.25em;
}
sup {
top: -0.5em;
}
/* Embedded content
========================================================================== */
/**
* Remove the border on images inside links in IE 10.
*/
img {
border-style: none;
}
/* Forms
========================================================================== */
/**
* 1. Change the font styles in all browsers.
* 2. Remove the margin in Firefox and Safari.
*/
button,
input,
optgroup,
select,
textarea {
font-family: inherit; /* 1 */
font-display: auto;
font-size: 100%; /* 1 */
line-height: 1.15; /* 1 */
margin: 0; /* 2 */
}
/**
* Show the overflow in IE.
* 1. Show the overflow in Edge.
*/
button,
input { /* 1 */
overflow: visible;
}
/**
* Remove the inheritance of text transform in Edge, Firefox, and IE.
* 1. Remove the inheritance of text transform in Firefox.
*/
button,
select { /* 1 */
text-transform: none;
}
/**
* Correct the inability to style clickable types in iOS and Safari.
*/
button,
[type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}
/**
* Remove the inner border and padding in Firefox.
*/
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
* Restore the focus styles unset by the previous rule.
*/
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}
/**
* Correct the padding in Firefox.
*/
fieldset {
padding: 0.35em 0.75em 0.625em;
}
/**
* 1. Correct the text wrapping in Edge and IE.
* 2. Correct the color inheritance from `fieldset` elements in IE.
* 3. Remove the padding so developers are not caught out when they zero out
* `fieldset` elements in all browsers.
*/
legend {
box-sizing: border-box; /* 1 */
color: inherit; /* 2 */
display: table; /* 1 */
max-width: 100%; /* 1 */
padding: 0; /* 3 */
white-space: normal; /* 1 */
}
/**
* Add the correct vertical alignment in Chrome, Firefox, and Opera.
*/
progress {
vertical-align: baseline;
}
/**
* Remove the default vertical scrollbar in IE 10+.
*/
textarea {
overflow: auto;
}
/**
* 1. Add the correct box sizing in IE 10.
* 2. Remove the padding in IE 10.
*/
[type="checkbox"],
[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Correct the odd appearance in Chrome and Safari.
* 2. Correct the outline style in Safari.
*/
[type="search"] {
-webkit-appearance: textfield; /* 1 */
outline-offset: -2px; /* 2 */
}
/**
* Remove the inner padding in Chrome and Safari on macOS.
*/
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* 1. Correct the inability to style clickable types in iOS and Safari.
* 2. Change font properties to `inherit` in Safari.
*/
::-webkit-file-upload-button {
-webkit-appearance: button; /* 1 */
font: inherit; /* 2 */
}
/* Interactive
========================================================================== */
/*
* Add the correct display in Edge, IE 10+, and Firefox.
*/
details {
display: block;
}
/*
* Add the correct display in all browsers.
*/
summary {
display: list-item;
}
/* Misc
========================================================================== */
/**
* Add the correct display in IE 10+.
*/
template {
display: none;
}
/**
* Add the correct display in IE 10.
*/
[hidden] {
display: none;
}

@ -0,0 +1,34 @@
.sharing-buttons {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.resp-sharing-button__icon,
.resp-sharing-button__link {
display: inline-block;
}
.resp-sharing-button__link {
text-decoration: none;
margin: 0.5em;
}
.resp-sharing-button {
border-radius: 5px;
transition: 25ms ease-out;
padding: 0.5em 0.75em;
font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
}
.resp-sharing-button__icon svg {
width: 1em;
height: 1em;
margin-right: 0.4em;
vertical-align: top;
}
.resp-sharing-button--small svg {
margin: 0;
vertical-align: middle;
}
}

@ -0,0 +1,191 @@
.post {
width: 100%;
max-width: 800px;
text-align: left;
padding: 20px;
margin: 20px auto;
@media #{$media-size-tablet} {
max-width: 600px;
}
&-date {
&:after {
content: '';
}
}
&-title {
font-size: 2.625rem;
margin: 0 0 20px;
@media #{$media-size-phone} {
font-size: 2rem;
}
a {
text-decoration: none;
}
}
&-tags {
display: block;
margin-bottom: 20px;
font-size: 1rem;
opacity: 0.5;
a {
text-decoration: none;
}
}
&-content {
margin-top: 30px;
}
&-cover {
border-radius: 8px;
margin: 40px -50px;
width: 860px;
max-width: 860px;
@media #{$media-size-tablet} {
margin: 20px 0;
width: 100%;
}
}
&-info {
margin-top: 30px;
font-size: 0.8rem;
line-height: normal;
@include dimmed;
p {
margin: 0.8em 0;
}
a:hover {
border-bottom: 1px solid white;
}
svg {
margin-right: 0.8em;
}
.tag {
margin-right: 0.5em;
&::before {
content: "#";
}
}
.feather {
display: inline-block;
vertical-align: -.125em;
width: 1em;
height: 1em;
}
}
.flag {
border-radius: 50%;
margin: 0 5px;
}
}
.pagination {
margin-top: 20px;
&__title {
display: flex;
text-align: center;
position: relative;
margin: 20px 0;
&-h {
text-align: center;
margin: 0 auto;
padding: 5px 10px;
background: $light-background;
color: $light-color-secondary;
font-size: 0.8rem;
text-transform: uppercase;
text-decoration: none;
letter-spacing: 0.1em;
z-index: 1;
.dark-theme & {
background: $dark-background;
color: $dark-color-secondary;
}
}
hr {
position: absolute;
left: 0;
right: 0;
width: 100%;
margin-top: 15px;
z-index: 0;
}
}
&__buttons {
display: flex;
align-items: center;
justify-content: center;
a {
text-decoration: none;
font-weight: bold;
}
}
}
.button {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
background: $light-background-secondary;
font-size: 1rem;
font-weight: 600;
border-radius: 8px;
max-width: 40%;
padding: 0;
cursor: pointer;
appearance: none;
.dark-theme & {
background: $dark-background-secondary;
}
+.button {
margin-left: 10px;
}
a {
display: flex;
padding: 8px 16px;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&__text {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
&.next .button__icon {
margin-left: 8px;
}
&.previous .button__icon {
margin-right: 8px;
}
}

@ -0,0 +1,24 @@
@charset "UTF-8";
/* light theme color */
$light-background: #fff;
$light-background-secondary: #eaeaea;
$light-color: #222;
$light-color-secondary: #999;
$light-border-color: #dcdcdc;
/* dark theme colors */
$dark-background: #292a2d;
$dark-background-secondary: #3b3d42;
$dark-color: #a9a9b3;
$dark-color-secondary: #73747b;
$dark-border-color: #4a4b50;
$media-size-phone: "(max-width: 684px)";
$media-size-tablet: "(max-width: 900px)";
/* variables for js, must be the same as these in @custom-media queries */
:root {
--phoneWidth: (max-width: 684px);
--tabletWidth: (max-width: 900px);
}

@ -0,0 +1,16 @@
/* Must be loaded before everything else */
@import "normalize";
/* Main stuff */
@import "variables";
@import "mixins";
@import "fonts";
@import "buttons";
/* Modules */
@import "header";
@import "logo";
@import "menu";
@import "main";
@import "list";
@import "single";
@import "footer";
@import "sharing-buttons";

@ -0,0 +1,36 @@
# Translations for English
# https://gohugo.io/content-management/multilingual/#translation-of-strings
# Generic
#
[translations]
other = "Translations"
[postAvailable]
other = "Also available in"
# 404.html
#
[archives]
other = "Archives"
[home]
other = "Home"
[notFound]
other = "Oops, page not found…"
# posts/single.html
#
[readingTime]
one = "One minute"
other = "{{ .Count }} minutes"
[tableOfContents]
other = "Table of Contents"
[wordCount]
one = "One Word"
other = "{{ .Count }} Words"

@ -0,0 +1,36 @@
{{ define "main" }}
<div id="spotlight" class="error-404 animated fadeIn">
<p class="img-404">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-cloud-drizzle">
<line x1="8" y1="19" x2="8" y2="21"></line>
<line x1="8" y1="13" x2="8" y2="15"></line>
<line x1="16" y1="19" x2="16" y2="21"></line>
<line x1="16" y1="13" x2="16" y2="15"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="12" y1="15" x2="12" y2="17"></line>
<path d="M20 16.58A5 5 0 0 0 18 7h-1.26A8 8 0 1 0 4 15.25"></path>
</svg>
</p>
<div class="banner-404">
<h1>404</h1>
<p>{{ i18n "notFound" }}</p>
<p class="btn-404">
<a href="{{.Site.BaseURL}}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-home">
<path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path>
<polyline points="9 22 9 12 15 12 15 22"></polyline>
</svg>{{ i18n "home" }}</a>
<a href="{{ "posts" | absLangURL }}"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"
stroke-linejoin="round" class="feather feather-archive">
<polyline points="21 8 21 21 3 21 3 8"></polyline>
<rect x="1" y="3" width="22" height="5"></rect>
<line x1="10" y1="12" x2="14" y2="12"></line>
</svg>{{ i18n "archives" }}</a>
</p>
</div>
</div>
{{ end }}

@ -0,0 +1,22 @@
<!DOCTYPE html>
<html lang="{{ .Site.Language }}">
<head>
{{ partial "head.html" . }}
</head>
<body class="{{ if ne $.Site.Params.defaultTheme "light" -}} dark-theme {{- end -}}">
<div class="container">
{{ partial "header.html" . }}
<div class="content">
{{ block "main" . }}{{ end }}
</div>
{{ block "footer" . }}
{{ partial "footer.html" . }}
{{ end }}
</div>
{{ partial "javascript.html" . }}
</body>
</html>

@ -0,0 +1,35 @@
{{ define "main" }}
{{ $paginator := .Paginate .Data.Pages }}
<main class="posts">
<h1>{{ .Title }}</h1>
{{ if .Content }}
<div class="content">{{ .Content }}</div>
{{ end }}
{{ range $paginator.Pages.GroupByDate "2006" }}
<div class="posts-group">
<div class="post-year">{{ .Key }}</div>
<ul class="posts-list">
{{ range .Pages }}
<li class="post-item">
<a href="{{.Permalink}}">
<span class="post-title">{{.Title}}</span>
<span class="post-day">
{{ if .Site.Params.dateformShort }}
{{ .Date.Format .Site.Params.dateformShort }}
{{ else }}
{{ .Date.Format "Jan 2"}}
{{ end }}
</span>
</a>
</li>
{{ end }}
</ul>
</div>
{{ end }}
{{ partial "pagination.html" . }}
</main>
{{ end }}

@ -0,0 +1,52 @@
{{ define "main" }}
<main class="post">
<div class="post-info">
{{ if .IsTranslated }}
{{ i18n "postAvailable" }}
{{ range .Translations }}
<a href="{{ .Permalink }}"><span class="flag flag-icon flag-icon-{{ index $.Site.Data.langFlags (.Lang) }} flag-icon-squared"></span></a>
{{ end}}
{{ end }}
</p>
</div>
<article>
<h2 class="post-title"><a href="{{ .Permalink }}">{{ .Title | markdownify }}</a></h2>
{{- if .Params.toc }}
<hr />
<aside id="toc">
<div class="toc-title">{{ i18n "tableOfContents" }}</div>
{{ .TableOfContents }}
</aside>
<hr />
{{- end }}
{{ with .Params.Cover }}
<img src="/{{ . }}" class="post-cover" />
{{ end }}
<div class="post-content">
{{ .Content }}
</div>
</article>
<hr />
<div class="post-info">
{{- with .Params.tags }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-tag meta-icon"><path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path><line x1="7" y1="7" x2="7" y2="7"></line></svg>
{{- range . -}}
<span class="tag"><a href="{{ "tags/" | absLangURL }}{{ . | urlize }}">{{.}}</a></span>
{{- end }}
</p>
{{- end }}
{{- if .GitInfo }}
<p><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-git-commit"><circle cx="12" cy="12" r="4"></circle><line x1="1.05" y1="12" x2="7" y2="12"></line><line x1="17.01" y1="12" x2="22.96" y2="12"></line></svg><a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank" rel="noopener">{{ .GitInfo.AbbreviatedHash }}</a> @ {{ if .Site.Params.dateformNum }}{{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}{{ else }}{{ dateFormat "2006-01-02" .GitInfo.AuthorDate.Local }}{{ end }}</p>
{{- end }}
</div>
</main>
{{ end }}

@ -0,0 +1,21 @@
{{ define "main" }}
<main aria-role="main">
<div>
{{ if .Site.Params.Portrait.Path }}
<img src="{{ .Site.Params.Portrait.Path }}" class="circle" alt="{{ .Site.Params.Portrait.Alt }}"
style="max-width:{{ .Site.Params.Portrait.MaxWidth }}" />
{{ end }}
<h1>{{ .Site.Title }}</h1>
{{- with .Site.Params.homeSubtitle }}
<p>{{.}}</p>
{{- end }}
{{- with .Site.Params.social }}
<div class="socials">
{{ partial "social-icons.html" . }}
</div>
{{- end }}
</div>
</main>
{{ end }}

@ -0,0 +1,10 @@
{{- with .Site.Params.favicon.color }}
<link rel="apple-touch-icon" sizes="180x180" href="{{"apple-touch-icon.png" | relURL}}">
<link rel="icon" type="image/png" sizes="32x32" href="{{"favicon-32x32.png" | relURL}}">
<link rel="icon" type="image/png" sizes="16x16" href="{{"favicon-16x16.png" | relURL}}">
<link rel="manifest" href="{{"site.webmanifest" | relURL}}">
<link rel="mask-icon" href="{{"safari-pinned-tab.svg" | relURL}}" color="{{.mask}}">
<link rel="shortcut icon" href="{{"favicon.ico" | relURL}}">
<meta name="msapplication-TileColor" content="{{.msapplication}}">
<meta name="theme-color" content="{{.theme}}">
{{ end }}

@ -0,0 +1,24 @@
<footer class="footer">
<div class="footer__inner">
<div class="footer__content">
<span>&copy; {{ now.Format "2006" }}</span>
{{ if .Site.Author.name }}
<span><a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a></span>
{{ end }}
{{ if .Site.Copyright }}
<span>{{ .Site.Copyright| safeHTML }}</span>
{{ end }}
<span>{{- with (not (in (.Site.Language.Get "disableKinds") "RSS")) }}
<a href="{{ "posts/index.xml" | absLangURL }}" target="_blank"
title="rss">{{ partial "svg.html" (dict "name" "rss") }}</a>
{{ end }}
</span>
</div>
</div>
<!-- <div class="footer__inner">
<div class="footer__content">
<span>Powered by <a href="http://gohugo.io">Hugo</a></span>
<span>Made with &#10084; by <a href="https://maik.dev/">Maik de Kruif</a></span>
</div>
</div> -->
</footer>

@ -0,0 +1,65 @@
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="author"
content="{{ if .Params.author }}{{ .Params.author }}{{ else }}{{ range .Site.Author }}{{ . }} {{ end }}{{ end }}">
<meta name="description"
content="{{ if .IsHome }}{{ .Site.Params.homeSubtitle }}{{ else }}{{ .Summary | plainify }}{{ end }}" />
<meta name="keywords"
content="{{ .Site.Params.keywords }}{{ if .Params.tags }}{{ range .Params.tags }}, {{ . }}{{ end }}{{ end }}" />
<meta name="robots" content="noodp" />
<!-- <meta name="theme-color" content="{{ .Site.Params.themeColor }}" /> -->
<link rel="canonical" href="{{ .Permalink }}" />
{{ block "title" . }}
<title>
{{ if .IsHome }}
{{ $.Site.Title }} {{ with $.Site.Params.Subtitle }} — {{ . }} {{ end }}
{{ else }}
{{ .Title }} :: {{ $.Site.Title }} {{ with $.Site.Params.Subtitle }} — {{ . }}{{ end }}
{{ end }}
</title>
{{ end }}
<!-- CSS -->
<!-- <link href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/3.2.1/css/flag-icon.min.css" rel="stylesheet"
type="text/css"> -->
{{ $options := (dict "targetPath" "main.css" "outputStyle" "compressed" "enableSourceMap" true) }}
{{ $style := resources.Get "scss/main.scss" | resources.ToCSS $options | resources.Fingerprint }}
<link rel="stylesheet" href="{{ $style.RelPermalink }}">
{{ range $val := $.Site.Params.customCSS }}
{{ if gt (len $val) 0 }}
<link rel="stylesheet" type="text/css" href="{{ $val }}">
{{ end }}
{{ end }}
<!-- Icons -->
{{- partial "favicons.html" . }}
{{ template "_internal/schema.html" . }}
{{ template "_internal/twitter_cards.html" . }}
{{ if isset .Site.Taxonomies "series" }}
{{ template "_internal/opengraph.html" . }}
{{ end }}
{{ range .Params.categories }}
<meta property="article:section" content="{{ . }}" />
{{ end }}
{{ if isset .Params "date" }}
<meta property="article:published_time" content="{{ time .Date }}" />
{{ end }}
<!-- RSS -->
{{ with .OutputFormats.Get "rss" -}}
{{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
{{ end -}}
<!-- JSON Feed -->
{{ if .OutputFormats.Get "json" }}
<link href="{{ if .OutputFormats.Get "json" }}{{ .Site.BaseURL }}feed.json{{ end }}" rel="alternate"
type="application/json" title="{{ .Site.Title }}" />
{{ end }}

@ -0,0 +1,19 @@
<header class="header">
<span class="header__inner">
{{ partial "logo.html" . }}
<span class="header__right">
{{ if len .Site.Menus }}
{{ partial "menu.html" . }}
<span class="menu-trigger">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M0 0h24v24H0z" fill="none" />
<path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" />
</svg>
</span>
{{ end }}
<span class="theme-toggle unselectable">{{ partial "theme-icon.html" . }}</span>
</span>
</span>
</header>

@ -0,0 +1,15 @@
{{ $main := resources.Get "js/main.js" }}
{{ $menu := resources.Get "js/menu.js" }}
{{ $theme := resources.Get "js/theme.js" }}
{{ $secureJS := slice $main $menu $theme | resources.Concat "bundle.js" | resources.Minify | resources.Fingerprint "sha512" }}
<script type="text/javascript" src="{{ $secureJS.RelPermalink }}" integrity="{{ $secureJS.Data.Integrity }}"></script>
{{- if .Site.GoogleAnalytics }}
{{ template "_internal/google_analytics.html" . }}
{{- end}}
{{ range $val := $.Site.Params.customJS }}
{{ if gt (len $val) 0 }}
<script src="{{ $val }}"></script>
{{ end }}
{{ end }}

@ -0,0 +1,15 @@
<a href="{{ if .Site.Params.Logo.LogoHomeLink }}{{ .Site.Params.Logo.LogoHomeLink }}{{else}}{{ .Site.BaseURL }}{{ end }}"
style="text-decoration: none;">
<div class="logo">
{{ if .Site.Params.Logo.path }}
<img src="{{ .Site.Params.Logo.path }}" alt="{{ .Site.Params.Logo.alt }}" />
{{ else }}
<span class="logo__mark">></span>
<span class="logo__text">{{ with .Site.Params.Logo.logoText }}{{ . }}{{ else }}hello{{ end }}</span>
<span class="logo__cursor" style="{{ with.Site.Params.Logo.logoCursorDisabled }}visibility:hidden;{{ end }}
{{ with.Site.Params.Logo.logoCursorColor }}background-color:{{ . }};{{ end }}
{{ with.Site.Params.Logo.logoCursorAnimate }}animation-duration:{{ . }};{{ end }}">
</span>
{{ end }}
</div>
</a>

@ -0,0 +1,8 @@
<nav class="menu">
<ul class="menu__inner">
{{- $currentPage := . -}}
{{ range .Site.Menus.main -}}
<li><a href="{{ .URL | absLangURL }}">{{ .Name }}</a></li>
{{- end }}
</ul>
</nav>

@ -0,0 +1,20 @@
<div class="pagination">
<div class="pagination__buttons">
{{ if .Paginator.HasPrev }}
<span class="button previous">
<a href="{{ .Paginator.Prev.URL }}">
<span class="button__icon"></span>
<span class="button__text">Newer posts</span>
</a>
</span>
{{ end }}
{{ if .Paginator.HasNext }}
<span class="button next">
<a href="{{ .Paginator.Next.URL }}">
<span class="button__text">Older posts</span>
<span class="button__icon"></span>
</a>
</span>
{{ end }}
</div>
</div>

@ -0,0 +1,160 @@
<!-- Sharingbutton Facebook -->
<!-- <a class="resp-sharing-button__link" href="https://facebook.com/sharer/sharer.php?u={{ .Permalink }}" target="_blank"
rel="noopener" aria-label="" title="Share on facebook">
<div class="resp-sharing-button resp-sharing-button--facebook resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"></path>
</svg>
</div>
</div>
</a> -->
<!-- Sharingbutton Twitter -->
<a class="resp-sharing-button__link" href="https://twitter.com/intent/tweet/?url={{ .Permalink }}" target="_blank"
rel="noopener" aria-label="" title="Share on twitter">
<div class="resp-sharing-button resp-sharing-button--twitter resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path
d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z">
</path>
</svg>
</div>
</div>
</a>
<!-- Sharingbutton Tumblr -->
<!-- <a class="resp-sharing-button__link"
href="https://www.tumblr.com/widgets/share/tool?posttype=link&amp;title={{ .Title }}&amp;caption={{ .Title }}&amp;canonicalUrl={{ .Permalink }}"
target="_blank" rel="noopener" aria-label="" title="Share on tumblr">
<div class="resp-sharing-button resp-sharing-button--tumblr resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path
d="M14.563 24c-5.093 0-7.031-3.756-7.031-6.411V9.747H5.116V6.648c3.63-1.313 4.512-4.596 4.71-6.469C9.84.051 9.941 0 9.999 0h3.517v6.114h4.801v3.633h-4.82v7.47c.016 1.001.375 2.371 2.207 2.371h.09c.631-.02 1.486-.205 1.936-.419l1.156 3.425c-.436.636-2.4 1.374-4.156 1.404h-.178l.011.002z" />
</svg>
</div>
</div>
</a> -->
<!-- Sharingbutton E-Mail -->
<a class="resp-sharing-button__link" href="mailto:?subject={{ .Title }}&amp;body={{ .Permalink }}" target="_self"
rel="noopener" aria-label="" title="Share via email">
<div class="resp-sharing-button resp-sharing-button--email resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path>
<polyline points="22,6 12,13 2,6"></polyline>
</svg>
</div>
</div>
</a>
<!-- Sharingbutton Pinterest -->
<!-- <a class="resp-sharing-button__link"
href="https://pinterest.com/pin/create/button/?url={{ .Permalink }}&amp;media={{ .Permalink }};description={{ .Title }}"
target="_blank" rel="noopener" aria-label="" title="Share on pinterest">
<div class="resp-sharing-button resp-sharing-button--pinterest resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none">
<path
d="M12.017 0C5.396 0 .029 5.367.029 11.987c0 5.079 3.158 9.417 7.618 11.162-.105-.949-.199-2.403.041-3.439.219-.937 1.406-5.957 1.406-5.957s-.359-.72-.359-1.781c0-1.663.967-2.911 2.168-2.911 1.024 0 1.518.769 1.518 1.688 0 1.029-.653 2.567-.992 3.992-.285 1.193.6 2.165 1.775 2.165 2.128 0 3.768-2.245 3.768-5.487 0-2.861-2.063-4.869-5.008-4.869-3.41 0-5.409 2.562-5.409 5.199 0 1.033.394 2.143.889 2.741.099.12.112.225.085.345-.09.375-.293 1.199-.334 1.363-.053.225-.172.271-.401.165-1.495-.69-2.433-2.878-2.433-4.646 0-3.776 2.748-7.252 7.92-7.252 4.158 0 7.392 2.967 7.392 6.923 0 4.135-2.607 7.462-6.233 7.462-1.214 0-2.354-.629-2.758-1.379l-.749 2.848c-.269 1.045-1.004 2.352-1.498 3.146 1.123.345 2.306.535 3.55.535 6.607 0 11.985-5.365 11.985-11.987C23.97 5.39 18.592.026 11.985.026L12.017 0z" />
</svg>
</div>
</div>
</a> -->
<!-- Sharingbutton LinkedIn -->
<a class="resp-sharing-button__link"
href="https://www.linkedin.com/shareArticle?mini=true&amp;url={{ .Permalink }}&amp;title={{ .Title }}&amp;summary={{ .Title }}&amp;source={{ .Permalink }}"
target="_blank" rel="noopener" aria-label="" title="Share on linkedin">
<div class="resp-sharing-button resp-sharing-button--linkedin resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<path d="M16 8a6 6 0 0 1 6 6v7h-4v-7a2 2 0 0 0-2-2 2 2 0 0 0-2 2v7h-4v-7a6 6 0 0 1 6-6z"></path>
<rect x="2" y="9" width="4" height="12"></rect>
<circle cx="4" cy="4" r="2"></circle>
</svg>
</div>
</div>
</a>
<!-- Sharingbutton Reddit -->
<a class="resp-sharing-button__link"
href="https://reddit.com/submit/?url={{ .Permalink }}&amp;resubmit=true&amp;title={{ .Title }}" target="_blank"
rel="noopener" aria-label="" title="Share on reddit">
<div class="resp-sharing-button resp-sharing-button--reddit resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none">
<path
d="M12 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0zm5.01 4.744c.688 0 1.25.561 1.25 1.249a1.25 1.25 0 0 1-2.498.056l-2.597-.547-.8 3.747c1.824.07 3.48.632 4.674 1.488.308-.309.73-.491 1.207-.491.968 0 1.754.786 1.754 1.754 0 .716-.435 1.333-1.01 1.614a3.111 3.111 0 0 1 .042.52c0 2.694-3.13 4.87-7.004 4.87-3.874 0-7.004-2.176-7.004-4.87 0-.183.015-.366.043-.534A1.748 1.748 0 0 1 4.028 12c0-.968.786-1.754 1.754-1.754.463 0 .898.196 1.207.49 1.207-.883 2.878-1.43 4.744-1.487l.885-4.182a.342.342 0 0 1 .14-.197.35.35 0 0 1 .238-.042l2.906.617a1.214 1.214 0 0 1 1.108-.701zM9.25 12C8.561 12 8 12.562 8 13.25c0 .687.561 1.248 1.25 1.248.687 0 1.248-.561 1.248-1.249 0-.688-.561-1.249-1.249-1.249zm5.5 0c-.687 0-1.248.561-1.248 1.25 0 .687.561 1.248 1.249 1.248.688 0 1.249-.561 1.249-1.249 0-.687-.562-1.249-1.25-1.249zm-5.466 3.99a.327.327 0 0 0-.231.094.33.33 0 0 0 0 .463c.842.842 2.484.913 2.961.913.477 0 2.105-.056 2.961-.913a.361.361 0 0 0 .029-.463.33.33 0 0 0-.464 0c-.547.533-1.684.73-2.512.73-.828 0-1.979-.196-2.512-.73a.326.326 0 0 0-.232-.095z" />
</svg>
</div>
</div>
</a>
<!-- Sharingbutton XING -->
<!-- <a class="resp-sharing-button__link"
href="https://www.xing.com/app/user?op=share;url={{ .Permalink }};title={{ .Title }}" target="_blank" rel="noopener"
aria-label="" title="Share on xing">
<div class="resp-sharing-button resp-sharing-button--xing resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none">
<path
d="M18.188 0c-.517 0-.741.325-.927.66 0 0-7.455 13.224-7.702 13.657.015.024 4.919 9.023 4.919 9.023.17.308.436.66.967.66h3.454c.211 0 .375-.078.463-.22.089-.151.089-.346-.009-.536l-4.879-8.916c-.004-.006-.004-.016 0-.022L22.139.756c.095-.191.097-.387.006-.535C22.056.078 21.894 0 21.686 0h-3.498zM3.648 4.74c-.211 0-.385.074-.473.216-.09.149-.078.339.02.531l2.34 4.05c.004.01.004.016 0 .021L1.86 16.051c-.099.188-.093.381 0 .529.085.142.239.234.45.234h3.461c.518 0 .766-.348.945-.667l3.734-6.609-2.378-4.155c-.172-.315-.434-.659-.962-.659H3.648v.016z" />
</svg>
</div>
</div>
</a> -->
<!-- Sharingbutton WhatsApp -->
<a class="resp-sharing-button__link" href="whatsapp://send?text={{ .Title }}%20{{ .Permalink }}" target="_blank"
rel="noopener" aria-label="" title="Share on whatsapp">
<div class="resp-sharing-button resp-sharing-button--whatsapp resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none" stroke-width="1" stroke-linecap="round" stroke-linejoin="round">
<path
d="M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.096 3.2 5.077 4.487.709.306 1.262.489 1.694.625.712.227 1.36.195 1.871.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347m-5.421 7.403h-.004a9.87 9.87 0 01-5.031-1.378l-.361-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 01-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884 2.64 0 5.122 1.03 6.988 2.898a9.825 9.825 0 012.893 6.994c-.003 5.45-4.437 9.884-9.885 9.884m8.413-18.297A11.815 11.815 0 0012.05 0C5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 005.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893a11.821 11.821 0 00-3.48-8.413Z" />
</svg>
</div>
</div>
</a>
<!-- Sharingbutton Hacker News -->
<!-- <a class="resp-sharing-button__link"
href="https://news.ycombinator.com/submitlink?u={{ .Permalink }}&amp;t={{ .Title }}" target="_blank" rel="noopener"
aria-label="" title="Share on hacker news">
<div class="resp-sharing-button resp-sharing-button--hackernews resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor"
stroke="none">
<path
d="M0 24V0h24v24H0zM6.951 5.896l4.112 7.708v5.064h1.583v-4.972l4.148-7.799h-1.749l-2.457 4.875c-.372.745-.688 1.434-.688 1.434s-.297-.708-.651-1.434L8.831 5.896h-1.88z" />
</svg>
</div>
</div>
</a> -->
<!-- Sharingbutton Telegram -->
<a class="resp-sharing-button__link" href="https://telegram.me/share/url?text={{ .Title }}&amp;url={{ .Permalink }}"
target="_blank" rel="noopener" aria-label="" title="Share on telegram">
<div class="resp-sharing-button resp-sharing-button--telegram resp-sharing-button--small">
<div aria-hidden="true" class="resp-sharing-button__icon resp-sharing-button__icon--solid">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
<line x1="22" y1="2" x2="11" y2="13"></line>
<polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
</svg>
</div>
</div>
</a>

@ -0,0 +1,4 @@
{{ range . -}}
&nbsp; <a href="{{ .url }}" target="_blank" rel="noopener" title="{{ .name | humanize }}">{{ partial "svg.html" . }}</a>
&nbsp;
{{- end -}}

File diff suppressed because one or more lines are too long

@ -0,0 +1,5 @@
<svg class="theme-toggler" width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M22 41C32.4934 41 41 32.4934 41 22C41 11.5066 32.4934 3 22
3C11.5066 3 3 11.5066 3 22C3 32.4934 11.5066 41 22 41ZM7 22C7
13.7157 13.7157 7 22 7V37C13.7157 37 7 30.2843 7 22Z"/>
</svg>

After

Width:  |  Height:  |  Size: 317 B

@ -0,0 +1,26 @@
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
{{ with .OutputFormats.Get "RSS" -}}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end -}}
{{ range .Pages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Summary | html }}</description>
<content type="html">{{ printf `<![CDATA[%s]]>` .Content | safeHTML }}</content>
</item>
{{ end }}
</channel>
</rss>

@ -0,0 +1,153 @@
{{ define "main" }}
<main class="post">
<div class="post-info">
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-clock">
<circle cx="12" cy="12" r="10"></circle>
<polyline points="12 6 12 12 16 14"></polyline>
</svg>
{{ i18n "readingTime" .Page.ReadingTime }}
{{ if .IsTranslated }} | {{ i18n "postAvailable" }}
{{ range .Translations }}
<a href="{{ .Permalink }}"><span
class="flag flag-icon flag-icon-{{ index $.Site.Data.langFlags (.Lang) }} flag-icon-squared"></span></a>
{{ end}}
{{ end }}
</p>
</div>
<article>
<h1 class="post-title">
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
</h1>
{{- if .Params.toc }}
<hr />
<aside id="toc">
<div class="toc-title">{{ i18n "tableOfContents" }}</div>
{{ .TableOfContents }}
</aside>
<hr />
{{- end }}
{{ with .Params.Cover }}
<img src="/{{ . }}" class="post-cover" />
{{ end }}
<div class="post-content">
{{ .Content }}
</div>
</article>
<hr />
<div class="post-info">
{{- with .Params.tags }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-tag meta-icon">
<path d="M20.59 13.41l-7.17 7.17a2 2 0 0 1-2.83 0L2 12V2h10l8.59 8.59a2 2 0 0 1 0 2.82z"></path>
<line x1="7" y1="7" x2="7" y2="7"></line>
</svg>
{{- range . -}}
<span class="tag"><a href="{{ "tags/" | absLangURL }}{{ . | urlize }}/">{{.}}</a></span>
{{- end }}
</p>
{{- end }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-file-text">
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
<polyline points="14 2 14 8 20 8"></polyline>
<line x1="16" y1="13" x2="8" y2="13"></line>
<line x1="16" y1="17" x2="8" y2="17"></line>
<polyline points="10 9 9 9 8 9"></polyline>
</svg>
{{ i18n "wordCount" .Page.WordCount }}
</p>
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-calendar">
<rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect>
<line x1="16" y1="2" x2="16" y2="6"></line>
<line x1="8" y1="2" x2="8" y2="6"></line>
<line x1="3" y1="10" x2="21" y2="10"></line>
</svg>
{{ if .Site.Params.dateformNumTime }}{{ dateFormat .Site.Params.dateformNumTime .Date.Local }}{{ else }}{{ dateFormat "2006-01-02 15:04 -0700" .Date.Local }}{{ end }}
</p>
{{- if .GitInfo }}
<p>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"
class="feather feather-git-commit">
<circle cx="12" cy="12" r="4"></circle>
<line x1="1.05" y1="12" x2="7" y2="12"></line>
<line x1="17.01" y1="12" x2="22.96" y2="12"></line>
</svg>
<a href="{{ .Site.Params.gitUrl -}}{{ .GitInfo.Hash }}" target="_blank"
rel="noopener">{{ .GitInfo.AbbreviatedHash }}</a>
@
{{ if .Site.Params.dateformNum }}{{ dateFormat .Site.Params.dateformNum .GitInfo.AuthorDate.Local }}{{ else }}{{ dateFormat "2006-01-02" .GitInfo.AuthorDate.Local }}{{ end }}
</p>
{{- end }}
</div>
{{- if .Site.Params.EnableSharingButtons }}
<hr />
<div class="sharing-buttons">
{{ partial "sharing-buttons.html" . }}
</div>
{{- end }}
{{ if and (not $.Site.Params.DisableReadOtherPosts) (or .NextInSection .PrevInSection) }}
<div class="pagination">
<div class="pagination__title">
<span class="pagination__title-h">{{ .Site.Params.ReadOtherPosts }}</span>
<hr />
</div>
<div class="pagination__buttons">
{{ if .NextInSection }}
<span class="button previous">
<a href="{{ .NextInSection.Permalink }}">
<span class="button__icon"></span>
<span class="button__text">{{ .NextInSection.Title }}</span>
</a>
</span>
{{ end }}
{{ if .PrevInSection }}
<span class="button next">
<a href="{{ .PrevInSection.Permalink }}">
<span class="button__text">{{ .PrevInSection.Title }}</span>
<span class="button__icon"></span>
</a>
</span>
{{ end }}
</div>
</div>
{{ end }}
{{ if .Site.DisqusShortname }}
{{ if not (eq .Params.Comments "false") }}
<div id="comments">
{{ template "_internal/disqus.html" . }}
</div>
{{ end }}
{{ end }}
</main>
{{ end }}

@ -0,0 +1,26 @@
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
{{ with .OutputFormats.Get "RSS" -}}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{ end -}}
{{ range .Pages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Summary | html }}</description>
<content type="html">{{ printf `<![CDATA[%s]]>` .Content | safeHTML }}</content>
</item>
{{ end }}
</channel>
</rss>

@ -0,0 +1,17 @@
{{ $id := delimit (shuffle (seq 1 9)) "" }}
{{ if .Get "language" }}
<div class="collapsable-code">
<input id="{{ .Get "id" | default $id }}" type="checkbox" {{ if ( eq ( .Get "isCollapsed" ) "true" ) -}} checked
{{- end }} />
<label for="{{ .Get "id" | default $id }}">
<span class="collapsable-code__language">{{ .Get "language" }}</span>
{{ if .Get "title" }}<span class="collapsable-code__title">{{ .Get "title" | markdownify }}</span>{{ end }}
<span class="collapsable-code__toggle" data-label-expand="{{ .Get "expand" | default "" }}"
data-label-collapse="{{ .Get "collapse" | default "▽" }}"></span>
</label>
<pre {{ if .Get "language" }}class="language-{{ .Get "language" }}" {{ end }}><code>{{ .Inner | string }}</code></pre>
</div>
{{ else }}
{{ errorf "If you want to use the \"collapsable code\" shortcode, you need to pass a mandatory \"language\" param. The issue occured in %q (%q)" .Page.File .Page.Permalink }}
{{ end }}

@ -0,0 +1,5 @@
{{ if .Get "src" }}
<img src="{{ .Get "src" | safeURL }}" {{ with .Get "alt" }} alt="{{ . | plainify }}" {{ end }}
class="{{ with .Get "position"}}{{ . }}{{ else -}} left {{- end }}" {{ with .Get "style" }}
style="{{ . | safeCSS }}" {{ end }} />
{{ end }}

@ -0,0 +1,14 @@
name = "maik-blog"
description = "A simple theme for my blog."
tags = ["blog", "clean", "dark", "light", "monochromatic", "personal", "responsive"]
features = ["blog", "shortcode", "syntax highlighting"]
min_version = 0.30
[author]
name = "Maik de Kruif"
homepage = "https://maik.dev/"
[original]
name = "hello-friend"
homepage = "https://github.com/panr/hugo-theme-hello-friend"
repo = "https://github.com/panr/hugo-theme-hello-friend"
Loading…
Cancel
Save