packages/starlight-ghostcms/index.ts

@@ -29,6 +29,10 @@ export default function starlightGhostCMS(userConfig?: StarlightGhostConfig): St
                             pattern: '/blog',
                             entrypoint: '@matthiesenxyz/starlight-ghostcms/routes/index.astro'
                         })
+                        injectRoute({
+                            pattern: '/blog/[slug]',
+                            entrypoint: '@matthiesenxyz/starlight-ghostcms/routes/[slug].astro'
+                        })
 
                         updateConfig({
                             vite: {

packages/starlight-ghostcms/package.json

@@ -46,6 +46,7 @@
     "./overrides/Sidebar.astro": "./src/overrides/Sidebar.astro",
     "./overrides/SiteTitle.astro": "./src/overrides/SiteTitle.astro",
     "./routes/index.astro": "./src/routes/index.astro",
+    "./routes/[slug].astro": "./src/routes/[slug].astro",
     "./schema": "./src/schemas/config.ts"
   },
   "scripts": {

packages/starlight-ghostcms/src/overrides/MarkdownContent.astro

@@ -5,26 +5,19 @@ import type { Props } from '@astrojs/starlight/props'
 import { isAnyBlogPostPage } from '../utils/page'
 import Metadata from '../components/Metadata.astro'
 import type { Post } from '../schemas/posts'
-import { getSluggedPost } from '../utils/api'
 
 const isBlogPost = isAnyBlogPostPage(Astro.props.slug)
 let blogEntry: Post | undefined = undefined
 
-if (isBlogPost) {
-  const post = await getSluggedPost(Astro.props.slug)
-  blogEntry = post.post
-}
 ---
 
 <StarlightMarkdownContent {...Astro.props}>
   {isBlogPost && blogEntry ? <Metadata entry={blogEntry} /> : null}
   <slot />
-  <div> {isBlogPost && blogEntry?.plaintext} </div>
 
   {
     isBlogPost && blogEntry ? (
       <div class="post-footer">
-        <!-- PREV - Next Links /-->
       </div>
     ) : null
   }

packages/starlight-ghostcms/src/overrides/Sidebar.astro

@@ -35,7 +35,7 @@ const blogSidebar: Props['sidebar'] = isBlog
           attrs: {},
           badge: undefined,
           href: `/blog/${blogEntry.slug}`,
-          isCurrent: isBlogPostPage(Astro.props.slug, blogEntry.slug),
+          isCurrent: isBlogPostPage(Astro.props.slug, `blog/${blogEntry.slug}`),
           label: blogEntry.title,
           type: 'link',
         })),

packages/starlight-ghostcms/src/routes/[slug].astro

@@ -0,0 +1,64 @@
+---
+//import type { InferGetStaticPropsType } from 'astro'
+import config from 'virtual:starlight-ghost-config'
+import { Image } from "astro:assets";
+import Page from '../components/Page.astro'
+import Posts from '../components/Posts.astro'
+//import PrevNextLinks from '../components/PrevNextLinks.astro'
+import { getPageProps } from '../utils/page'
+import { getAllPosts } from '../utils/api'
+import Metadata from '../components/Metadata.astro'
+
+
+export async function getStaticPaths() {
+  const entries = await getAllPosts();
+  return entries.map((post) => ({
+    params: { slug: post.slug },
+    props: { post, slug:post.slug },
+  }));
+}
+
+const { post } = Astro.props
+const pageProps = getPageProps(post.title)
+---
+
+<Page {...pageProps}>
+  {config.supportGhost && (
+    <div id="pghost">Powered by <a href="https://ghost.org">Ghost</a></div>
+  )}
+
+    <header>
+      <Metadata entry={post} />
+      {post.feature_image && (
+        <figure>
+          <Image 
+            src={post.feature_image} 
+            alt={post.feature_image_alt?post.feature_image_alt:""} 
+            title={post.feature_image_alt?post.feature_image_alt:""} 
+            width="1000px" 
+            height="800px"
+          />
+          <figcaption>
+            <Fragment set:html={post.feature_image_caption} />
+          </figcaption>
+        </figure>
+      )}
+    </header>
+    <br />
+    <Fragment set:html={post.html} />
+
+  <footer class="not-content">
+    <!--PrevNextLinks next={nextLink} prev={prevLink} /-->
+  </footer>
+</Page>
+
+<style>
+#pghost {
+    color: gray;
+    position: absolute;
+    top: 4rem;
+  }
+  #pghost a {
+    color: gray;
+  }
+</style>

packages/starlight-ghostcms/src/routes/index.astro

@@ -8,10 +8,8 @@ import Posts from '../components/Posts.astro'
 import { getPageProps } from '../utils/page'
 import { getAllPosts } from '../utils/api'
 
-export const prerender = true
 const entries = await getAllPosts();
 
-
 //const { entries, nextLink, prevLink } = Astro.props
 
 const pageProps = getPageProps(config.title)
@@ -28,22 +26,12 @@ const pageProps = getPageProps(config.title)
 </Page>
 
 <style>
-  :global(.content-panel:first-of-type) {
-    display: none;
-  }
-
-  :global(.content-panel:nth-of-type(2)) {
-    border-top: none;
-  }
-
   #pghost {
     color: gray;
-    margin-top: -1rem;
-    margin-bottom: -0.5rem;
+    position: absolute;
+    top: 4rem;
   }
   #pghost a {
     color: gray;
   }
-
-
 </style>