From 54e53d278ec424ceb54e4ec12bae59bfbdc92b65 Mon Sep 17 00:00:00 2001 From: itsfinniii <102350242+itsfinniii@users.noreply.github.com> Date: Sat, 28 Mar 2026 19:24:57 +0100 Subject: [PATCH] Fix project and blog posts --- astro/package-lock.json | 26 +++++++++++++++++++ astro/package.json | 1 + astro/src/components/blogs/BlogPost.astro | 23 +++++++++------- .../src/components/projects/ProjectPost.astro | 23 +++++++++------- astro/src/pages/[...route].astro | 7 ++--- astro/src/styles/global.css | 3 ++- astro/src/styles/markdownClasses.ts | 13 ++++++++++ 7 files changed, 72 insertions(+), 24 deletions(-) create mode 100644 astro/src/styles/markdownClasses.ts diff --git a/astro/package-lock.json b/astro/package-lock.json index de5a4ed..7296431 100644 --- a/astro/package-lock.json +++ b/astro/package-lock.json @@ -11,6 +11,7 @@ "@astrojs/preact": "^4.1.3", "@directus/sdk": "^21.2.0", "@rollup/plugin-graphql": "^2.0.5", + "@tailwindcss/typography": "^0.5.19", "@tailwindcss/vite": "^4.2.1", "astro": "^5.17.1", "highlight.js": "^11.11.1", @@ -2698,6 +2699,18 @@ "node": ">= 20" } }, + "node_modules/@tailwindcss/typography": { + "version": "0.5.19", + "resolved": "https://registry.npmjs.org/@tailwindcss/typography/-/typography-0.5.19.tgz", + "integrity": "sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==", + "license": "MIT", + "dependencies": { + "postcss-selector-parser": "6.0.10" + }, + "peerDependencies": { + "tailwindcss": ">=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1" + } + }, "node_modules/@tailwindcss/vite": { "version": "4.2.1", "resolved": "https://registry.npmjs.org/@tailwindcss/vite/-/vite-4.2.1.tgz", @@ -6312,6 +6325,19 @@ "node": "^10 || ^12 || >=14" } }, + "node_modules/postcss-selector-parser": { + "version": "6.0.10", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.10.tgz", + "integrity": "sha512-IQ7TZdoaqbT+LCpShg46jnZVlhWD2w6iQYAcYXfHARZ7X1t/UGhhceQDs5X0cGqKvYlHNOuv7Oa1xmb0oQuA3w==", + "license": "MIT", + "dependencies": { + "cssesc": "^3.0.0", + "util-deprecate": "^1.0.2" + }, + "engines": { + "node": ">=4" + } + }, "node_modules/preact": { "version": "10.28.4", "resolved": "https://registry.npmjs.org/preact/-/preact-10.28.4.tgz", diff --git a/astro/package.json b/astro/package.json index f60cdf2..66fbc22 100644 --- a/astro/package.json +++ b/astro/package.json @@ -12,6 +12,7 @@ "@astrojs/preact": "^4.1.3", "@directus/sdk": "^21.2.0", "@rollup/plugin-graphql": "^2.0.5", + "@tailwindcss/typography": "^0.5.19", "@tailwindcss/vite": "^4.2.1", "astro": "^5.17.1", "highlight.js": "^11.11.1", diff --git a/astro/src/components/blogs/BlogPost.astro b/astro/src/components/blogs/BlogPost.astro index ce5815a..87ef49b 100644 --- a/astro/src/components/blogs/BlogPost.astro +++ b/astro/src/components/blogs/BlogPost.astro @@ -2,6 +2,7 @@ import CalendarIcon from '@/icons/CalendarIcon.astro'; import { getImageUrl } from '@/lib/images'; import { markdownToHtml } from '@/lib/markdown'; +import { getTypographyClasses } from '@/styles/markdownClasses'; import { Image } from 'astro:assets'; interface Props { @@ -15,7 +16,7 @@ const { blog } = Astro.props; id={`blog-${blog.id}`} class="flex flex-row justify-center items-center" > -
+

{blog.title}

@@ -24,16 +25,18 @@ const { blog } = Astro.props;
-
- {blog.title} +
+
+ {blog.title} +
-
+
diff --git a/astro/src/components/projects/ProjectPost.astro b/astro/src/components/projects/ProjectPost.astro index c5ddb87..3b42eed 100644 --- a/astro/src/components/projects/ProjectPost.astro +++ b/astro/src/components/projects/ProjectPost.astro @@ -2,6 +2,7 @@ import CalendarIcon from '@/icons/CalendarIcon.astro'; import { getImageUrl } from '@/lib/images'; import { markdownToHtml } from '@/lib/markdown'; +import { getTypographyClasses } from '@/styles/markdownClasses'; import { Image } from 'astro:assets'; interface Props { @@ -15,7 +16,7 @@ const { project } = Astro.props; id={`project-${project.id}`} class="flex flex-row justify-center items-center" > -
+

{project.title}

@@ -24,16 +25,18 @@ const { project } = Astro.props;
-
- {project.title} +
+
+ {project.title} +
-
+
diff --git a/astro/src/pages/[...route].astro b/astro/src/pages/[...route].astro index 0bf6269..69cbb5e 100644 --- a/astro/src/pages/[...route].astro +++ b/astro/src/pages/[...route].astro @@ -25,7 +25,10 @@ export async function getStaticPaths() { } const settings = await getSettings(); -const page = await getPage(settings, Astro.url.pathname); +const pathName = Astro.url.pathname.replace(/\/$/, ""); +const page = await getPage(settings, pathName); + +console.log(pathName); if (page === null || page.page === null || !page.page.exists) { return new Response("Page not found.", { @@ -33,8 +36,6 @@ if (page === null || page.page === null || !page.page.exists) { statusText: "Not Found" }); } - -console.log(page); --- { page.page.type === "Webpage" && page.page.exists && ( diff --git a/astro/src/styles/global.css b/astro/src/styles/global.css index a461c50..3571db7 100644 --- a/astro/src/styles/global.css +++ b/astro/src/styles/global.css @@ -1 +1,2 @@ -@import "tailwindcss"; \ No newline at end of file +@import "tailwindcss"; +@plugin "@tailwindcss/typography"; diff --git a/astro/src/styles/markdownClasses.ts b/astro/src/styles/markdownClasses.ts new file mode 100644 index 0000000..abd2916 --- /dev/null +++ b/astro/src/styles/markdownClasses.ts @@ -0,0 +1,13 @@ +export function getTypographyClasses() { + return [ + "prose prose-neutral", + "prose-h1:mb-2", + "prose-h2:mb-1.5 prose-h2:mt-0.5", + "prose-p:mt-1.5 prose-p:mb-7", + "[&>p:has(+:is(h1,h2,h3,h4,h5,h6))]:mb-8", + "[&>p:has(+p)]:mb-4", + "[&>*:first-child]:mt-0", + "[&>*:last-child]:mb-0", + "[&>pre]:max-w-[100%]" + ].join(' ').trim(); +}