Add distinct animations and styling to media outlet cards

Introduce conditional styling and animations to media outlet cards based on article count and specific outlet slugs.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: f8b8f0ea-e52e-4118-9b6b-e44184e17203
Replit-Commit-Checkpoint-Type: full_checkpoint

client/src/components/MainContent.tsx

@@ -73,13 +73,20 @@ export default function MainContent() {
   const renderOutletCard = (outlet: MediaOutlet) => {
     const articleCount = articleCountByOutlet[outlet.id] || 0;
     const hasArticles = articleCount > 0;
+    const isErlingHaaland = outlet.slug === 'erling-haaland';
+    
+    const animationClass = isErlingHaaland && hasArticles 
+      ? 'animate-float-shake ring-2 ring-blue-400/30 shadow-lg'
+      : isErlingHaaland 
+        ? 'animate-shake'
+        : hasArticles 
+          ? 'animate-float ring-2 ring-blue-400/30 shadow-lg'
+          : '';
     
     return (
       <Card 
         key={outlet.id}
-        className={`hover:shadow-md transition-all cursor-pointer bg-white relative ${
+        className={`hover:shadow-md transition-all cursor-pointer bg-white relative ${animationClass}`}
-          hasArticles ? 'animate-float ring-2 ring-blue-400/30 shadow-lg' : ''
-        }`}
         data-testid={`card-outlet-${outlet.id}`}
       >
         {hasArticles && (