various small fixes

src/_includes/intro.md

@@ -1,5 +1,5 @@
 # Welcome dear web-traveler!
 
 You have reached the home of Carl Räfting on the _World Wide Web_ 🌐. If you
-want, [find out more about this website](/about/), or read some of my blog posts
-down below.
+want, [find out more about this website](/about/), or read some of my written
+pieces below.

src/_includes/layouts/post.vto

@@ -1,16 +1,19 @@
 ---
 layout: ./page.vto
 ---
-<article {{ if lang }}lang="{{ lang }}"{{ /if }}>
+<article {{ if lang }} lang="{{ lang }}" {{ /if }}>
+<header>
 <h1>{{ title }}</h1>
 <time datetime="{{ date.toISOString() }}">{{ date |> date('HUMAN_DATE', lang) }}</time>
+<span class="symbol">⁕</span>
 <a href="{{ url |> url(true) }}">
     {{ if lang == 'en' }}
     Permalink
     {{ else if lang == 'sv' }}
     Permanentlänk
     {{ /if }}
 </a>
+</header>
 {{ content }}
 <footer>
 {{ set post = search.previousPage(url, 'type=post') }}

src/css/global/all.css

@@ -33,12 +33,16 @@ legend {
     margin-block-end: 1rem;
 }
 
+iframe {
+    border: 0;
+}
+
 svg,
 img {
     display: block;
     width: auto;
     height: auto;
-    max-width: 100%;
+    max-inline-size: 100%;
 }
 
 figure {
@@ -92,7 +96,6 @@ h1,
 h2,
 h3 {
     line-height: 1.1875;
-    max-inline-size: 40ch;
     text-wrap: balance;
 }
 
@@ -144,14 +147,21 @@ blockquote {
     &::before {
         content: "»";
         font-size: 2rem;
-        line-height: 1;
         position: absolute;
         top: 0;
         left: 0;
-        translate: .5rem;
+        translate: .75rem .5rem;
     }
 }
 
+figure {
+    margin-block-end: 1rem;
+}
+
+.symbol {
+    opacity: 50%;
+}
+
 .text-italic {
     font-style: italic;
 }

src/css/global/print.css

@@ -4,3 +4,8 @@ a[href] {
         content: " (" attr(href) ") ";
     }
 }
+
+
+nav {
+    display: none;
+}

src/css/page/layout.css

@@ -127,3 +127,9 @@
         }
     }
 }
+
+@layer article {
+    article>header {
+        margin-block-end: 1rem;
+    }
+}

src/index.vto

@@ -5,8 +5,6 @@ layout: layouts/page.vto
 
 {{ include 'intro.md' |> md }}
 
-<h1>Blog Posts</h1>
-
 <div class="posts">
 {{ set current_year = null }}
 {{ set current_month = null }}
@@ -21,7 +19,7 @@ layout: layouts/page.vto
         {{ set current_month = month }}
         <h3>{{ post.date |> date('MMMM') }}</h3>
     {{ /if }}
-    <article>
+    <article {{ if post.lang }} lang="{{ post.lang }}" {{ /if }}>
         <time datetime="{{ post.date.toISOString() }}">{{ post.date |> date('dd') }}</time>
         <h4><a href="{{ post.url }}">{{ post.title }}</a></h4>
     </article>