fix: image issues

This commit is contained in:
Jack 2023-06-21 15:09:37 -07:00
parent 261fa687ea
commit 8dbcb6494b
No known key found for this signature in database
GPG Key ID: AFD9F14834097B8E
4 changed files with 56 additions and 44 deletions

View File

@ -87,17 +87,20 @@ export default function BlogPostModal({
{
code: CodeBlock,
img: ({ ...props }) => {
const { width, height } = props.src.match(
/(?<width>\d+)x(?<height>\d+)/
).groups;
return (
<Image
src={props.src}
alt={props.alt}
width={width}
height={height}
/>
);
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
if (r && r.groups) {
return (
<Image
src={props.src}
alt={props.alt}
width={r?.groups.width}
height={r?.groups.height}
/>
);
} else {
// fallback to normal img
return <img {...props} />;
}
},
} as any
}

View File

@ -87,17 +87,20 @@ export default function ProjectModal({
{
code: CodeBlock,
img: ({ ...props }) => {
const { width, height } = props.src.match(
/(?<width>\d+)x(?<height>\d+)/
).groups;
return (
<Image
src={props.src}
alt={props.alt}
width={width}
height={height}
/>
);
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
if (r && r.groups) {
return (
<Image
src={props.src}
alt={props.alt}
width={r?.groups.width}
height={r?.groups.height}
/>
);
} else {
// fallback to normal img
return <img {...props} />;
}
},
} as any
}

View File

@ -65,17 +65,20 @@ export default async function Page({
{
code: CodeBlock,
img: ({ ...props }) => {
const { width, height } = props.src.match(
/(?<width>\d+)x(?<height>\d+)/
).groups;
return (
<Image
src={props.src}
alt={props.alt}
width={width}
height={height}
/>
);
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
if (r && r.groups) {
return (
<Image
src={props.src}
alt={props.alt}
width={r?.groups.width}
height={r?.groups.height}
/>
);
} else {
// fallback to normal img
return <img {...props} />;
}
},
} as any
}

View File

@ -64,17 +64,20 @@ export default async function Page({
{
code: CodeBlock,
img: ({ ...props }) => {
const { width, height } = props.src.match(
/(?<width>\d+)x(?<height>\d+)/
).groups;
return (
<Image
src={props.src}
alt={props.alt}
width={width}
height={height}
/>
);
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
if (r && r.groups) {
return (
<Image
src={props.src}
alt={props.alt}
width={r?.groups.width}
height={r?.groups.height}
/>
);
} else {
// fallback to normal img
return <img {...props} />;
}
},
} as any
}