From e9d882f79e706f8468f7babc59b542d9e2f6583e Mon Sep 17 00:00:00 2001
From: Simon Phumin Schweikert <git@simonschweikert.com>
Date: Mon, 23 Jun 2025 21:41:19 +0900
Subject: [PATCH 1/2] improved teaser typography

---
 apps/blog/src/routes/about/+page.svelte |  4 ++--
 apps/blog/src/routes/blog/+page.svelte  |  2 +-
 packages/ui/src/styles/typography.css   | 10 +++++-----
 3 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/apps/blog/src/routes/about/+page.svelte b/apps/blog/src/routes/about/+page.svelte
index f3038b9..6f05d7e 100644
--- a/apps/blog/src/routes/about/+page.svelte
+++ b/apps/blog/src/routes/about/+page.svelte
@@ -15,7 +15,7 @@
 	>
 		<div class="flex flex-col justify-center items-center py-24">
 			{#if about.title}
-				<h1 class="text-6xl md:text-8xl text-center mb-8">{about.title}</h1>
+				<h1 class="text-center mb-8 text-teasered">{about.title}</h1>
 			{/if}
 			{#if about.about_intro}
 				<p class="max-w-2xl text-center text-lg">
@@ -60,7 +60,7 @@
 					aria-label="Person with impairments icon"
 					class="pb-8"
 				/>
-				<h2 class="text-6xl md:text-8xl text-center mb-8 font-highlight">
+				<h2 class="text-teasered text-center mb-8">
 					{about.about_outro_headline}
 				</h2>
 				<p class="max-w-2xl text-center text-lg">
diff --git a/apps/blog/src/routes/blog/+page.svelte b/apps/blog/src/routes/blog/+page.svelte
index d3b32d6..e6c94f6 100644
--- a/apps/blog/src/routes/blog/+page.svelte
+++ b/apps/blog/src/routes/blog/+page.svelte
@@ -12,7 +12,7 @@
 		<h1 class="text-4xl font-bold mb-10">Blog</h1>
 		<ul class="list-none p-0 m-0">
 			{#each posts as post, index (post._id)}
-				<li class="mb-0 p-0" use:animate={{ delay: 200 + index * 100 }}>
+				<li class="list-none mb-0 p-0" use:animate={{ delay: 200 + index * 100 }}>
 					<PostPreview {post} excerptLength={30} />
 				</li>
 			{/each}
diff --git a/packages/ui/src/styles/typography.css b/packages/ui/src/styles/typography.css
index f856cbd..1f275aa 100644
--- a/packages/ui/src/styles/typography.css
+++ b/packages/ui/src/styles/typography.css
@@ -12,19 +12,19 @@ h5 {
 }
 
 h2 {
-	@apply text-xl md:text-2xl lg:text-3xl tracking-tight text-foreground;
+	@apply text-xl md:text-xl lg:text-2xl text-foreground;
 }
 
 h3 {
-	@apply text-lg md:text-xl lg:text-2xl tracking-tight text-foreground;
+	@apply text-base md:text-lg lg:text-xl text-foreground;
 }
 
 h4 {
-	@apply text-base md:text-lg lg:text-xl tracking-tight text-foreground;
+	@apply text-base md:text-lg lg:text-xl text-foreground;
 }
 
 h5 {
-	@apply text-base md:text-lg lg:text-xl tracking-tight text-foreground;
+	@apply text-base md:text-lg lg:text-xl text-foreground;
 }
 
 /* Body text */
@@ -49,7 +49,7 @@ p {
 
 /* Large highlighted/teasered text */
 .text-teasered {
-	@apply text-2xl md:text-3xl lg:text-4xl tracking-wide;
+	@apply text-4xl md:text-6xl lg:text-7xl xl:text-8xl font-highlight;
 }
 
 /* Lists */

From fe350d339687d37c33e7b8c4799b348d895a0a63 Mon Sep 17 00:00:00 2001
From: Simon Phumin Schweikert <git@simonschweikert.com>
Date: Mon, 23 Jun 2025 22:03:16 +0900
Subject: [PATCH 2/2] fixed ul rendering, excluded .netlify from linting

---
 apps/blog/eslint.config.js                   |  2 +-
 apps/blog/src/routes/blog/+page.svelte       |  4 +--
 packages/ui/src/components/Navigation.svelte |  4 +--
 packages/ui/src/styles/globals.css           | 38 +++++++++++++++++---
 packages/ui/src/styles/typography.css        | 31 ----------------
 5 files changed, 38 insertions(+), 41 deletions(-)

diff --git a/apps/blog/eslint.config.js b/apps/blog/eslint.config.js
index c8cdc78..b8a4545 100644
--- a/apps/blog/eslint.config.js
+++ b/apps/blog/eslint.config.js
@@ -3,6 +3,6 @@ import { config } from '@a11y.cool/eslint-config/index.js';
 export default [
 	...config,
 	{
-		ignores: ['.svelte-kit/*', '.vercel/*']
+		ignores: ['.svelte-kit/*', '.vercel/*', '.netlify/**']
 	}
 ];
diff --git a/apps/blog/src/routes/blog/+page.svelte b/apps/blog/src/routes/blog/+page.svelte
index e6c94f6..075484a 100644
--- a/apps/blog/src/routes/blog/+page.svelte
+++ b/apps/blog/src/routes/blog/+page.svelte
@@ -10,9 +10,9 @@
 <section class="col-span-12 col-start-1 flex justify-center" use:animate={{ delay: 0 }}>
 	<div class="pt-10 max-w-[580px] w-full">
 		<h1 class="text-4xl font-bold mb-10">Blog</h1>
-		<ul class="list-none p-0 m-0">
+		<ul>
 			{#each posts as post, index (post._id)}
-				<li class="list-none mb-0 p-0" use:animate={{ delay: 200 + index * 100 }}>
+				<li class="list-none" use:animate={{ delay: 200 + index * 100 }}>
 					<PostPreview {post} excerptLength={30} />
 				</li>
 			{/each}
diff --git a/packages/ui/src/components/Navigation.svelte b/packages/ui/src/components/Navigation.svelte
index 7d78e81..293a944 100644
--- a/packages/ui/src/components/Navigation.svelte
+++ b/packages/ui/src/components/Navigation.svelte
@@ -27,7 +27,7 @@
 <div class="flex z-100 md:hidden justify-end w-full">
 	<DropdownMenu.Root>
 		<DropdownMenu.Trigger
-			class="p-2 rounded-md hover:bg-muted focus:bg-muted focus:outline-none"
+			class="p-2 rounded-md hover:bg-muted focus-visible:bg-muted focus:outline-none"
 		>
 			<!-- Hamburger Icon -->
 			<List aria-labelledby="open-menu" class="h-6 w-6" size={24} />
@@ -40,7 +40,7 @@
 				<DropdownMenu.Item>
 					<a
 						href={item.href}
-						class="block px-4 py-2 rounded hover:bg-muted focus:bg-muted focus:outline-none"
+						class="block px-4 py-2 rounded hover:bg-muted focus-visible:bg-muted focus:outline-none"
 					>
 						{item.label}
 					</a>
diff --git a/packages/ui/src/styles/globals.css b/packages/ui/src/styles/globals.css
index 28ad0c1..95a480e 100644
--- a/packages/ui/src/styles/globals.css
+++ b/packages/ui/src/styles/globals.css
@@ -306,12 +306,40 @@
 		color: var(--background);
 	}
 
-	/* Remove list item dots from navigation lists */
+	/* Lists */
+	article ul,
+	article ol {
+		@apply text-base mb-4 ml-6 last:mb-0;
+	}
+
 	nav ul,
-	nav li {
-		margin-left: 0;
-		list-style: none;
-		padding-left: 0;
+	nav ol {
+		@apply ml-0 list-none;
+	}
+
+	ul {
+		@apply list-disc;
+	}
+
+	ol {
+		@apply list-decimal;
+	}
+
+	li {
+		@apply mb-2 last:mb-0;
+	}
+
+	/* Nested lists */
+	ul ul,
+	ol ol,
+	ul ol,
+	ol ul {
+		@apply mt-2 mb-0;
+	}
+
+	/* List items with paragraphs */
+	li > p {
+		@apply mb-2 last:mb-0;
 	}
 
 	a {
diff --git a/packages/ui/src/styles/typography.css b/packages/ui/src/styles/typography.css
index 1f275aa..c2a79c9 100644
--- a/packages/ui/src/styles/typography.css
+++ b/packages/ui/src/styles/typography.css
@@ -52,37 +52,6 @@ p {
 	@apply text-4xl md:text-6xl lg:text-7xl xl:text-8xl font-highlight;
 }
 
-/* Lists */
-ul,
-ol {
-	@apply text-base mb-4 ml-6 last:mb-0;
-}
-
-ul {
-	@apply list-disc;
-}
-
-ol {
-	@apply list-decimal;
-}
-
-li {
-	@apply mb-2 last:mb-0;
-}
-
-/* Nested lists */
-ul ul,
-ol ol,
-ul ol,
-ol ul {
-	@apply mt-2 mb-0;
-}
-
-/* List items with paragraphs */
-li > p {
-	@apply mb-2 last:mb-0;
-}
-
 /* Text alignment utilities */
 .text-left {
 	@apply text-left;