src/lib/components/AboutMe.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+	import { m } from '$lib/paraglide/messages.js';
+
+	let { cssClass = '' }: { cssClass: string } = $props();
+
+	const stacks = m['aboutme.tools.stacks']().split(',');
+</script>
+
+<section class={`bg-amber-50 ${cssClass}`}>
+	<div>
+		<h2 class="text-xl font-medium">{m['aboutme.header']()}</h2>
+		<span>{m['aboutme.intro']()}</span>
+	</div>
+
+	<div>
+		<p>{m['aboutme.tools.intro']()}</p>
+		<ul class="list-disc">
+			{#each stacks as stack}
+				<li class="ms-4">{stack}</li>
+			{/each}
+		</ul>
+	</div>
+
+	<div>
+		{m['aboutme.ending']()}
+	</div>
+</section>