fix: image issues
This commit is contained in:
parent
261fa687ea
commit
8dbcb6494b
|
@ -87,17 +87,20 @@ export default function BlogPostModal({
|
||||||
{
|
{
|
||||||
code: CodeBlock,
|
code: CodeBlock,
|
||||||
img: ({ ...props }) => {
|
img: ({ ...props }) => {
|
||||||
const { width, height } = props.src.match(
|
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
|
||||||
/(?<width>\d+)x(?<height>\d+)/
|
if (r && r.groups) {
|
||||||
).groups;
|
|
||||||
return (
|
return (
|
||||||
<Image
|
<Image
|
||||||
src={props.src}
|
src={props.src}
|
||||||
alt={props.alt}
|
alt={props.alt}
|
||||||
width={width}
|
width={r?.groups.width}
|
||||||
height={height}
|
height={r?.groups.height}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
// fallback to normal img
|
||||||
|
return <img {...props} />;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
} as any
|
} as any
|
||||||
}
|
}
|
||||||
|
|
|
@ -87,17 +87,20 @@ export default function ProjectModal({
|
||||||
{
|
{
|
||||||
code: CodeBlock,
|
code: CodeBlock,
|
||||||
img: ({ ...props }) => {
|
img: ({ ...props }) => {
|
||||||
const { width, height } = props.src.match(
|
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
|
||||||
/(?<width>\d+)x(?<height>\d+)/
|
if (r && r.groups) {
|
||||||
).groups;
|
|
||||||
return (
|
return (
|
||||||
<Image
|
<Image
|
||||||
src={props.src}
|
src={props.src}
|
||||||
alt={props.alt}
|
alt={props.alt}
|
||||||
width={width}
|
width={r?.groups.width}
|
||||||
height={height}
|
height={r?.groups.height}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
// fallback to normal img
|
||||||
|
return <img {...props} />;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
} as any
|
} as any
|
||||||
}
|
}
|
||||||
|
|
|
@ -65,17 +65,20 @@ export default async function Page({
|
||||||
{
|
{
|
||||||
code: CodeBlock,
|
code: CodeBlock,
|
||||||
img: ({ ...props }) => {
|
img: ({ ...props }) => {
|
||||||
const { width, height } = props.src.match(
|
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
|
||||||
/(?<width>\d+)x(?<height>\d+)/
|
if (r && r.groups) {
|
||||||
).groups;
|
|
||||||
return (
|
return (
|
||||||
<Image
|
<Image
|
||||||
src={props.src}
|
src={props.src}
|
||||||
alt={props.alt}
|
alt={props.alt}
|
||||||
width={width}
|
width={r?.groups.width}
|
||||||
height={height}
|
height={r?.groups.height}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
// fallback to normal img
|
||||||
|
return <img {...props} />;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
} as any
|
} as any
|
||||||
}
|
}
|
||||||
|
|
|
@ -64,17 +64,20 @@ export default async function Page({
|
||||||
{
|
{
|
||||||
code: CodeBlock,
|
code: CodeBlock,
|
||||||
img: ({ ...props }) => {
|
img: ({ ...props }) => {
|
||||||
const { width, height } = props.src.match(
|
const r = props.src.match(/(?<width>\d+)x(?<height>\d+)/);
|
||||||
/(?<width>\d+)x(?<height>\d+)/
|
if (r && r.groups) {
|
||||||
).groups;
|
|
||||||
return (
|
return (
|
||||||
<Image
|
<Image
|
||||||
src={props.src}
|
src={props.src}
|
||||||
alt={props.alt}
|
alt={props.alt}
|
||||||
width={width}
|
width={r?.groups.width}
|
||||||
height={height}
|
height={r?.groups.height}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
} else {
|
||||||
|
// fallback to normal img
|
||||||
|
return <img {...props} />;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
} as any
|
} as any
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user