fix #100: change link icon class to use unocss (#108)

Allows to have the link icons in the articles as css icons generated at
compile time, like the other icons on the site, instead of importing
them from fontawesome at runtime

src/routes/+layout.svelte

@@ -27,6 +27,9 @@
 	export let data;
 </script>
 
+<!-- Needed to tell unocss that the link icon is indeed used -->
+<div class="i-fa6-solid-link is-hidden" />
+
 <HtmlHead />
 
 <input id="low-contrast" type="checkbox" class="is-hidden" />

svelte.config.js

@@ -38,13 +38,13 @@ export default {
 						content: {
 							type: "element",
 							tagName: "span",
-							properties: { className: "icon header-anchor-container pl-3" },
+							properties: { className: "header-anchor-container pl-2" },
 							children: [
 								{
 									type: "element",
 									tagName: "i",
 									properties: {
-										className: "header-anchor fas fa-lg fa-link has-text-link is-size-5"
+										className: "header-anchor icon i-fa6-solid-link has-text-link is-size-5"
 									}
 								}
 							]

uno.config.ts

@@ -3,11 +3,7 @@ import { defineConfig, presetIcons } from "unocss";
 export default defineConfig({
 	presets: [
 		presetIcons({
-			collections: {
-				"fa6-solid": () => import("@iconify-json/fa6-solid/icons.json").then((i) => i.default),
-				"fa6-brands": () => import("@iconify-json/fa6-brands/icons.json").then((i) => i.default),
-				tabler: () => import("@iconify-json/tabler/icons.json").then((i) => i.default)
-			},
+			// Collections are automatically imported from inconify packages
 			customizations: {
 				iconCustomizer(collection, icon, props) {
 					// Makes the empty cut in half circle slightly larger