Enhance code block styling with rehype-pretty-code integration and update package dependencies
Some checks failed
Build and Deploy Blog / build-and-deploy-local (push) Has been cancelled
Some checks failed
Build and Deploy Blog / build-and-deploy-local (push) Has been cancelled
This commit is contained in:
@@ -3,6 +3,7 @@ import { getPostData, getAllPostIds } from "@/lib/posts";
|
||||
import type { PostData } from "@/lib/posts";
|
||||
import Window from "../../../components/window";
|
||||
import { MDXRemote } from "next-mdx-remote/rsc";
|
||||
import rehypePrettyCode from "rehype-pretty-code";
|
||||
|
||||
interface PageProps {
|
||||
params: {
|
||||
@@ -45,7 +46,22 @@ export default async function Post({ params }: PageProps) {
|
||||
</span>
|
||||
</div>
|
||||
<div className="prose lg:prose-xl max-w-none">
|
||||
<MDXRemote source={postData.content} />
|
||||
<MDXRemote
|
||||
source={postData.content}
|
||||
options={{
|
||||
mdxOptions: {
|
||||
rehypePlugins: [
|
||||
[
|
||||
rehypePrettyCode,
|
||||
{
|
||||
theme: "github-dark-dimmed",
|
||||
keepBackground: false,
|
||||
},
|
||||
],
|
||||
],
|
||||
},
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</article>
|
||||
</Window>
|
||||
|
||||
Reference in New Issue
Block a user