Improve taxonomy handling

Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>
Fix unhighlighted code styles
2025-09-13 15:07:18 +01:00 · 2025-09-13 15:07:18 +01:00 · 2025-09-13 15:07:18 +01:00 · 2025-09-13 15:07:18 +01:00 · 2025-09-13 15:07:15 +01:00
21 changed files with 630 additions and 597 deletions
--- a/assets/sass/code.scss
+++ b/assets/sass/code.scss
@@ -1,5 +1,4 @@
-/* PreWrapper */
-.chroma {
+pre {
  color: var(--text);
  background-color: var(--background-50);
  padding: 1rem;
@@ -7,411 +6,418 @@
  overflow-x: auto;
 }

-/* Error */
-.chroma .err {
-  color: var(--accent-500);
-}
+/* PreWrapper */
+.chroma {
+  .line.prompt::before {
+    content: "$ ";
+  }

-/* LineLink */
-.chroma .lnlinks {
+  /* Error */
+  .err {
+    color: var(--accent-500);
+  }
+
+  /* LineLink */
+  .lnlinks {
    outline: none;
    text-decoration: none;
    color: inherit;
-}
+  }

-/* LineTableTD */
-.chroma .lntd {
+  /* LineTableTD */
+  .lntd {
    vertical-align: top;
    padding: 0;
    margin: 0;
    border: 0;
-}
+  }

-/* LineTable */
-.chroma .lntable {
+  /* LineTable */
+  .lntable {
    border-spacing: 0;
    padding: 0;
    margin: 0;
    border: 0;
-}
+  }

-/* LineHighlight */
-.chroma .hl {
+  /* LineHighlight */
+  .hl {
    background-color: var(--background-200);
-}
+  }

-/* LineNumbersTable */
-.chroma .lnt {
+  /* LineNumbersTable */
+  .lnt {
    white-space: pre;
    -webkit-user-select: none;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
-}
+  }

-/* LineNumbers */
-.chroma .ln {
+  /* LineNumbers */
+  .ln {
    white-space: pre;
    -webkit-user-select: none;
    user-select: none;
    margin-right: 0.4em;
    padding: 0 0.4em 0 0.4em;
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
-}
+  }

-/* Line */
-.chroma .line {
+  /* Line */
+  .line {
    display: flex;
-}
+  }

-/* Keyword */
-.chroma .k {
+  /* Keyword */
+  .k {
    color: var(--secondary-600);
-}
+  }

-/* KeywordConstant */
-.chroma .kc {
+  /* KeywordConstant */
+  .kc {
    color: var(--primary-500);
-}
+  }

-/* KeywordDeclaration */
-.chroma .kd {
+  /* KeywordDeclaration */
+  .kd {
    color: var(--secondary-600);
-}
+  }

-/* KeywordNamespace */
-.chroma .kn {
+  /* KeywordNamespace */
+  .kn {
    color: var(--secondary-600);
-}
+  }

-/* KeywordPseudo */
-.chroma .kp {
+  /* KeywordPseudo */
+  .kp {
    color: var(--primary-500);
-}
+  }

-/* KeywordReserved */
-.chroma .kr {
+  /* KeywordReserved */
+  .kr {
    color: var(--secondary-600);
-}
+  }

-/* KeywordType */
-.chroma .kt {
+  /* KeywordType */
+  .kt {
    color: var(--secondary-600);
-}
+  }

-/* Name */
-.chroma .nc {
+  /* Name */
+  .nc {
    color: var(--accent-600);
    font-weight: bold;
-}
+  }

-/* NameConstant */
-.chroma .no {
+  /* NameConstant */
+  .no {
    color: var(--primary-500);
    font-weight: bold;
-}
+  }

-/* NameDecorator */
-.chroma .nd {
+  /* NameDecorator */
+  .nd {
    color: var(--secondary-700);
    font-weight: bold;
-}
+  }

-/* NameEntity */
-.chroma .ni {
+  /* NameEntity */
+  .ni {
    color: var(--accent-600);
-}
+  }

-/* NameException */
-.chroma .ne {
+  /* NameException */
+  .ne {
    color: var(--accent-600);
    font-weight: bold;
-}
+  }

-/* NameLabel */
-.chroma .nl {
+  /* NameLabel */
+  .nl {
    color: var(--primary-500);
    font-weight: bold;
-}
+  }

-/* NameNamespace */
-.chroma .nn {
+  /* NameNamespace */
+  .nn {
    color: var(--secondary-600);
-}
+  }

-/* NameProperty */
-.chroma .py {
+  /* NameProperty */
+  .py {
    color: var(--primary-500);
-}
+  }

-/* NameTag */
-.chroma .nt {
+  /* NameTag */
+  .nt {
    color: var(--primary-600);
-}
+  }

-/* NameVariable */
-.chroma .nv {
+  /* NameVariable */
+  .nv {
    color: var(--primary-500);
-}
+  }

-/* NameVariableClass */
-.chroma .vc {
+  /* NameVariableClass */
+  .vc {
    color: var(--primary-500);
-}
+  }

-/* NameVariableGlobal */
-.chroma .vg {
+  /* NameVariableGlobal */
+  .vg {
    color: var(--primary-500);
-}
+  }

-/* NameVariableInstance */
-.chroma .vi {
+  /* NameVariableInstance */
+  .vi {
    color: var(--primary-500);
-}
+  }

-/* NameVariableMagic */
-.chroma .vm {
+  /* NameVariableMagic */
+  .vm {
    color: var(--primary-500);
-}
+  }

-/* NameFunction */
-.chroma .nf {
+  /* NameFunction */
+  .nf {
    color: var(--secondary-700);
    font-weight: bold;
-}
+  }

-/* NameFunctionMagic */
-.chroma .fm {
+  /* NameFunctionMagic */
+  .fm {
    color: var(--secondary-700);
    font-weight: bold;
-}
+  }

-/* Literal */
-.chroma .l {
+  /* Literal */
+  .l {
    color: var(--primary-600);
-}
+  }

-/* LiteralDate */
-.chroma .ld {
+  /* LiteralDate */
+  .ld {
    color: var(--primary-500);
-}
+  }

-/* LiteralString */
-.chroma .s {
+  /* LiteralString */
+  .s {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringAffix */
-.chroma .sa {
+  /* LiteralStringAffix */
+  .sa {
    color: var(--primary-500);
-}
+  }

-/* LiteralStringBacktick */
-.chroma .sb {
+  /* LiteralStringBacktick */
+  .sb {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringChar */
-.chroma .sc {
+  /* LiteralStringChar */
+  .sc {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringDelimiter */
-.chroma .dl {
+  /* LiteralStringDelimiter */
+  .dl {
    color: var(--primary-500);
-}
+  }

-/* LiteralStringDoc */
-.chroma .sd {
+  /* LiteralStringDoc */
+  .sd {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringDouble */
-.chroma .s2 {
+  /* LiteralStringDouble */
+  .s2 {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringEscape */
-.chroma .se {
+  /* LiteralStringEscape */
+  .se {
    color: var(--primary-500);
-}
+  }

-/* LiteralStringHeredoc */
-.chroma .sh {
+  /* LiteralStringHeredoc */
+  .sh {
    color: var(--primary-500);
-}
+  }

-/* LiteralStringInterpol */
-.chroma .si {
+  /* LiteralStringInterpol */
+  .si {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringOther */
-.chroma .sx {
+  /* LiteralStringOther */
+  .sx {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringRegex */
-.chroma .sr {
+  /* LiteralStringRegex */
+  .sr {
    color: var(--primary-500);
-}
+  }

-/* LiteralStringSingle */
-.chroma .s1 {
+  /* LiteralStringSingle */
+  .s1 {
    color: var(--primary-600);
-}
+  }

-/* LiteralStringSymbol */
-.chroma .ss {
+  /* LiteralStringSymbol */
+  .ss {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumber */
-.chroma .m {
+  /* LiteralNumber */
+  .m {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberBin */
-.chroma .mb {
+  /* LiteralNumberBin */
+  .mb {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberFloat */
-.chroma .mf {
+  /* LiteralNumberFloat */
+  .mf {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberHex */
-.chroma .mh {
+  /* LiteralNumberHex */
+  .mh {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberInteger */
-.chroma .mi {
+  /* LiteralNumberInteger */
+  .mi {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberIntegerLong */
-.chroma .il {
+  /* LiteralNumberIntegerLong */
+  .il {
    color: var(--primary-600);
-}
+  }

-/* LiteralNumberOct */
-.chroma .mo {
+  /* LiteralNumberOct */
+  .mo {
    color: var(--primary-600);
-}
+  }

-/* Operator */
-.chroma .o {
+  /* Operator */
+  .o {
    color: var(--secondary-600);
    font-weight: bold;
-}
+  }

-/* OperatorWord */
-.chroma .ow {
+  /* OperatorWord */
+  .ow {
    color: var(--secondary-600);
    font-weight: bold;
-}
+  }

-/* Comment */
-.chroma .c {
+  /* Comment */
+  .c {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-style: italic;
-}
+  }

-/* CommentHashbang */
-.chroma .ch {
+  /* CommentHashbang */
+  .ch {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-style: italic;
-}
+  }

-/* CommentMultiline */
-.chroma .cm {
+  /* CommentMultiline */
+  .cm {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-style: italic;
-}
+  }

-/* CommentSingle */
-.chroma .c1 {
+  /* CommentSingle */
+  .c1 {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-style: italic;
-}
+  }

-/* CommentSpecial */
-.chroma .cs {
+  /* CommentSpecial */
+  .cs {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-weight: bold;
    font-style: italic;
-}
+  }

-/* CommentPreproc */
-.chroma .cp {
+  /* CommentPreproc */
+  .cp {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-weight: bold;
    font-style: italic;
-}
+  }

-/* CommentPreprocFile */
-.chroma .cpf {
+  /* CommentPreprocFile */
+  .cpf {
    color: color-mix(in srgb, var(--text) 50%, var(--background-50));
    font-weight: bold;
    font-style: italic;
-}
+  }

-/* GenericDeleted */
-.chroma .gd {
+  /* GenericDeleted */
+  .gd {
    color: var(--accent-900);
    background-color: var(--accent-300);
-}
+  }

-/* GenericEmph */
-.chroma .ge {
+  /* GenericEmph */
+  .ge {
    font-style: italic;
-}
+  }

-/* GenericError */
-.chroma .gr {
+  /* GenericError */
+  .gr {
    color: var(--accent-500);
-}
+  }

-/* GenericHeading */
-.chroma .gh {
+  /* GenericHeading */
+  .gh {
    color: var(--primary-500);
    font-weight: bold;
-}
+  }

-/* GenericInserted */
-.chroma .gi {
+  /* GenericInserted */
+  .gi {
    color: var(--primary-800);
    background-color: var(--primary-200);
-}
+  }

-/* GenericOutput */
-.chroma .go {
+  /* GenericOutput */
+  .go {
    color: color-mix(in srgb, var(--text) 70%, var(--background-50));
-}
+  }

-/* GenericPrompt */
-.chroma .gp {
+  /* GenericPrompt */
+  .gp {
    color: color-mix(in srgb, var(--text) 70%, var(--background-50));
-}
+  }

-/* GenericStrong */
-.chroma .gs {
+  /* GenericStrong */
+  .gs {
    font-weight: bold;
-}
+  }

-/* GenericSubheading */
-.chroma .gu {
+  /* GenericSubheading */
+  .gu {
    color: var(--primary-500);
-}
+  }

-/* GenericTraceback */
-.chroma .gt {
+  /* GenericTraceback */
+  .gt {
    color: var(--secondary-600);
-}
+  }

-/* GenericUnderline */
-.chroma .gl {
+  /* GenericUnderline */
+  .gl {
    text-decoration: underline;
+  }
 }
--- a/assets/sass/common.scss
+++ b/assets/sass/common.scss
@@ -16,16 +16,6 @@ a:hover {
  color: var(--text-800);
 }

-sup,
-sub {
-  color: var(--text-600);
-}
-
-sup:hover,
-sub:hover {
-  color: var(--text-800);
-}
-
 h1,
 h2,
 h3,
@@ -64,3 +54,11 @@ body {
    flex: 1;
  }
 }
+
+p {
+  margin: 1.5rem 0 1.5rem 0;
+}
+
+li {
+  margin: 0.5rem 0 0.5rem 0;
+}
--- a/assets/sass/details.scss
+++ b/assets/sass/details.scss
@@ -0,0 +1,55 @@
+main.with-details {
+  max-width: $width-wide;
+  margin: 0 auto;
+  padding: 2rem;
+
+  > .content {
+    width: 100%;
+    padding: 0;
+  }
+
+  $width-sidebar: ($width-wide - $width-content) / 2 - 2rem;
+  display: grid;
+  grid-template-columns: $width-sidebar $width-content $width-sidebar;
+  column-gap: 2rem;
+
+  .title {
+    font-size: 1.75rem;
+    margin: 0;
+  }
+
+  .length {
+    color: color-mix(in srgb, var(--text) 50%, var(--background));
+    margin: 0.5rem 0 0.5rem 0;
+    font-size: 0.8rem;
+  }
+}
+
+@media (max-width: $width-wide) {
+  main.with-details {
+    display: block;
+    padding: 0;
+
+    > .details {
+      max-width: $width-content;
+      margin: 0 auto;
+      padding: 2rem;
+    }
+
+    > .content {
+      padding: 2rem;
+    }
+  }
+}
+
+@media (max-width: $width-mobile) {
+  main.with-details {
+    > .details {
+      padding: 1rem;
+    }
+
+    > .content {
+      padding: 0 1rem 1rem 1rem;
+    }
+  }
+}
--- a/assets/sass/footer.scss
+++ b/assets/sass/footer.scss
@@ -36,6 +36,7 @@
        list-style: none;

        li {
+          margin: 0;
          font-size: 0.85rem;
        }
      }
--- a/assets/sass/hero.scss
+++ b/assets/sass/hero.scss
@@ -1,28 +1,12 @@
 .hero {
  max-width: $width-content;
  margin: 0 auto;
-  padding: 2rem;
+  padding: 2rem 2rem 0 2rem;

  .title {
    margin: 0;
    font-size: 2.5rem;
  }
-
-  .meta {
-    font-size: 0.8rem;
-
-    .date {
-      color: var(--text-600);
-    }
-
-    .duration {
-      color: color-mix(in srgb, var(--text) 50%, var(--background));
-    }
-  }
-
-  .captioned-image {
-    padding-top: 1.5rem;
-  }
 }

 .hero + .content {
--- a/assets/sass/list.scss
+++ b/assets/sass/list.scss
@@ -1,64 +1,17 @@
-main.with-meta {
-  max-width: $width-wide;
-  margin: 0 auto;
-  padding: 2rem;
-
-  > .content {
-    padding: 0;
-  }
-
-  $width-sidebar: ($width-wide - $width-content) / 2 - 2rem;
-  display: grid;
-  grid-template-columns: $width-sidebar $width-content $width-sidebar;
-  column-gap: 2rem;
-
-  h1 {
-    font-size: 1.75rem;
-  }
-
-  .length {
-    color: color-mix(in srgb, var(--text) 50%, var(--background));
-    margin: 0.25rem 0;
-    font-size: 0.8rem;
-  }
-}
-
-@media (max-width: $width-wide) {
-  main.with-meta {
-    display: block;
-    padding: 0;
-
-    > .meta {
-      max-width: $width-content;
-      margin: 0 auto;
-      padding: 2rem;
-    }
-
-    > .content {
-      padding: 2rem;
-    }
-  }
-}
-
-@media (max-width: $width-mobile) {
-  main.with-meta {
-    > .meta {
-      padding: 1rem;
-    }
-
-    > .content {
-      padding: 0 1rem 1rem 1rem;
-    }
-  }
-}
-
 .list {
  .post {
    display: block;
+
+    >a {
      color: inherit;
+    }
+
+    >a:hover {
+      color: var(--text-800);
+    }

    &:not(:first-child) {
-      margin-top: 4rem;
+      margin: 4rem 0 4rem 0;
    }

    .title {
@@ -67,38 +20,20 @@ main.with-meta {
    }

    .summary {
-      margin-top: 0.5rem;
-    }
-
-    .meta {
-      margin-top: 1rem;
-      font-size: 0.8rem;
-
-      .date {
-        color: var(--text-600);
-      }
-
-      .duration {
-        color: color-mix(in srgb, var(--text) 50%, var(--background));
-      }
+      margin: 0.5rem 0 0.5rem 0;
    }

    .heading-anchor {
      display: none;
    }
  }
-
-  .post:hover .title,
-  .post:hover .summary {
-    color: var(--text-800);
-  }
 }

@media (max-width: $width-mobile) {
  .list {
    .post {
      &:not(:first-child) {
-        margin-top: 2rem;
+        margin: 2rem 0 2rem 0;
      }

      .title {
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -11,7 +11,9 @@ $width-wide: 75rem;
@import "blockquote";
@import "code";
@import "table";
+@import "meta";

+@import "details";
@import "list";
@import "gallery";

--- a/assets/sass/meta.scss
+++ b/assets/sass/meta.scss
@@ -0,0 +1,20 @@
+.meta {
+  margin: 1rem 0 1rem 0;
+  font-size: 0.8rem;
+
+  .tag {
+    color: var(--secondary-600);
+  }
+
+  .tag:hover {
+    color: var(--secondary-800);
+  }
+
+  .date {
+    color: var(--text-600);
+  }
+
+  .duration {
+    color: color-mix(in srgb, var(--text) 50%, var(--background));
+  }
+}
--- a/layouts/_default/_markup/render-codeblock-bash.html
+++ b/layouts/_default/_markup/render-codeblock-bash.html
@@ -0,0 +1,4 @@
+{{ $result := transform.HighlightCodeBlock . }}
+{{ $pattern := `(?s)<span class="line"([^>]*)>(\s*<span[^>]*>)?\$ (.*?)(</span>\s*)</span>` }}
+{{ $processed := replaceRE $pattern `<span class="line prompt"$1>$2$3$4</span>` $result.Wrapped }}
+{{ $processed | safeHTML }}
--- a/layouts/_default/_markup/render-image.html
+++ b/layouts/_default/_markup/render-image.html
@@ -1,7 +1,7 @@
-{{ partial "components/image/index.html" (dict
+{{ partial "components/image/index.html" (dict "page" .Page "image" (dict
  "src" .Destination
  "caption" .Text
  "alt" .Title
-  )
+  ))
 }}
 {{- /* chomp trailing newline */ -}}
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,8 +1,8 @@
 {{ define "main" }}
-  {{ $withMeta := default true .Params.withMeta }}
-  <main class="{{- if $withMeta -}}with-meta{{- end -}}">
-    {{ if $withMeta }}
-      {{ partial "components/list/meta.html" . }}
+  {{ $details := default true .Params.details }}
+  <main class="{{- if $details -}}with-details{{- end -}}">
+    {{ if $details }}
+      {{ partial "components/list/details.html" . }}
    {{ end }}
    <div class="content">
      {{ partial "posts/list.html" . }}
--- a/layouts/_shortcodes/sub.html
+++ b/layouts/_shortcodes/sub.html
@@ -0,0 +1 @@
+<sub>{{ .Get 0 | markdownify }}</sub> {{- /* chomp trailing newline */ -}}
--- a/layouts/_shortcodes/sup.html
+++ b/layouts/_shortcodes/sup.html
@@ -0,0 +1 @@
+<sup>{{ .Get 0 | markdownify }}</sup> {{- /* chomp trailing newline */ -}}
--- a/layouts/gallery/list.html
+++ b/layouts/gallery/list.html
@@ -1,10 +1,16 @@
 {{ define "main" }}
-  {{ $withMeta := default true .Params.withMeta }}
-  <main class="{{- if $withMeta -}}with-meta{{- end -}}">
-    {{ if $withMeta }}
-      {{ partial "components/list/meta.html" . }}
+  {{ $details := default true .Params.details }}
+  <main class="{{- if $details -}}with-details{{- end -}}">
+    {{ if $details }}
+      {{ partial "components/list/details.html" . }}
    {{ end }}
-    <div class="{{- if $withMeta -}}content{{- else -}}content wide{{- end -}}">
+    <div
+      class="{{- if $details -}}
+        content
+      {{- else -}}
+        content wide
+      {{- end -}}"
+    >
      {{ partial "gallery/list.html" . }}
    </div>
  </main>
--- a/layouts/partials/components/hero/index.html
+++ b/layouts/partials/components/hero/index.html
@@ -1,9 +1,5 @@
 <section class="hero">
  <h1 class="title">{{ .Title }}</h1>
-  <div class="meta">
-    <span class="date">{{ .Date | time.Format ":date_medium" }}</span>
-    &middot;
-    <span class="duration">{{ printf "%d MIN READ" .ReadingTime }}</span>
-  </div>
-  {{ partial "components/image/index.html" .Params.hero }}
+  {{ partial "components/meta/index.html" . }}
+  {{ partial "components/image/index.html" (dict "page" .Page "image" .Params.hero) }}
 </section>
--- a/layouts/partials/components/image/index.html
+++ b/layouts/partials/components/image/index.html
@@ -1,24 +1,59 @@
-{{ $imageData := partial "components/image/reflect.html" . }}
-{{- with $imageData.image -}}
+{{- $page := .page -}}
+{{- $image := .image -}}
+
+{{- $src := $image -}}
+{{- $caption := "" -}}
+{{- $title := "" -}}
+{{- $alt := "" -}}
+
+{{- if reflect.IsMap $image -}}
+  {{- $src = $image.src | default "" -}}
+  {{- $caption = $image.caption | default "" -}}
+  {{- $title = $image.title | default $caption | default "" | plainify -}}
+  {{- $alt = $image.alt | default $title | default "" | plainify -}}
+{{- end -}}
+
+{{- if $src -}}
+  {{- $isRemote := strings.HasPrefix $src "http" -}}
+
+  {{- if $isRemote -}}
+    {{- $remote := resources.GetRemote $src -}}
+    {{- $image = resources.Copy (printf "static/3rd-party/%s" $remote.Name) $remote -}}
+  {{- else -}}
+    {{- $image = ($page.Resources.Get $src) | default (resources.Get $src) -}}
+  {{- end -}}
+{{- end -}}
+
+{{- with $image -}}
+  {{ $full := . | images.Filter (images.Process "webp q90") }}
+
+  {{ $thumb := . }}
+  {{- if gt .Width 2000 -}}
+    {{- $thumb = . | images.Filter (images.Process "resize 2000x webp q75") -}}
+  {{- else -}}
+    {{- $thumb = . | images.Filter (images.Process "webp q75") -}}
+  {{- end -}}
+
+
  <figure class="captioned-image lightbox">
    <a
-      href="{{- .RelPermalink -}}"
-      data-pswp-src="{{- .RelPermalink -}}"
-      data-pswp-width="{{- .Width -}}"
-      data-pswp-height="{{- .Height -}}"
+      href="{{- $full.RelPermalink -}}"
+      data-pswp-src="{{- $full.RelPermalink -}}"
+      data-pswp-width="{{- $full.Width -}}"
+      data-pswp-height="{{- $full.Height -}}"
      class="pswp-image"
    >
      <img
-        src="{{- .RelPermalink -}}"
-        width="{{- .Width -}}"
-        height="{{- .Height -}}"
+        src="{{- $thumb.RelPermalink -}}"
+        width="{{- $thumb.Width -}}"
+        height="{{- $thumb.Height -}}"
        loading="lazy"
-        {{ with $imageData.title }}title="{{- . -}}"{{ end }}
-        {{ with $imageData.alt }}alt="{{- . -}}"{{ end }}
+        {{ with $title }}title="{{- . -}}"{{ end }}
+        {{ with $alt }}alt="{{- . -}}"{{ end }}
      />
    </a>
-    {{ with $imageData.caption }}
-      <figcaption>{{ . }}</figcaption>
+    {{ with $caption }}
+      <figcaption>{{ . | safeHTML }}</figcaption>
    {{ end }}
  </figure>
 {{- end -}}
--- a/layouts/partials/components/image/reflect.html
+++ b/layouts/partials/components/image/reflect.html
@@ -1,31 +0,0 @@
-{{- $input := . -}}
-
-{{- $src := $input -}}
-{{- $caption := "" -}}
-{{- $title := "" -}}
-{{- $alt := "" -}}
-
-{{- if reflect.IsMap $input -}}
-  {{- $src = $input.src | default "" -}}
-  {{- $caption = $input.caption | default "" -}}
-  {{- $title = $input.title | default $caption | default "" -}}
-  {{- $alt = $input.alt | default $title | default "" -}}
-{{- end -}}
-
-{{ $result := dict "image" nil "caption" $caption "title" $title "alt" $alt }}
-
-{{- if $src -}}
-  {{- $isRemote := strings.HasPrefix $src "http" -}}
-  {{- $image := "" -}}
-
-  {{- if $isRemote -}}
-    {{- $remote := resources.GetRemote $src -}}
-    {{- $image = resources.Copy (printf "static/3rd-party/%s" $remote.Name) $remote -}}
-  {{- else -}}
-    {{- $image = resources.Get $src -}}
-  {{- end -}}
-
-  {{- $result = (dict "image" $image "caption" $caption "title" $title "alt" $alt) -}}
-{{- end -}}
-
-{{- return $result -}}
--- a/layouts/partials/components/list/details.html
+++ b/layouts/partials/components/list/details.html
@@ -1,5 +1,5 @@
-<section class="meta">
-  <h1>{{ .Page.Title }}</h1>
+<section class="details">
+  <h1 class="title">{{ .Page.Title }}</h1>
  <p class="length">A {{ .Kind }} with {{ len .Pages }} items</p>
  {{ .Content }}
 </section>
--- a/layouts/partials/components/meta/index.html
+++ b/layouts/partials/components/meta/index.html
@@ -0,0 +1,18 @@
+<div class="meta">
+  <span class="date">{{ .Date | time.Format ":date_medium" }}</span>
+  &middot;
+  {{ if eq .Kind "page" }}
+    {{ range .Params.tags }}
+      <a href="/tags/{{ . | urlize }}" class="tag">{{ . }}</a>
+      &middot;
+    {{ end }}
+    <span class="duration">
+      {{ printf "%d min. read" .ReadingTime }}
+    </span>
+  {{ else }}
+    {{ $count := len .Pages }}
+    <span class="duration">
+      {{ printf "%d %s" $count (cond (eq $count 1) "item" "items") }}
+    </span>
+  {{ end }}
+</div>
--- a/layouts/partials/components/postnav/index.html
+++ b/layouts/partials/components/postnav/index.html
@@ -1,8 +1,9 @@
-{{ $pages := .CurrentSection.Pages.ByDate }}
+{{ $pages := .CurrentSection.Pages.ByDate.Reverse }}


 <div class="postnav">
  {{ with $pages.Prev . }}
+    {{ if eq .Kind "page" }}
      <a href="{{ .RelPermalink }}">
        <div class="previous">
          <p class="caption">Previous Post</p>
@@ -10,8 +11,10 @@
        </div>
      </a>
    {{ end }}
+  {{ end }}

  {{ with $pages.Next . }}
+    {{ if eq .Kind "page" }}
      <a href="{{ .RelPermalink }}">
        <div class="next">
          <p class="caption">Next Post</p>
@@ -19,4 +22,5 @@
        </div>
      </a>
    {{ end }}
+  {{ end }}
 </div>
--- a/layouts/partials/posts/list.html
+++ b/layouts/partials/posts/list.html
@@ -1,15 +1,13 @@
 <div class="list">
  {{ range sort .Pages "Date" "desc" }}
    {{ if not .Params.private }}
-      <a href="{{- .RelPermalink -}}" class="post">
+      <div class="post">
+        <a href="{{- .RelPermalink -}}">
          <h1 class="title">{{ .Title }}</h1>
          <div class="summary">{{ .Summary | plainify }}</div>
-        <div class="meta">
-          <span class="date">{{ .Date | time.Format ":date_medium" }}</span>
-          &middot;
-          <span class="duration">{{ printf "%d MIN READ" .ReadingTime }}</span>
-        </div>
        </a>
+        {{ partial "components/meta/index.html" . }}
+      </div>
    {{ end }}
  {{ end }}
 </div>
Author	SHA1	Message	Date
Nikolaos Karaolidis	9905066046	Improve taxonomy handling Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>	2025-09-13 15:07:18 +01:00
Nikolaos Karaolidis	4e37655a16	Fix unhighlighted code styles Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>	2025-09-13 15:07:18 +01:00
Nikolaos Karaolidis	de272212ca	Add shell prompt support Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>	2025-09-13 15:07:18 +01:00
Nikolaos Karaolidis	8fac4841d4	Fix layout bugs Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>	2025-09-13 15:07:18 +01:00
Nikolaos Karaolidis	c52639e38f	Add image processing Signed-off-by: Nikolaos Karaolidis <nick@karaolidis.com>	2025-09-13 15:07:15 +01:00
				`@@ -0,0 +1 @@`
				`<sub>{{ .Get 0 \| markdownify }}</sub> {{- /* chomp trailing newline */ -}}`
				`@@ -0,0 +1 @@`
				`<sup>{{ .Get 0 \| markdownify }}</sup> {{- /* chomp trailing newline */ -}}`