forked from
quillmatiq.com/augment
Fork of Chiri for Astro for my blog
1---
2import '@/styles/global.css'
3import type { PostLayoutProps } from '@/types'
4import FormattedDate from '@/components/widgets/FormattedDate.astro'
5import FootnoteScroll from '@/components/widgets/FootnoteScroll.astro'
6import BaseHead from '@/components/layout/BaseHead.astro'
7import Footer from '@/components/layout/Footer.astro'
8import BackButton from '@/components/ui/BackButton.astro'
9import TableOfContents from '@/components/ui/TableOfContents.astro'
10import GradientMask from '@/components/ui/GradientMask.astro'
11import ImageOptimizer from '@/components/ui/ImageOptimizer.astro'
12import ImageViewer from '@/components/ui/ImageViewer.astro'
13import GitHubCard from '@/components/ui/GitHubCard.astro'
14import LinkCard from '@/components/ui/LinkCard.astro'
15import NeoDBCard from '@/components/ui/NeoDBCard.astro'
16import XPOST from '@/components/ui/XPOST.astro'
17import CopyCode from '@/components/ui/CopyCode.astro'
18import BaseLayout from '@/layouts/BaseLayout.astro'
19
20import { themeConfig } from '@/config'
21
22const { title, pubDate, readingTime, toc, image} = Astro.props as PostLayoutProps
23
24const postSlug = Astro.url.pathname.split('/').filter(Boolean).pop() || ''
25const backupImage = `/open-graph/${postSlug}.png`
26---
27
28<BaseLayout title={`${title} · ${themeConfig.site.title}`} description={themeConfig.site.description} type="post">
29 <BaseHead
30 title={`${title} · ${themeConfig.site.title}`}
31 description={themeConfig.site.description}
32 ogImage={image ? image : backupImage}
33 slot="head"
34 />
35 <div class="post-container">
36 <main>
37 <div class="prose">
38 <GradientMask />
39 <BackButton />
40 {themeConfig.post.toc && <TableOfContents toc={toc} />}
41 <div class="title">
42 <h1>{title}</h1>
43 <div class="date">
44 <FormattedDate date={pubDate} context="post" />
45 {
46 themeConfig.post.readingTime && readingTime && (
47 <span class="reading-time">
48 <span class="separator">·</span>
49 {readingTime.text}
50 </span>
51 )
52 }
53 </div>
54 </div>
55 <article class="content">
56 <slot />
57 </article>
58
59 <h2>Comments</h2>
60 <sequoia-comments />
61 <script>import '@/components/widgets/sequoia-comments.js'</script>
62 </div>
63 </main>
64 <ImageOptimizer />
65 <FootnoteScroll />
66 <CopyCode />
67 <GitHubCard />
68 <XPOST />
69 <NeoDBCard />
70 {themeConfig.post.imageViewer && <ImageViewer />}
71 {themeConfig.post.linkCard && <LinkCard />}
72 {themeConfig.general.footer && <Footer />}
73 </div>
74</BaseLayout>
75
76<style>
77 .post-container {
78 display: flex;
79 flex-direction: column;
80 flex: 1;
81 }
82
83 .post-container main {
84 flex: 1;
85 }
86</style>