add more rando

src/app/portfolio/two/page.tsx

@@ -6,7 +6,7 @@ export default async function PortfolioTwoPage() {
 
   return (
     <main className="p-2 mx-auto max-w-screen-2xl">
-      <JustifiedGallery images={images} rowHeight={350} gap={8} />
+      <JustifiedGallery images={images} rowHeight={350} gap={12} />
     </main>
   );
 }

src/components/portfolio/JustifiedGallery.tsx

@@ -38,7 +38,11 @@ export function JustifiedGallery({ images, rowHeight = 200, gap = 4 }: Props) {
         <p className="text-muted-foreground text-center py-20">No images to display</p>
       )}
       {rows.map((row, i) => (
-        <div key={i} className="flex gap-[4px] mb-[4px]">
+        <div
+          key={i}
+          className="flex mb-4" // Vertical gap between rows
+          style={{ columnGap: `${gap}px` }} // Horizontal gap between images
+        >
           {row.map((img) => (
             <div key={img.id} style={{ width: img.width, height: img.height }}>
               <ImageCard