Make all Overview statistics cards clickable and functional

- Add click handlers to all 6 statistics cards
- Running → Shows running pipelines modal
- Success → Shows successful pipelines modal
- Failed → Shows failed pipelines modal
- Pending → Shows pending pipelines modal
- Total → Shows all pipelines modal
- Projects → Navigates to projects section
- Add hover scale animation for better UX
- All cards now fully interactive and functional

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <[email protected]>

Author: ismoilovdevml

src/components/Overview.tsx

@@ -187,49 +187,67 @@ export default function Overview() {
         </div>
       </div>
 
-      {/* Essential Statistics */}
+      {/* Essential Statistics - All Clickable */}
       <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-3">
-        <div onClick={() => setShowPipelineList({ title: 'Running Pipelines', status: 'running' })} className="cursor-pointer">
+        <div
+          onClick={() => setShowPipelineList({ title: 'Running Pipelines', status: 'running' })}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Running"
             value={stats?.running || 0}
             icon={Activity}
             color="blue"
           />
         </div>
-        <div onClick={() => setShowPipelineList({ title: 'Successful Pipelines', status: 'success' })} className="cursor-pointer">
+        <div
+          onClick={() => setShowPipelineList({ title: 'Successful Pipelines', status: 'success' })}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Success"
             value={stats?.success || 0}
             icon={CheckCircle}
             color="green"
           />
         </div>
-        <div onClick={() => setShowPipelineList({ title: 'Failed Pipelines', status: 'failed' })} className="cursor-pointer">
+        <div
+          onClick={() => setShowPipelineList({ title: 'Failed Pipelines', status: 'failed' })}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Failed"
             value={stats?.failed || 0}
             icon={XCircle}
             color="red"
           />
         </div>
-        <div onClick={() => setShowPipelineList({ title: 'Pending Pipelines', status: 'pending' })} className="cursor-pointer">
+        <div
+          onClick={() => setShowPipelineList({ title: 'Pending Pipelines', status: 'pending' })}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Pending"
             value={stats?.pending || 0}
             icon={Clock}
             color="yellow"
           />
         </div>
-        <div className="cursor-pointer">
+        <div
+          onClick={() => setShowPipelineList({ title: 'All Pipelines' })}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Total"
             value={stats?.total || 0}
             icon={GitBranch}
             color="purple"
           />
         </div>
-        <div className="cursor-pointer">
+        <div
+          onClick={() => window.location.href = '#projects'}
+          className="cursor-pointer transition-transform hover:scale-105"
+        >
           <StatsCard
             title="Projects"
             value={projects.length}