mirror of
https://github.com/Aider-AI/aider.git
synced 2025-06-01 02:05:00 +00:00
feat: Draw tear across cost bar for exceeded costs on leaderboard
This commit is contained in:
parent
bec35e0538
commit
27b51d51d8
2 changed files with 21 additions and 5 deletions
|
@ -215,7 +215,12 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||||
|
|
||||||
// Mark bars that exceed the limit
|
// Mark bars that exceed the limit
|
||||||
if (cost > MAX_DISPLAY_COST) {
|
if (cost > MAX_DISPLAY_COST) {
|
||||||
bar.classList.add('cost-exceeded');
|
// Add a tear marker at around $45 (90% of the way)
|
||||||
|
const tearMarker = document.createElement('div');
|
||||||
|
tearMarker.className = 'cost-tear-marker';
|
||||||
|
tearMarker.style.left = '90%'; // Position at 90% (around $45)
|
||||||
|
bar.parentNode.appendChild(tearMarker);
|
||||||
|
|
||||||
// Add a marker at the end of the bar
|
// Add a marker at the end of the bar
|
||||||
const marker = document.createElement('div');
|
const marker = document.createElement('div');
|
||||||
marker.className = 'cost-exceeded-marker';
|
marker.className = 'cost-exceeded-marker';
|
||||||
|
|
|
@ -181,9 +181,20 @@ human intervention.
|
||||||
text-align: center;
|
text-align: center;
|
||||||
margin-left: -10px;
|
margin-left: -10px;
|
||||||
}
|
}
|
||||||
.cost-exceeded {
|
.cost-tear-marker {
|
||||||
background-color: rgba(220, 53, 69, 0.3) !important; /* Red background for exceeded cost */
|
position: absolute;
|
||||||
border-right: 1px solid rgba(220, 53, 69, 0.5) !important;
|
left: 90%; /* Position at 90% (around $45) */
|
||||||
|
top: 0;
|
||||||
|
height: 100%;
|
||||||
|
width: 2px;
|
||||||
|
background: repeating-linear-gradient(
|
||||||
|
to bottom,
|
||||||
|
transparent,
|
||||||
|
transparent 3px,
|
||||||
|
#888 3px,
|
||||||
|
#888 6px
|
||||||
|
);
|
||||||
|
z-index: 3;
|
||||||
}
|
}
|
||||||
.cost-exceeded-marker {
|
.cost-exceeded-marker {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -194,7 +205,7 @@ human intervention.
|
||||||
height: 0;
|
height: 0;
|
||||||
border-top: 6px solid transparent;
|
border-top: 6px solid transparent;
|
||||||
border-bottom: 6px solid transparent;
|
border-bottom: 6px solid transparent;
|
||||||
border-left: 6px solid rgba(220, 53, 69, 0.8);
|
border-left: 6px solid rgba(0, 0, 0, 0.5);
|
||||||
z-index: 3;
|
z-index: 3;
|
||||||
}
|
}
|
||||||
.bar-viz {
|
.bar-viz {
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue