marsultor/public-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

mdx: square radii, quiet blockquotes

Browse Source
This commit is contained in:
kbot
2026-07-06 22:06:19 -05:00
parent 764600e6fe
commit ca4885301a
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
mdx-components.tsx
View File

@@ -37,11 +37,11 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
</p> </p>
), ),
blockquote: ({ children }) => ( blockquote: ({ children }) => (
<blockquote className="my-6 border-l-4 border-accent/40 bg-surface/60 py-1 pl-5 pr-4 italic text-ink-soft"> <blockquote className="my-6 border-l-4 border-accent/60 bg-surface/60 py-1 pl-5 pr-4 text-ink-soft">
{children} {children}
</blockquote> </blockquote>
), ),
hr: () => <hr className="my-8 border-border" />, hr: () => <hr className="my-12 border-border" />,
a: ({ href, children, ...props }) => { a: ({ href, children, ...props }) => {
const isExternal = typeof href === 'string' && (href.startsWith('http://') || href.startsWith('https://')) const isExternal = typeof href === 'string' && (href.startsWith('http://') || href.startsWith('https://'))
return ( return (
@@ -80,14 +80,14 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
<img <img
src={src} src={src}
alt={alt ?? ''} alt={alt ?? ''}
className="mx-auto my-8 h-auto max-h-[80vh] w-auto max-w-full rounded-2xl border border-border bg-surface object-contain shadow-card" className="mx-auto my-8 h-auto max-h-[80vh] w-auto max-w-full rounded-lg border border-border bg-surface object-contain shadow-card"
loading="lazy" loading="lazy"
decoding="async" decoding="async"
{...rest} {...rest}
/> />
), ),
table: ({ children }) => ( table: ({ children }) => (
<div className="my-8 overflow-x-auto rounded-xl border border-border bg-canvas"> <div className="my-8 overflow-x-auto rounded-lg border border-border bg-canvas">
<table className="w-full min-w-[40rem] border-collapse text-sm"> <table className="w-full min-w-[40rem] border-collapse text-sm">
{children} {children}
</table> </table>
@@ -113,7 +113,7 @@ export function useMDXComponents(components: MDXComponents): MDXComponents {
), ),
// Collapsible sections // Collapsible sections
details: (props) => <details className="my-6 rounded-xl border border-border bg-surface/70 p-4 shadow-card" {...props} />, details: (props) => <details className="my-6 rounded-lg border border-border bg-surface/70 p-4 shadow-card" {...props} />,
summary: (props) => <summary className="cursor-pointer font-semibold text-ink" {...props} />, summary: (props) => <summary className="cursor-pointer font-semibold text-ink" {...props} />,
} }
} }