From 915e87e88ed8eafcf2f3df753b28667166f64199 Mon Sep 17 00:00:00 2001
From: "Paul Gauthier (aider)" <paul@aider.chat>
Date: Wed, 19 Mar 2025 11:12:08 -0700
Subject: [PATCH] feat: Make feature cards fully clickable with external links

---
 aider/website/home.html | 50 ++++++++++++++++++-----------------------
 1 file changed, 22 insertions(+), 28 deletions(-)

diff --git a/aider/website/home.html b/aider/website/home.html
index 7446363ec..fff210c97 100644
--- a/aider/website/home.html
+++ b/aider/website/home.html
@@ -190,6 +190,10 @@
             box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
             transition: transform 0.3s, box-shadow 0.3s;
             border-left: 3px solid var(--primary);
+            display: block;
+            color: inherit;
+            text-decoration: none;
+            cursor: pointer;
         }
         
         .feature-card:hover {
@@ -197,16 +201,6 @@
             box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
         }
         
-        .feature-card a {
-            color: var(--primary);
-            text-decoration: none;
-            transition: color 0.3s;
-        }
-        
-        .feature-card a:hover {
-            text-decoration: underline;
-        }
-        
         .feature-card-header {
             display: flex;
             align-items: center;
@@ -525,48 +519,48 @@
         <div class="container">
             <h2 class="section-title">Features</h2>
             <div class="feature-grid">
-                <div class="feature-card">
+                <a href="https://aider.chat/docs/llms.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">🧠</div>
                         <h3 class="feature-title">Works with all LLMs</h3>
                     </div>
-                    <p>Aider works best with Claude 3.7 Sonnet, DeepSeek R1 & Chat V3, OpenAI o1, o3-mini & GPT-4o, but <a href="https://aider.chat/docs/llms.html">can connect to almost any LLM, including local models</a>.</p>
-                </div>
-                <div class="feature-card">
+                    <p>Aider works best with Claude 3.7 Sonnet, DeepSeek R1 & Chat V3, OpenAI o1, o3-mini & GPT-4o, but can connect to almost any LLM, including local models.</p>
+                </a>
+                <a href="https://aider.chat/docs/repomap.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">🗺️</div>
                         <h3 class="feature-title">Map Of Your Code</h3>
                     </div>
-                    <p><a href="https://aider.chat/docs/repomap.html">Uses a map of your entire git repo</a>, which helps it work well in larger codebases.</p>
-                </div>
-                <div class="feature-card">
+                    <p>Uses a map of your entire git repo, which helps it work well in larger codebases.</p>
+                </a>
+                <a href="https://aider.chat/docs/install.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">📝</div>
                         <h3 class="feature-title">Multiple File Editing</h3>
                     </div>
-                    <p><a href="https://aider.chat/docs/install.html">Edit multiple files at once for complex requests</a>, making large-scale changes easier.</p>
-                </div>
-                <div class="feature-card">
+                    <p>Edit multiple files at once for complex requests, making large-scale changes easier.</p>
+                </a>
+                <a href="https://aider.chat/docs/git.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">🔀</div>
                         <h3 class="feature-title">Git Integration</h3>
                     </div>
-                    <p><a href="https://aider.chat/docs/git.html">Aider automatically commits changes with sensible commit messages</a>, making version control seamless.</p>
-                </div>
-                <div class="feature-card">
+                    <p>Aider automatically commits changes with sensible commit messages, making version control seamless.</p>
+                </a>
+                <a href="https://aider.chat/docs/usage/watch.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">🖥️</div>
                         <h3 class="feature-title">Use in Your IDE</h3>
                     </div>
-                    <p><a href="https://aider.chat/docs/usage/watch.html">Use aider directly from your favorite IDE or text editor</a> by adding AI comments right in your code.</p>
-                </div>
-                <div class="feature-card">
+                    <p>Use aider directly from your favorite IDE or text editor by adding AI comments right in your code.</p>
+                </a>
+                <a href="https://aider.chat/docs/usage/images-urls.html" class="feature-card">
                     <div class="feature-card-header">
                         <div class="feature-icon">🖼️</div>
                         <h3 class="feature-title">Image & URL Support</h3>
                     </div>
-                    <p><a href="https://aider.chat/docs/usage/images-urls.html">Add images to the chat and share URLs</a>, helping with visual context and references.</p>
-                </div>
+                    <p>Add images to the chat and share URLs, helping with visual context and references.</p>
+                </a>
             </div>
         </div>
     </section>