more blog updates

scripts/bootstrap-icons/src/classes.json

···
   "bi-info-circle",
   "bi-lightning",
   "bi-list-ul",
+  "bi-paragraph",
   "bi-pencil",
   "bi-question-circle",
   "bi-quote",

src/_components/navbar.vto

···
-<header role="banner" class="bg-mantle min-h-20 flex flex-row justify-around mb-2">
+<header class="bg-mantle min-h-20 flex flex-row justify-around mb-2">
     <a class="flex flex-row justify-center gap-x-4 content-center" href="/">
         {{ await comp.logo() }}
     </a>

src/_components/post_card.vto

···
                 <p class="text-subtext1 text-lg">{{ post.title }}</p>
                 <p class="inline italic text-subtext0">{{ post.summary }}</p>
                 <p class="float-right inline text-blue">
-                    <time datetime="{{ post.date |> date('date') }}">
-                        {{ post.date |> date('DATE') }}
+                    <time datetime="{{ post.published |> date('date') }}">
+                        {{ post.published |> date('DATE') }}
                     </time>
                 </p>
             </div>
···
                 <h2 class="text-subtext1 font-serif text-2xl mb-2">{{ post.title }}</h2>
                 <h3 class="text-lg lg:inline italic text-subtext0">{{ post.summary }}</h3>
                 <p class="text-lg lg:float-right lg:inline text-blue">
-                    <time datetime="{{ post.date |> date('date') }}">
-                        {{ post.date |> date('DATE') }}
+                    <time datetime="{{ post.published |> date('date') }}">
+                        {{ post.published |> date('DATE') }}
                     </time>
                 </p>
             </div>

src/_includes/layouts/about.vto

···
     <main class="min-h-screen text-text justify-self-center w-full lg:w-1/2 h-card">
         <h1 class="my-8 text-5xl text-bold text-mauve">
             About
-            <div class="p-name p-nickname inline">
+            <span class="p-name p-nickname inline">
                 dish
-            </div>
+            </span>
         </h1>
 
         <div class="text-lg">

src/_includes/layouts/blog-list.vto

···
             <i class="text-5xl si si-rss"></i>
         </a>
         <ul class="mt-8">
-            {{ for post of search.pages("category=blog") }}
+            {{ for post of search.pages("category=blog", "published=desc") }}
                 {{ await comp.post_card({"post": post}) }}
             {{ /for }}
         </ul>

src/_includes/layouts/blog-post.vto

···
             </h2>
             <h2 class="text-2xl font-sans mb-8 text-overlay1">
                 By
-                <div class="inline p-author">{{ author.name }}</div>
+                <span class="inline p-author">{{ author.name }}</span>
             </h2>
 
             <div class="e-content text-lg">

src/blog/example-blog-post-2.md

···
 published: 2025-02-14
 ---
 
-# example blog post 2
+## example blog post 2
 
 here's another link: [[example-blog-post]]

src/blog/example-blog-post.md

···
 published: 2025-02-14
 ---
 
-# meow meow!
+## meow meow! {#meow-meow}

src/static/icons/bsi.min.css

···
 @font-face {
   font-display: block;
   font-family: bootstrap-icons;
-  src: url("/static/icons/bsi.min.woff2?v=1740025433") format("woff2");
+  src: url("/static/icons/bsi.min.woff2?v=1740282679") format("woff2");
 }
 .bi::before,
 [class*=" bi-"]::before,
···
 }
 .bi-list-ul::before {
   content: "\f478";
+}
+.bi-paragraph::before {
+  content: "\f4b4";
 }
 .bi-pencil::before {
   content: "\f4cb";

src/static/styles.css

···
     div.callout-content > p {
         @apply mb-0;
     }
+
+    h2:has(a.header-anchor) {
+        @apply text-3xl text-mauve relative mb-8 no-underline;
+        left: -1.75rem;
+    }
+    h2:has(a.header-anchor)::before {
+        @apply text-2xl relative mr-1;
+        top: 0.25rem;
+        font-family: "bootstrap-icons";
+        content: "\F4B4";
+    }
+}
+
+@utility header-anchor {
+    @apply text-mauve!;
 }
 
 @utility callout {