mirror of
https://github.com/Aider-AI/aider.git
synced 2025-06-01 18:25:00 +00:00
refactor: add card header with icon and title for better visual integration
This commit is contained in:
parent
0035f28035
commit
89f579c1ba
1 changed files with 40 additions and 15 deletions
|
@ -206,16 +206,29 @@
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.feature-card-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding-bottom: 12px;
|
||||||
|
border-bottom: 1px solid #eaeaea;
|
||||||
|
}
|
||||||
|
|
||||||
.feature-icon {
|
.feature-icon {
|
||||||
font-size: 2rem;
|
font-size: 1.8rem;
|
||||||
color: var(--primary);
|
color: var(--primary);
|
||||||
margin-bottom: 20px;
|
margin-right: 12px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.feature-title {
|
.feature-title {
|
||||||
font-size: 1.3rem;
|
font-size: 1.3rem;
|
||||||
margin-bottom: 15px;
|
|
||||||
color: var(--dark);
|
color: var(--dark);
|
||||||
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.models {
|
.models {
|
||||||
|
@ -510,33 +523,45 @@
|
||||||
<h2 class="section-title">Features</h2>
|
<h2 class="section-title">Features</h2>
|
||||||
<div class="feature-grid">
|
<div class="feature-grid">
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">🧠</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Works with all LLMs</h3>
|
<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>
|
<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>
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">🗺️</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Map Of Your Code</h3>
|
<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>
|
<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>
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">📝</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Multiple File Editing</h3>
|
<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>
|
<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>
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">🔀</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Seamless Git Integration</h3>
|
<div class="feature-icon">🔀</div>
|
||||||
|
<h3 class="feature-title">Seamless 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>
|
<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>
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">🖥️</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Use in Your Favorite IDE</h3>
|
<div class="feature-icon">🖥️</div>
|
||||||
|
<h3 class="feature-title">Use in Your Favorite 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>
|
<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>
|
||||||
<div class="feature-card">
|
<div class="feature-card">
|
||||||
<div class="feature-icon">🖼️</div>
|
<div class="feature-card-header">
|
||||||
<h3 class="feature-title">Image & URL Support</h3>
|
<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>
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue