nyancrimew
/
maia.crimew.gay
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity

blog: post layout improvements

pull/1/head
maia arson crimew 2023-05-19 13:56:16 +02:00
parent 10bfb88a0e
commit bea3c64d0f
7 changed files with 88 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.eleventy.js
View File

@ -1,5 +1,6 @@
const syntaxHighlight = require('@11ty/eleventy-plugin-syntaxhighlight')
const pluginRss = require('@11ty/eleventy-plugin-rss');
const timeToRead = require('eleventy-plugin-time-to-read');
module.exports = function (eleventyConfig) {
const parseDate = (str) => {
@ -12,8 +13,9 @@ module.exports = function (eleventyConfig) {
const formatPart = (part, date) =>
new Intl.DateTimeFormat("en", part).format(date);
eleventyConfig.addPlugin(pluginRss)
eleventyConfig.addPlugin(syntaxHighlight)
eleventyConfig.addPlugin(pluginRss);
eleventyConfig.addPlugin(syntaxHighlight);
eleventyConfig.addPlugin(timeToRead);
eleventyConfig.addPassthroughCopy({ "src/static": "/" });

25
package-lock.json generated
View File

@ -10,7 +10,8 @@
"dependencies": {
"@11ty/eleventy": "^v2.0.0-beta.1",
"@11ty/eleventy-plugin-rss": "^1.2.0",
"@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0"
"@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0",
"eleventy-plugin-time-to-read": "^1.3.0"
}
},
"node_modules/@11ty/dependency-tree": {
@ -705,6 +706,22 @@
"node": ">=0.10.0"
}
},
"node_modules/eleventy-plugin-time-to-read": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/eleventy-plugin-time-to-read/-/eleventy-plugin-time-to-read-1.3.0.tgz",
"integrity": "sha512-EefxYZJviQbClwoQ+pXW0YsVoi3gzXJ3prJoOLO1g3n5dM17KyZh81/yyq5Inrdc2pxBz3CXsyo21kk43gK/Gg==",
"engines": {
"node": ">=13.0.0"
},
"peerDependencies": {
"@11ty/eleventy": "*"
},
"peerDependenciesMeta": {
"@11ty/eleventy": {
"optional": true
}
}
},
"node_modules/encodeurl": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",
@ -2795,6 +2812,12 @@
"jake": "^10.8.5"
}
},
"eleventy-plugin-time-to-read": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/eleventy-plugin-time-to-read/-/eleventy-plugin-time-to-read-1.3.0.tgz",
"integrity": "sha512-EefxYZJviQbClwoQ+pXW0YsVoi3gzXJ3prJoOLO1g3n5dM17KyZh81/yyq5Inrdc2pxBz3CXsyo21kk43gK/Gg==",
"requires": {}
},
"encodeurl": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-1.0.2.tgz",

3
package.json
View File

@ -10,6 +10,7 @@
"dependencies": {
"@11ty/eleventy": "^v2.0.0-beta.1",
"@11ty/eleventy-plugin-rss": "^1.2.0",
"@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0"
"@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0",
"eleventy-plugin-time-to-read": "^1.3.0"
}
}

4
src/_includes/layouts/post.njk
View File

@ -13,7 +13,11 @@ subhead: blog
{% if changed_date %}
<small class="updated">(updated <time datetime="{{changed_date | date_to_datetime }}">{{ changed_date | date_formatted }}</time>)</small>
{% endif %}
<span class="middot"></span>
<span class="readtime">{{ content | timeToRead }} to read</span>
<span class="middot"></span>
<span>by <span class="author by" id="author">{{ site.name }}</span></span>
<span class="middot"></span>
{% if tags %}
<span>in
{% for tag in tags %}

23
src/posts.njk
View File

@ -11,8 +11,27 @@ permalink: /posts/{% if pagination.pageNumber > 0 %}page/{{ pagination.pageNumbe
{% block main %}
<ul>
{% for entry in pagination.items %}
<li>
<span><a href="{{ entry.url }}">{{ entry.data.title }}</a> on <span><time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time></span></span>
<li class="list-entry">
<a href="{{ entry.url }}"><h2>{{ entry.data.title }}</h2></a>
<div class="byline">
<time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time>
{% if entry.data.changed_date %}
<small class="updated">(updated <time datetime="{{ entry.data.changed_date | date_to_datetime }}">{{ entry.data.changed_date | date_formatted }}</time>)</small>
{% endif %}
<span class="middot"></span>
<span class="readtime">{{ entry.content | timeToRead }} to read</span>
<span class="middot"></span>
<span>by <span class="author by" id="author">{{ site.name }}</span></span>
<span class="middot"></span>
{% if entry.data.tags %}
<span>in
{% for tag in entry.data.tags %}
<span class="tag"><a href="/posts/tagged/{{ tag | slugify }}/">{{ tag }}</a></span>{% if not loop.last %}, {% endif %}
{% endfor %}
</span>
{% endif %}
</div>
<span class="lead"><strong>{{ entry.data.description }}</strong></span>
</li>
{% endfor %}
</ul>

13
src/static/style.css
View File

@ -41,6 +41,14 @@ footer,
text-align: center;
}
.list-entry {
list-style-type: none;
}
.list-entry h2 {
margin-bottom: 0;
}
#content {
max-width: 900px;
margin-left: auto;
@ -53,6 +61,11 @@ footer,
font-size: 0.75rem;
}
.middot::after {
content: '\00B7';
display: inline-block;
}
time,
.author,
.updated {

23
src/tagged.njk
View File

@ -20,9 +20,26 @@ date: git Last Modified
<ul>
{% set taglist = collections[ tag ] %}
{% for entry in taglist | reverse %}
<li>
<span><a href="{{ entry.url }}">{{ entry.data.title }}</a> on <span><time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time></span></span>
</li>
<li class="list-entry">
<a href="{{ entry.url }}"><h2>{{ entry.data.title }}</h2></a>
<div class="byline">
<time datetime="{{ entry.page.date | date_to_datetime }}">{{ entry.page.date | date_formatted }}</time>
{% if entry.data.changed_date %}
<small class="updated">(updated <time datetime="{{ entry.data.changed_date | date_to_datetime }}">{{ entry.data.changed_date | date_formatted }}</time>)</small>
{% endif %}
<span class="middot"></span>
<span>by <span class="author by" id="author">{{ site.name }}</span></span>
<span class="middot"></span>
{% if entry.data.tags %}
<span>in
{% for tag in entry.data.tags %}
<span class="tag"><a href="/posts/tagged/{{ tag | slugify }}/">{{ tag }}</a></span>{% if not loop.last %}, {% endif %}
{% endfor %}
</span>
{% endif %}
</div>
<span class="lead"><strong>{{ entry.data.description }}</strong></span>
</li>
{% endfor %}
</ul>
{% endblock %}