The nav-badge was appended as an in-flow flex child, breaking nav-item layout: on mobile (column flex) it appeared below the label, on desktop sidebar (row flex + justify-content:center) it was pushed far right via margin-left:auto. Fix positions it absolutely within the nav-item and uses DOM API instead of insertAdjacentHTML per project convention. Co-authored-by: Ulas Kalayci <ulas.kalayci@googlemail.com> Co-authored-by: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -828,7 +828,10 @@ function updateOverdueBadge() {
|
||||
document.querySelectorAll('[data-route="/tasks"] .nav-badge').forEach((el) => el.remove());
|
||||
if (overdue > 0) {
|
||||
document.querySelectorAll('[data-route="/tasks"]').forEach((el) => {
|
||||
el.insertAdjacentHTML('beforeend', `<span class="nav-badge">${overdue}</span>`);
|
||||
const badge = document.createElement('span');
|
||||
badge.className = 'nav-badge';
|
||||
badge.textContent = String(overdue);
|
||||
el.appendChild(badge);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user