Dokploy/website
1
0
Fork 0
mirror of https://github.com/Dokploy/website synced 2025-06-26 18:16:01 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat: improve blog post markdown table styling and responsiveness

Browse Source
This commit is contained in:
Mauricio Siu
2025-02-28 02:01:41 -06:00
parent 4bebc99992
commit 6135f2aecc
1 changed files with 20 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
apps/website/app/[locale]/blog/[slug]/page.tsx
View File

@@ -113,6 +113,26 @@ export default async function BlogPostPage({ params }: Props) {
{...props}
/>
),
table: ({ node, ...props }) => (
<div className="my-6 w-full overflow-x-auto border rounded-lg">
<table className="w-full border-collapse" {...props} />
</div>
),
thead: ({ node, ...props }) => (
<thead className="bg-muted border-b border-border" {...props} />
),
tbody: ({ node, ...props }) => (
<tbody className="divide-y divide-border" {...props} />
),
tr: ({ node, ...props }) => (
<tr className="transition-colors hover:bg-muted/50" {...props} />
),
th: ({ node, ...props }) => (
<th className="p-4 text-left font-semibold" {...props} />
),
td: ({ node, ...props }) => (
<td className="p-4 text-muted-foreground" {...props} />
),
img: ({ node, src, alt }) => (
<div className="relative w-full h-64 my-6 rounded-lg overflow-hidden">
{src && <ZoomableImage src={src} alt={alt || ""} />}