Add images; update urls

This commit is contained in:
Jennie Robinson Faber 2025-11-15 19:33:36 +00:00
parent ef432e3f74
commit fe3d170dbe
37 changed files with 488 additions and 109 deletions

View file

@ -83,9 +83,10 @@
</div>
<!-- Article Body -->
<div class="prose prose-lg dark:prose-invert max-w-none">
<ContentRenderer :value="article" />
</div>
<ContentRenderer
:value="article"
class="prose prose-lg prose-gray dark:prose-invert max-w-none"
/>
<!-- Tags -->
<div
@ -122,25 +123,13 @@
const route = useRoute();
const slug = route.params.slug;
const getArticleSlug = (article) => {
if (!article) return "";
const candidate =
article.slug ||
article.stem ||
article._path ||
article._id ||
article.id ||
"";
const segments = candidate.split("/").filter(Boolean);
return segments[segments.length - 1] || "";
};
// Fetch article from Nuxt Content
const { data: article, pending } = await useAsyncData(
`article-${slug}`,
async () => {
// Query for the specific article by stem (filename without extension)
const articles = await queryCollection("articles").all();
return articles.find((a) => getArticleSlug(a) === slug);
return articles.find((a) => a.stem === slug);
},
);

View file

@ -43,7 +43,9 @@
{{ article.title }}
</NuxtLink>
<p class="text-gray-600 dark:text-gray-400 mt-2">
<p
class="text-gray-600 dark:text-gray-400 mt-2 font-serif text-lg leading-relaxed"
>
{{ article.description }}
</p>
@ -117,20 +119,14 @@ const getArticleTitle = (article) => {
// Resolve the correct Nuxt route for an article entry
const getArticleSlug = (article) => {
if (!article) return "";
const candidate =
article.slug ||
article.stem ||
article._path ||
article._id ||
article.id ||
"";
const segments = candidate.split("/").filter(Boolean);
return segments[segments.length - 1] || "";
// stem is the filename without extension
return article.stem || "";
};
const getArticlePath = (article) => {
if (!article) return "/articles";
const slug = getArticleSlug(article);
return slug ? `/articles/${slug}` : "/articles";
return `/articles/${slug}`;
};
// Filter and search articles

View file

@ -1,18 +1,13 @@
<template>
<div>
<h1 class="text-4xl font-bold text-gray-900 dark:text-white mb-4">
Ghost Guild Knowledge Commons
</h1>
<p class="text-xl text-gray-600 dark:text-gray-400 mb-8">
Collaborative knowledge base for the Baby Ghosts community
A wiki for ghosts! 👻
</p>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6">
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow">
<h2 class="text-xl font-semibold mb-2">📚 Browse Articles</h2>
<p class="text-gray-600 dark:text-gray-400 mb-4">
Explore our growing collection of guides and resources
</p>
<h2 class="text-xl font-semibold mb-2">View all articles</h2>
<p class="text-gray-600 dark:text-gray-400 mb-4"></p>
<NuxtLink to="/articles" class="text-blue-600 hover:text-blue-800">
View All Articles
</NuxtLink>
@ -32,10 +27,8 @@
</div>
<div class="bg-white dark:bg-gray-800 p-6 rounded-lg shadow">
<h2 class="text-xl font-semibold mb-2">👥 Community</h2>
<p class="text-gray-600 dark:text-gray-400 mb-4">
Connect with other Baby Ghosts members
</p>
<h2 class="text-xl font-semibold mb-2">Ghost Guild</h2>
<p class="text-gray-600 dark:text-gray-400 mb-4"></p>
<a
href="https://ghostguild.org"
class="text-blue-600 hover:text-blue-800"
@ -56,11 +49,11 @@
<div v-else-if="articles?.length" class="space-y-4">
<article
v-for="article in articles"
:key="article.slug"
:key="article.stem"
class="bg-white dark:bg-gray-800 p-4 rounded-lg shadow"
>
<NuxtLink
:to="`/articles/${article.slug}`"
:to="`/articles/${article.stem}`"
class="text-xl font-semibold text-blue-600 hover:text-blue-800"
>
{{ article.title }}