near/arnes.space
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

10-print header works :)

Browse source 
I had to pin @thi.ng/hiccup to an earlier version because they stopped publishing CommonJS modules. There is [an issue tracking EcmaScript module support in 11ty](https://github.com/11ty/eleventy/issues/836) but it has not been fixed yet and other solutions broke unpredictably by messing with template inheritance.
This commit is contained in:
arne 2022-02-20 18:10:09 +01:00
commit 9024c00b1a
7 changed files with 67 additions and 20 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/_helpers/header.mjs → src/_helpers/header.js
View file

@ -1,7 +1,7 @@
const crypto = require('crypto')
const seedrandom = require('seedrandom')
const { range } = require('lodash')
// const { serialize } = require('@thi.ng/hiccup')
const { serialize } = require('@thi.ng/hiccup')
/**
* Given a pair of coordinates representing the center, returns the cartesian
@ -16,7 +16,7 @@ const { range } = require('lodash')
*/
const polarToCartesian = (cx, cy, radius, alpha) =>
[cx + (radius * Math.cos(alpha)),
cy + (radius * Math.cos(alpha))]
cy + (radius * Math.sin(alpha))]
/**
* Draws an svg arc with the given radius with a center at `c-x` and `c-y`. Note
@ -59,8 +59,8 @@ const tenPrint = content => {
return ["svg.ten-print",
{"viewBox": `${-radius} ${-radius} ${width + 2*radius} ${height + 2*radius}`,
"xmlns": "http://www.w3.org/2000/svg",
"style": "overflow: visible"}
["style", "path { fill: none; stroke: none; }"] // avoid flash of unstyled content
"style": "overflow: visible"},
["style", "path { fill: none; stroke: none; }"], // avoid flash of unstyled content
["g", {"transform": "translate(0.5, 0.5"},
ys.map(y =>
xs.map(x => {
@ -70,4 +70,4 @@ const tenPrint = content => {
)]]
}
module.exports = content => content
module.exports = content => serialize(tenPrint(content || ''))

6
src/_includes/posts.njk
View file

@ -1,5 +1,9 @@
{% extends "root.njk" %}
{% block navigation %}
{% block sidebar %}
<dl>
<dt>Last change</dt>
<dd><time datetime="{{page.date}}">{{page.date | toISODate}}</time></dd>
</dl>
<a href="{{ "/" | url }}">← Home</a>
{% endblock %}

11
src/_includes/root.njk
View file

@ -1,21 +1,20 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{ page.title }}</title>
<title>{% if data.tite %}{{ data.title }} | {% endif %}{{ page.title }}</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🌌</text></svg>">
<link rel="stylesheet" href="{{ '/assets/style.css' | url }}" />
</head>
<body>
<main class="{{ page.url | pageClasses }}">
<header></header>
<nav>
<header>{{ content | header | safe }}</header>
<aside>
<h1>{{ page.title }}</h1>
{% block navigation %}
{% block sidebar %}
{% endblock %}
</nav>
</aside>
<article>
{{ content | safe }}
</article>

16
src/index.njk
View file

@ -1,10 +1,12 @@
{% extends "root.njk" %}
{% block navigation %}
<h2>Recent Posts</h2>
<ul>
{%- for post in (collections.posts | reverse) -%}
<li{% if page.url == post.url %} aria-current="page"{% endif %}><time datetime="{{post.date}}">{{ post.date | toISODate }}</time> -- <a href="{{post.url}}">{{ post.data.title }}</a></li>
{%- endfor -%}
</ul>
{% block sidebar %}
<nav>
<h2>Recent Posts</h2>
<ul>
{%- for post in (collections.posts | reverse) -%}
<li{% if page.url == post.url %} aria-current="page"{% endif %}><time datetime="{{post.date}}">{{ post.date | toISODate }}</time> -- <a href="{{post.url}}">{{ post.data.title }}</a></li>
{%- endfor -%}
</ul>
</nav>
{% endblock %}