diff options
-rw-r--r-- | sass/_zola.scss | 30 | ||||
-rw-r--r-- | sass/site.scss | 130 | ||||
-rw-r--r-- | templates/index.html | 47 | ||||
-rw-r--r-- | templates/page.html | 16 | ||||
-rw-r--r-- | templates/tags/list.html | 16 | ||||
-rw-r--r-- | templates/tags/single.html | 16 |
6 files changed, 255 insertions, 0 deletions
diff --git a/sass/_zola.scss b/sass/_zola.scss new file mode 100644 index 0000000..01fc954 --- /dev/null +++ b/sass/_zola.scss @@ -0,0 +1,30 @@ +// -- zola syntax highlighting (https://www.getzola.org/documentation/content/syntax-highlighting/#styling-codeblocks) + +pre { + padding: 0.5rem; + overflow: auto; + border-radius: 0.25rem; +} + +pre[data-linenos] { + padding: 1rem 0; +} + +pre table td { + padding: 0; +} + +pre table td:nth-of-type(1) { + text-align: center; + user-select: none; +} + +pre mark { + display: block; + background-color: rgba(254, 252, 232, 0.9); +} + +pre table { + width: 100%; + border-collapse: collapse; +} diff --git a/sass/site.scss b/sass/site.scss new file mode 100644 index 0000000..c3a3398 --- /dev/null +++ b/sass/site.scss @@ -0,0 +1,130 @@ +@import "zola"; + +// -- color definitions + +//$color-bg : #000000; +$color-bg : #202124; +$color-fg : #ffffff; +$color-link : #50fa7b; +//$color-link : #c792ea; + +// -- root style + +html { + background-color: $color-bg; + color: $color-fg; + font-family: "Source Code Pro", "Liberation Mono", "JetBrains Mono", monospace, sans-serif; + font-size: clamp(13px, 2vw, 16px); +} + +// -- body style + +body { + max-width: 80ch; + padding: 2ch; + margin: auto; +} + +// -- header style + +h1, h2, h3, h4, h5, h6 { + font-size: 1rem; +} + +h1 { + padding-top: 1rem; +} + +h2 { + padding-top: 1rem; +} + +h1::after { + content: "--------------------------------------------------------------------------------"; + display:block; + overflow: hidden; + white-space:nowrap; +} + +h2::before { + content: "# " +} + +h3::before { + content: "## " +} + +h4::before { + content: "### " +} + +h5::before { + content: "#### " +} + +h6::before { + content: "##### " +} + +// -- link settings + +a { + color: $color-link; + text-decoration: none; + border-bottom: 1px solid $color-link; +} + +a:hover { + background-color: $color-link; + color: $color-bg; +} + +h1 a, h2 a, h3 a, h4 a, h5 a { + color: $color-fg; +} + +// -- list style + +ul { + list-style-type: "- "; + padding-left: 2ch; +} + +// -- code style + +code { + font-weight: bold; +} + +code::before, code::after { + content: "*"; +} + +pre code { + font-weight: normal; +} + +pre code::before, pre code::after { + content: none; +} + +// -- misc classes + +.extra-notes { + color: $color-fg; + opacity: 0.5; +} + +// -- playground + +//nav { +// display: flex; +// flex-direction: row; +//} +//nav a { +// margin: auto; +//} + +//pre { +// max-width: 100ch; +//} diff --git a/templates/index.html b/templates/index.html new file mode 100644 index 0000000..8187404 --- /dev/null +++ b/templates/index.html @@ -0,0 +1,47 @@ +<!DOCTYPE html> +<html lang="en"> + <head> + <meta http-equiv="X-UA-Compatible" content="IE=edge"> + <meta http-equiv="content-type" content="text/html; charset=utf-8"> + <!-- Enable responsiveness on mobile devices --> + <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1"> + + <link rel="stylesheet" href="{{ get_url(path="site.css", trailing_slash=false) | safe }}"> + + <title>{{ config.title }}</title> + </head> + + <body> + {% if config.extra.header_links %} + <header> + <nav itemscope itemtype="http://schema.org/SiteNavigationElement"> + {% for link in config.extra.header_links %} + <a itemprop="url" href="{{ link.url | safe | replace(from="$BASE_URL", to=config.base_url) }}"><span itemprop="name">{{ link.name }}</span></a> + {% endfor %} + </nav> + </header> + {% endif %} + + {% block content %} + <h1>{{ config.description }}</h1> + <main> + {% for page in section.pages %} + <article itemscope itemtype="http://schema.org/CreativeWork"> + <header> + <h2 itemprop="name"> + <a itemprob="url" href="{{ page.permalink | safe }}">{{ page.title }}</a> + </h2> + <span class="extra-notes"> + @{{ page.date | date(format="%F") }} | {{ page.reading_time }} minute read + </span> + </header> + </article> + {% endfor %} + </main> + {% endblock content %} + </body> +</html> + +<!-- +vim:sw=2 +--> diff --git a/templates/page.html b/templates/page.html new file mode 100644 index 0000000..61dd22f --- /dev/null +++ b/templates/page.html @@ -0,0 +1,16 @@ +{% extends "index.html" %} + +{% block content %} + <article itemscope itemtype="http://schema.org/BlogPosting"> + <header> + <h1 itemprop="headline">{{ page.title }}</h1> + </header> + <div itemprop="articleBody"> + {{ page.content | safe }} + </div> + </article> +{% endblock content %} + +<!-- +vim:sw=2 +--> diff --git a/templates/tags/list.html b/templates/tags/list.html new file mode 100644 index 0000000..8de7870 --- /dev/null +++ b/templates/tags/list.html @@ -0,0 +1,16 @@ +{% extends "index.html" %} + +{% block content %} + <h1>Tags</h1> + <ul> + {% for term in terms %} + <li> + <a href="{{ term.permalink }}">#{{ term.name }}</a> + </li> + {% endfor %} + </ul> +{% endblock content %} + +<!-- +vim:sw=2 +--> diff --git a/templates/tags/single.html b/templates/tags/single.html new file mode 100644 index 0000000..52b965e --- /dev/null +++ b/templates/tags/single.html @@ -0,0 +1,16 @@ +{% extends "index.html" %} + +{% block content %} + <h1>Tag: #{{ term.name }}</h1> + <ul> + {% for page in term.pages %} + <li> + <a href="{{ page.permalink }}">{{ page.title }}</a> + </li> + {% endfor %} + </ul> +{% endblock content %} + +<!-- +vim:sw=2 +--> |