feat: ✨ add definition lists to markdown

eleventy.config.js

@@ -18,6 +18,7 @@ import markdownItAbbr from 'markdown-it-abbr';
 import markdownItAnchor from 'markdown-it-anchor';
 import markdownItCallouts from 'markdown-it-obsidian-callouts';
 import markdownItCollapsible from 'markdown-it-collapsible';
+import markdownItDeflist from 'markdown-it-deflist';
 import markdownItFootnote from 'markdown-it-footnote';
 
 export default async function (eleventyConfig) {
@@ -101,8 +102,9 @@ export default async function (eleventyConfig) {
     mdLib
       .use(markdownItAbbr)
       .use(markdownItAnchor)
-      .use(markdownItCollapsible)
       .use(markdownItCallouts)
+      .use(markdownItCollapsible)
+      .use(markdownItDeflist)
       .use(markdownItFootnote)
   );
 

package-lock.json

@@ -28,6 +28,7 @@
         "markdown-it-abbr": "^2.0.0",
         "markdown-it-anchor": "^9.2.0",
         "markdown-it-collapsible": "^2.0.2",
+        "markdown-it-deflist": "^3.0.0",
         "markdown-it-footnote": "^4.0.0",
         "markdown-it-obsidian-callouts": "^0.3.0",
         "simple-icons": "^13.14.0",
@@ -5241,6 +5242,11 @@
         "markdown-it": ">=5"
       }
     },
+    "node_modules/markdown-it-deflist": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/markdown-it-deflist/-/markdown-it-deflist-3.0.0.tgz",
+      "integrity": "sha512-OxPmQ/keJZwbubjiQWOvKLHwpV2wZ5I3Smc81OjhwbfJsjdRrvD5aLTQxmZzzePeO0kbGzAo3Krk4QLgA8PWLg=="
+    },
     "node_modules/markdown-it-footnote": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/markdown-it-footnote/-/markdown-it-footnote-4.0.0.tgz",

package.json

@@ -36,6 +36,7 @@
     "markdown-it-abbr": "^2.0.0",
     "markdown-it-anchor": "^9.2.0",
     "markdown-it-collapsible": "^2.0.2",
+    "markdown-it-deflist": "^3.0.0",
     "markdown-it-footnote": "^4.0.0",
     "markdown-it-obsidian-callouts": "^0.3.0",
     "simple-icons": "^13.14.0",

src/css/style.css

@@ -34,6 +34,11 @@ a:not(nav a, .button) {
   @apply font-normal text-inherit underline decoration-sky-600 decoration-2 underline-offset-4 transition-colors duration-300 hover:text-sky-600;
 }
 
+dt {
+  @apply font-normal;
+  font-family: var(--font-heading);
+}
+
 .footnote-item:target p {
   @apply bg-slate-200 dark:bg-sky-950;
 }