mirror of
https://github.com/Comfy-Org/ComfyUI_frontend.git
synced 2026-02-04 23:20:07 +00:00
fix style of Select COMBO Vue node widget (#5785)
## Summary Fixed `WidgetSelect` component styling to match other Vue node widgets by using shared base styles. ## Changes - **What**: Replaced hardcoded color classes with `WidgetInputBaseClass` for consistent styling across Vue node widgets ## Review Focus Visual consistency with other input widgets in Vue nodes interface and proper styling inheritance. ## Screenshots (if applicable) *Before*: <img width="1645" height="1436" alt="Screenshot from 2025-09-25 18-12-16" src="https://github.com/user-attachments/assets/0b985616-0cf5-44e3-8459-739d194dec7a" /> *After*: <img width="1645" height="1436" alt="Screenshot from 2025-09-25 18-12-07" src="https://github.com/user-attachments/assets/235437cf-3e1f-4bc0-8822-26fb8606b437" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5785-fix-style-of-Select-COMBO-Vue-node-widget-27a6d73d3650811a959ef8a955274987) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <github-actions@github.com>
This commit is contained in:
Binary file not shown.
|
Before Width: | Height: | Size: 54 KiB After Width: | Height: | Size: 54 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 107 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 106 KiB After Width: | Height: | Size: 107 KiB |
@@ -5,7 +5,7 @@
|
||||
:options="selectOptions"
|
||||
v-bind="combinedProps"
|
||||
:disabled="readonly"
|
||||
class="w-full text-xs bg-[#F9F8F4] dark-theme:bg-[#0E0E12] border-[#E1DED5] dark-theme:border-[#15161C] !rounded-lg"
|
||||
:class="cn(WidgetInputBaseClass, 'w-full text-xs')"
|
||||
size="small"
|
||||
:pt="{
|
||||
option: 'text-xs'
|
||||
@@ -22,11 +22,13 @@ import { computed } from 'vue'
|
||||
import { useWidgetValue } from '@/composables/graph/useWidgetValue'
|
||||
import { useTransformCompatOverlayProps } from '@/composables/useTransformCompatOverlayProps'
|
||||
import type { SimplifiedWidget } from '@/types/simplifiedWidget'
|
||||
import { cn } from '@/utils/tailwindUtil'
|
||||
import {
|
||||
PANEL_EXCLUDED_PROPS,
|
||||
filterWidgetProps
|
||||
} from '@/utils/widgetPropFilter'
|
||||
|
||||
import { WidgetInputBaseClass } from './layout'
|
||||
import WidgetLayoutField from './layout/WidgetLayoutField.vue'
|
||||
|
||||
const props = defineProps<{
|
||||
|
||||
Reference in New Issue
Block a user