0 reply
0 recast
0 reaction
5 replies
0 recast
3 reactions
1 reply
0 recast
0 reaction
2 replies
1 recast
1 reaction
Here’s the code I used to add the images. Since I’m adding 15 images one by one, I thought the high number of elements might be causing this issue. I attempted to combine the images into a single output but wasn’t successful.
What method should I use to combine images into a single output? I tried using the sharp library and Base64, but they didn't work (maybe I did something wrong).
I'll be deploying on vercel.
<div style={{
    display: 'flex',
    flexDirection: 'column',
    width: '40px',
    height: '600px',
    gap: '0px'
}}>
    {heroesData.map((hero, index) => (
        <img 
            key={index}
            src={hero.profileImage} 
            alt={`Profile ${index + 1}`}
            style={{
                width: '40px',
                height: '40px',
                borderRadius: '50%',
                objectFit: 'cover'
            }} 
        />
    ))}
</div> 0 reply
0 recast
0 reaction
0 reply
0 recast
0 reaction