Queued count badge placement

[kaalibro]

Prerequisites

• I am running the latest version of ComfyUI
• I have searched existing issues to make sure this isn't a duplicate
• I have tested with all custom nodes disabled (see how)

What happened?

after update to 1.37.3, the "queue count number" display in unexpected position.

Originally posted by @WingeD123 in #7805 (comment)

Root Cause:
The parent <button> lacks the relative utility class. As a result, the absolutely positioned badge aligns with the viewport or the nearest positioned ancestor instead of the button itself.

Introduced by:
https://github.com/Comfy-Org/ComfyUI_frontend/pull/7598/files#diff-45dffe390927ed2d5ba2426a139c52adae28ce15f81821c88e7991944562074cL44

Steps to Reproduce

1. Queue multiple tasks.
2. The task counter badge appears in the upper-right corner of the browser window instead of on the job history button.

How is this affecting you?

Visual/UI issue only

ComfyUI Frontend Version

1.37.5

Browser

Chrome/Chromium

Console Errors

Logs

Additional Context

No response

┆Issue is synchronized with this Notion page by Unito

[coderabbitai]

🔗 Related PRs

#6893 - [feat] Improve queue job item UX based on design feedback [merged]
#7340 - Fix/run button floating calc [merged]
#7342 - Add queue overlay tests and stories [merged]
#7731 - [QPOv2] Add N active jobs and clear queue button [merged]
#7805 - feat: add Comfy.Queue.ToggleOverlay command for job history panel [merged]

---

Enable issue planning

_{To enable issue planning, add the following to your .coderabbit.yaml:}

issue_enrichment:
  planning:
    enabled: true

_{You can then request a plan by commenting @coderabbitai plan on any issue.}

🧪 Issue enrichment is currently in open beta.

You can configure auto-planning by selecting labels in the issue_enrichment configuration.

To disable automatic issue enrichment, add the following to your .coderabbit.yaml:

issue_enrichment:
  auto_enrich:
    enabled: false

💬 Have feedback or questions? Drop into our discord!

[dosubot]

Hi @kaalibro! I'm Dosu and I’m helping the ComfyUI_frontend team.

The queue count badge appears in the wrong place because the parent <Button> in src/components/TopMenuSection.vue is missing the relative class. This was introduced in PR #7598, which refactored the button but omitted the positioning context needed for the badge's absolute placement. To fix it, add the relative class to the parent <Button> where the badge is rendered—this will ensure the badge is positioned correctly relative to the button, not the viewport. You can see the relevant code and explanation here. No merged PRs after 1.37.5 address this, so a manual fix is needed for now.

To reply, just mention @dosu.

---

^{How did I do? Good | Irrelevant | Incorrect | Verbose | Hallucination | Report 🐛 | Other}