chahine/agenthub
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(board): card overlap via grid-auto-rows max-content + review cards get ring design

Browse Source
This commit is contained in:
chahinebrini 2026-07-22 17:11:19 +02:00
parent 2a57588797
commit 5dd5806640
3 changed files with 14 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/server/board/columns.ts
View File

@ -240,8 +240,12 @@ export function columnsJs(opts: ColumnsJsOpts): string {
'</div>' +
'</div>'
: '';
var ring = live
? '<span class="b2-ring" data-ring data-claimed="' + esc(t.claimedAt || t.updatedAt || t.createdAt || '') + '">' +
// Progress ring on in-progress (work time) AND review cards (wait time) —
// same design, review variant in amber. Filled = elapsed vs median estimate.
var ringStatus = live ? 'work' : status === 'review' ? 'review' : '';
var ringSince = live ? (t.claimedAt || t.updatedAt || t.createdAt || '') : (t.updatedAt || t.createdAt || '');
var ring = ringStatus
? '<span class="b2-ring' + (ringStatus === 'review' ? ' b2-ring-review' : '') + '" data-ring data-claimed="' + esc(ringSince) + '">' +
'<svg width="20" height="20" viewBox="0 0 20 20" aria-hidden="true">' +
'<circle class="b2-ring-track" cx="10" cy="10" r="8" stroke-width="3"/>' +
'<circle class="b2-ring-fill" cx="10" cy="10" r="8" stroke-width="3" stroke-dasharray="50.3" stroke-dashoffset="50.3"/>' +

2
src/server/board/styles.ts
View File

@ -190,6 +190,7 @@ export function boardV2Css(): string {
.column[data-column="cancelled"] .col-dot { background: var(--cancelled); }
.cards {
display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
grid-auto-rows: max-content; /* auto-Tracks fielen auf min-height zurück → Overlap */
gap: 10px; min-width: 0; min-height: 0; overflow-y: auto;
overscroll-behavior: contain; padding: 2px 4px 2px 2px;
align-items: start; scrollbar-gutter: stable;
@ -249,6 +250,7 @@ export function boardV2Css(): string {
.b2-ring-fill { fill: none; stroke: var(--in_progress); stroke-linecap: round;
transition: stroke-dashoffset 900ms cubic-bezier(.2,.7,.2,1), stroke 300ms ease; }
.b2-ring.b2-over .b2-ring-fill { stroke: var(--b2-amber); }
.b2-ring.b2-ring-review .b2-ring-fill { stroke: var(--review); }
.b2-ring-time { font: 11px/1 var(--mono); color: var(--b2-muted); }
.b2-ring.b2-over .b2-ring-time { color: var(--b2-amber); }

6
tests/boardV2.test.ts
View File

@ -23,6 +23,12 @@ describe('renderBoardHtml (v2)', () => {
expect(html).toContain('b2-ring');
expect(html).toContain('b2-working');
});
it('gives review cards the same ring design (amber variant)', () => {
expect(html).toContain('b2-ring-review');
});
it('sizes card grid rows to content (overlap regression)', () => {
expect(html).toContain('grid-auto-rows: max-content');
});
it('does not ship the old v1 metric cards or lottie kpi icons', () => {
expect(html).not.toContain('metric-card');
expect(html).not.toContain('lottie');