dearwolf/aider
1
0
Fork 0
mirror of https://github.com/Aider-AI/aider.git synced 2025-06-01 10:14:59 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 3

style: restyle stats section to use GitHub badges format

Browse source
This commit is contained in:
Paul Gauthier (aider) 2025-03-19 10:23:55 -07:00
parent a98ca30438
commit 8d663cc3d6
1 changed files with 59 additions and 55 deletions
Download patch file Download diff file Expand all files Collapse all files

114
aider/website/home.html
View file

@ -311,62 +311,67 @@
.stats-container { .stats-container {
margin-bottom: 40px; margin-bottom: 40px;
background: linear-gradient(135deg, rgba(76, 110, 245, 0.1) 0%, rgba(76, 110, 245, 0.2) 100%); display: flex;
padding: 30px; justify-content: center;
border-radius: 16px; align-items: center;
box-shadow: 0 10px 30px rgba(76, 110, 245, 0.1); gap: 12px;
flex-wrap: wrap;
max-width: 800px; max-width: 800px;
margin-left: auto; margin-left: auto;
margin-right: auto; margin-right: auto;
} }
.stats-heading { .github-badge {
margin-bottom: 20px; display: inline-flex;
color: var(--primary); height: 28px;
font-size: 1.6rem; border-radius: 4px;
text-align: center; overflow: hidden;
font-weight: 700; font-size: 0.85rem;
font-weight: 600;
line-height: 1;
text-decoration: none;
transition: transform 0.2s;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12);
} }
.stats-grid { .github-badge:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.badge-label {
display: flex; display: flex;
justify-content: center; align-items: center;
gap: 30px; padding: 0 10px;
flex-wrap: wrap; background-color: #555;
color: white;
height: 100%;
} }
.stat-card { .badge-value {
background: white; display: flex;
border-radius: 12px; align-items: center;
padding: 20px; padding: 0 10px;
min-width: 160px; background-color: var(--primary);
text-align: center; color: white;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05); height: 100%;
transition: transform 0.3s, box-shadow 0.3s;
border: 1px solid rgba(76, 110, 245, 0.1);
} }
.stat-card:hover { .badge-stars .badge-value {
transform: translateY(-5px); background-color: #f1c40f;
box-shadow: 0 8px 25px rgba(76, 110, 245, 0.15); color: #333;
} }
.stat-icon { .badge-installs .badge-value {
font-size: 2rem; background-color: #2ecc71;
margin-bottom: 10px;
} }
.stat-number { .badge-router .badge-value {
font-size: 2.2rem; background-color: #9b59b6;
font-weight: 800;
color: var(--primary);
margin-bottom: 5px;
line-height: 1.1;
} }
.stat-label { .badge-tokens .badge-value {
color: #495057; background-color: #e74c3c;
font-weight: 500;
} }
@media (max-width: 768px) { @media (max-width: 768px) {
@ -415,23 +420,22 @@
<p>Aider lets you pair program with LLMs, to edit code in your local git repository. Start a new project or work with an existing code base.</p> <p>Aider lets you pair program with LLMs, to edit code in your local git repository. Start a new project or work with an existing code base.</p>
<div class="stats-container"> <div class="stats-container">
<div class="stats-grid"> <a href="https://github.com/Aider-AI/aider" class="github-badge badge-stars">
<div class="stat-card"> <span class="badge-label">⭐ GitHub Stars</span>
<div class="stat-icon">🚀</div> <span class="badge-value">29k</span>
<div class="stat-number">1.6M</div> </a>
<div class="stat-label">Installs</div> <a href="https://pypi.org/project/aider-chat/" class="github-badge badge-installs">
</div> <span class="badge-label">📦 Installs</span>
<div class="stat-card"> <span class="badge-value">1.6M</span>
<div class="stat-icon">🏆</div> </a>
<div class="stat-number">Top 20</div> <a href="#" class="github-badge badge-tokens">
<div class="stat-label">OpenRouter</div> <span class="badge-label">📈 Weekly Tokens</span>
</div> <span class="badge-value">15B</span>
<div class="stat-card"> </a>
<div class="stat-icon">📈</div> <a href="https://openrouter.ai/" class="github-badge badge-router">
<div class="stat-number">15B</div> <span class="badge-label">🏆 OpenRouter</span>
<div class="stat-label">Tokens/week</div> <span class="badge-value">Top 20</span>
</div> </a>
</div>
</div> </div>
<div class="buttons"> <div class="buttons">