diff --git a/content/layouts/blogpost.njk b/content/layouts/blogpost.njk index 1e1d9da..4d956c8 100644 --- a/content/layouts/blogpost.njk +++ b/content/layouts/blogpost.njk @@ -5,7 +5,8 @@ layout: 'base.njk'

{{title}}

- {{date}} {% if modified !== date %}(Last modified: {{modified}}){% endif %}
+ {{date | dateLocale}} {% if modified !== date %}(Last modified: {{modified | dateLocale}}){% endif %} +
<- Back to posts list
diff --git a/content/pages/blog.njk b/content/pages/blog.njk index ea6ae7f..14e4a25 100644 --- a/content/pages/blog.njk +++ b/content/pages/blog.njk @@ -4,6 +4,8 @@ permalink: "/blog/" ---

Blog

-{% for post in collections.blogpost %} -{{post.data.title}} +{% for post in collections.blogpost | reverse %} +
+ {{post.data.date | dateLocale}} - {{post.data.title}} +
{% endfor %} \ No newline at end of file diff --git a/content/style.scss b/content/style.scss index aa49841..ffa0fea 100644 --- a/content/style.scss +++ b/content/style.scss @@ -1,6 +1,8 @@ +@use "sass:color"; + $grey-vdark: rgb(17, 24, 39); -$grey-dark: lighten($grey-vdark, 5); -$grey-medium: lighten($grey-vdark, 15); +$grey-dark: color.adjust($grey-vdark, $lightness: 5%); +$grey-medium: color.adjust($grey-vdark, $lightness: 15%); $grey-light: #4c566a; $white-dark: #d8dee9; $white-light: #eceff4; @@ -89,14 +91,25 @@ body { h2, h3, h4 { - margin-bottom: 0rem; - margin-top: 1rem; font-weight: 700; } + h1, + h2 { + margin-bottom: 0.4rem; + margin-top: 1rem; + } + + h3, + h4, + h5 { + margin-bottom: 0rem; + margin-top: 0.5rem; + } + p { - margin-top: 0.6rem; - margin-bottom: 1.2rem; + margin-top: 0.4rem; + margin-bottom: 1.4rem; } code, diff --git a/eleventy.config.js b/eleventy.config.js index b1e0ef3..d725587 100644 --- a/eleventy.config.js +++ b/eleventy.config.js @@ -1,6 +1,16 @@ import sass from "sass"; +import { DateTime } from "luxon"; export default async function (eleventyConfig) { + eleventyConfig.addFilter("dateLocale", function (value) { + return DateTime.fromISO(new Date(value).toISOString()).toLocaleString({ + year: 'numeric', + month: 'short', + day: '2-digit', + }); + }); + + // SCSS eleventyConfig.addTemplateFormats("scss"); eleventyConfig.addExtension("scss", { diff --git a/package-lock.json b/package-lock.json index b104a43..6d5443b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,6 +10,7 @@ "license": "ISC", "dependencies": { "@11ty/eleventy": "^3.0.0", + "luxon": "^3.5.0", "sass": "^1.83.4" } }, diff --git a/package.json b/package.json index 5948f20..49e6fa4 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "type": "module", "dependencies": { "@11ty/eleventy": "^3.0.0", + "luxon": "^3.5.0", "sass": "^1.83.4" } }