2.4.48

components/blocks/TeamGrid.tsx

@@ -49,25 +49,25 @@ export function TeamGrid({ members }: TeamGridProps) {
               className="group flex flex-col bg-white rounded-[2rem] border border-neutral-100 shadow-[0_8px_30px_rgb(0,0,0,0.04)] hover:shadow-[0_20px_40px_rgba(238,114,3,0.1)] transition-all duration-500 hover:-translate-y-2 overflow-hidden"
             >
               {/* Card Banner */}
-              <div className="h-32 bg-neutral-50 relative border-b border-neutral-100 overflow-hidden">
+              <div className="h-36 bg-neutral-50 relative border-b border-neutral-100 overflow-hidden">
                 <div className="absolute inset-0 bg-gradient-to-br from-neutral-100 to-neutral-200/50" />
                 <div className="absolute inset-0 opacity-[0.03] pointer-events-none" style={{ backgroundImage: "url('data:image/svg+xml,%3Csvg width=\\'20\\' height=\\'20\\' viewBox=\\'0 0 20 20\\' xmlns=\\'http://www.w3.org/2000/svg\\'%3E%3Crect width=\\'1\\' height=\\'1\\' fill=\\'%23000000\\'/%3E%3C/svg%3E')" }} />
               </div>
 
               <div className="px-8 pb-8 relative flex-grow flex flex-col">
                 {/* Overlapping Profile Picture */}
-                <div className="w-24 h-24 rounded-2xl overflow-hidden border-4 border-white shadow-xl bg-white relative -mt-12 mb-6 group-hover:-translate-y-2 transition-transform duration-500">
+                <div className="w-32 h-32 md:w-36 md:h-36 rounded-2xl overflow-hidden border-4 border-white shadow-xl bg-white relative -mt-16 md:-mt-20 mb-6 group-hover:-translate-y-2 transition-transform duration-500">
                   {member.image && (typeof member.image === 'string' ? member.image : member.image.url) ? (
                     <Image
                       src={typeof member.image === 'string' ? member.image : member.image.url}
                       alt={member.name}
                       fill
-                      sizes="96px"
+                      sizes="144px"
                       className="object-cover"
                     />
                   ) : (
                     <div className="absolute inset-0 flex items-center justify-center text-neutral-300 bg-neutral-50">
-                      <svg className="w-10 h-10" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
+                      <svg className="w-14 h-14" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="1"><path d="M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>
                     </div>
                   )}
                 </div>

package.json

@@ -140,7 +140,7 @@
     "prepare": "husky",
     "preinstall": "npx only-allow pnpm"
   },
-  "version": "2.4.47",
+  "version": "2.4.48",
   "pnpm": {
     "onlyBuiltDependencies": [
       "@parcel/watcher",

tests/team-images.test.ts

@@ -58,4 +58,11 @@ describe('Team Images and Team Page Content', () => {
     expect(deContent).toContain('/assets/photos/team/katrin-heigold.jpg');
     expect(enContent).toContain('/assets/photos/team/katrin-heigold.jpg');
   });
+
+  it('should verify TeamGrid component uses larger profile picture dimensions', () => {
+    const teamGridPath = path.join(process.cwd(), 'components', 'blocks', 'TeamGrid.tsx');
+    const teamGridContent = fs.readFileSync(teamGridPath, 'utf8');
+
+    expect(teamGridContent).toContain('w-32 h-32');
+  });
 });