Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-01-26 19:09:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix Vue node number widget inc/dec buttons hover state style (#6121)

Browse Source 
## Summary

Fix hover state on Vue node number widget incremenet/decrement buttons.
The problem was in `useNumberWidgetButtonPt.ts`, the button hover styles
were using `var(--color-node-component-surface-hovered)` which
references a Tailwind theme color created by the `@theme` inline
directive. This theme color doesn't properly inherit the `.dark-theme`
class overrides, so it was showing the light mode color (white) even in
dark mode.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-6121-fix-Vue-node-number-widget-inc-dec-buttons-hover-state-style-2906d73d36508144b91aec3490e32d28)
by [Unito](https://www.unito.io)

---------

Co-authored-by: DrJKL <DrJKL0424@gmail.com>
This commit is contained in:
Christian Byrne
2025-10-21 16:58:04 -07:00
committed by GitHub
parent 45cefda6e1
commit 2346ba1af0
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/renderer/extensions/vueNodes/widgets/composables/useNumberWidgetButtonPt.ts
View File

@@ -1,7 +1,7 @@
const sharedButtonClasses = const sharedButtonClasses =
'!inline-flex !items-center !justify-center !border-0 !bg-transparent text-inherit transition-colors duration-150 ease-in-out ' + '!inline-flex !items-center !justify-center !border-0 bg-transparent text-inherit transition-colors duration-150 ease-in-out ' +
'hover:!bg-[var(--color-node-component-surface-hovered)] active:!bg-[var(--color-node-component-surface-selected)] ' + 'hover:bg-node-component-surface-hovered active:bg-node-component-surface-selected' +
'disabled:!bg-[var(--color-node-component-disabled)] disabled:!text-[var(--color-node-icon-disabled)] disabled:cursor-not-allowed' 'disabled:bg-node-component-disabled disabled:text-node-icon-disabled disabled:cursor-not-allowed'
export function useNumberWidgetButtonPt(options?: { export function useNumberWidgetButtonPt(options?: {
roundedLeft?: boolean roundedLeft?: boolean