auto-claude: subtask-2-1 - Remove base64 SVG placeholder constant
This commit is contained in:
@@ -328,17 +328,6 @@ function getImagePath(coverImage: string) {
|
|||||||
return coverImage.replace('/blog/', '/images/posts/');
|
return coverImage.replace('/blog/', '/images/posts/');
|
||||||
}
|
}
|
||||||
|
|
||||||
// Placeholder image for posts without cover images
|
|
||||||
const PLACEHOLDER_IMAGE = 'data:image/svg+xml,' + encodeURIComponent(`
|
|
||||||
<svg width="1792" height="1024" xmlns="http://www.w3.org/2000/svg">
|
|
||||||
<rect width="100%" height="100%" fill="#181C14"/>
|
|
||||||
<rect x="40%" y="35%" width="20%" height="30%" rx="8" fill="#697565" opacity="0.3"/>
|
|
||||||
<circle cx="50%" cy="45%" r="8%" fill="#697565" opacity="0.2"/>
|
|
||||||
<rect x="30%" y="65%" width="40%" height="4%" rx="2" fill="#465B50" opacity="0.3"/>
|
|
||||||
<rect x="35%" y="72%" width="30%" height="3%" rx="2" fill="#465B50" opacity="0.2"/>
|
|
||||||
</svg>
|
|
||||||
`);
|
|
||||||
|
|
||||||
// Known existing images (from public/images/posts/)
|
// Known existing images (from public/images/posts/)
|
||||||
const EXISTING_IMAGES = new Set([
|
const EXISTING_IMAGES = new Set([
|
||||||
'/images/posts/erp-integration-breuninger/cover.jpg',
|
'/images/posts/erp-integration-breuninger/cover.jpg',
|
||||||
@@ -347,18 +336,15 @@ const EXISTING_IMAGES = new Set([
|
|||||||
'/images/posts/automated-ad-creatives/cover.jpg',
|
'/images/posts/automated-ad-creatives/cover.jpg',
|
||||||
]);
|
]);
|
||||||
|
|
||||||
// Blog image component with fallback
|
// Blog image component
|
||||||
function BlogImage({ src, alt, fallback }: { src: string; alt: string; fallback: string }) {
|
function BlogImage({ src, alt }: { src: string; alt: string }) {
|
||||||
const imageSrc = EXISTING_IMAGES.has(src) ? src : fallback;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Image
|
<Image
|
||||||
src={imageSrc}
|
src={src}
|
||||||
alt={alt}
|
alt={alt}
|
||||||
fill
|
fill
|
||||||
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw"
|
sizes="(max-width: 640px) 100vw, (max-width: 1024px) 50vw, 33vw"
|
||||||
className="object-cover transition-transform duration-700 group-hover:scale-110"
|
className="object-cover transition-transform duration-700 group-hover:scale-110"
|
||||||
unoptimized={imageSrc.startsWith('data:')}
|
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -380,7 +366,6 @@ function BlogPostCard({ post, locale }: { post: BlogPost; locale: string }) {
|
|||||||
<BlogImage
|
<BlogImage
|
||||||
src={getImagePath(post.coverImage)}
|
src={getImagePath(post.coverImage)}
|
||||||
alt={post.title}
|
alt={post.title}
|
||||||
fallback={PLACEHOLDER_IMAGE}
|
|
||||||
/>
|
/>
|
||||||
<div className="absolute inset-x-0 -bottom-20 top-0 bg-gradient-to-t from-zinc-900 via-zinc-900/70 to-transparent opacity-95" />
|
<div className="absolute inset-x-0 -bottom-20 top-0 bg-gradient-to-t from-zinc-900 via-zinc-900/70 to-transparent opacity-95" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user