3 Commits

Author	SHA1	Message	Date
Alexander Brown	adfd2e514e	[Style] Compact Modern Nodes (#6687) ... ## Summary Simple and clean is the way that we're making the nodes tonight. ## Changes - **What**: Smaller minimum widths for nodes and labels - **What**: Smaller font for the labels - **What**: Removed outlines for widgets - **What**: Fixes a text/background issue with buttons on widgets - **What**: Smaller header - **What**: Less padding within the node itself ## Review Focus Check out the new styles and how they align with the Designs. ## Screenshots | Before | After | | --- | --- | | <img width="542" height="486" alt="image" src="https://github.com/user-attachments/assets/41fe9801-7a43-49ac-87fc-36d3b2ee82fb" /> | <img width="411" height="388" alt="image" src="https://github.com/user-attachments/assets/a7c21120-bf67-4039-86b3-c348bcc4341b" /> | <!-- Add screenshots or video recording to help explain your changes --> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6687-Style-Compact-Modern-Nodes-2aa6d73d365081c48db3c5491c556dc9) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <github-actions@github.com>	2025-11-13 16:32:38 -08:00
Christian Byrne	2346ba1af0	fix Vue node number widget inc/dec buttons hover state style (#6121) ... ## 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>	2025-10-21 23:58:04 +00:00
Christian Byrne	d54923f766	fix FLOAT widget incrementing broken & disabled state styles on widget number input (Vue) (#6036) ... ## Summary Align Vue node number widgets with Figma by centralising button styling and surfacing disabled-state tokens in the design system. ## Changes - **What**: Added shared [`useNumberWidgetButtonPt`](src/renderer/extensions/vueNodes/widgets/composables/useNumberWidgetButtonPt.ts) helper so both PrimeVue `InputNumber` widgets reuse the same Tailwind token classes, and added the `color/tokens/alpha` values in [`packages/design-system/src/css/style.css`](packages/design-system/src/css/style.css#L89-L212) so semantic aliases remain token-driven ([PrimeVue passthrough docs](https://www.primefaces.org/primevue/passthrough) w [`color-mix`](https://www.w3.org/TR/css-color-5/#color-mix)) ## Review Focus Confirm hover/active/disabled colours match the design tokens in both light and dark themes and that float precision still respects the safe-range guard. <img width="1377" height="1150" alt="Screenshot from 2025-10-12 17-53-23" src="https://github.com/user-attachments/assets/c7d34870-5d07-4ce1-9272-7def7ae813b6" /> <img width="1377" height="1150" alt="Screenshot from 2025-10-12 17-53-32" src="https://github.com/user-attachments/assets/86872ec8-979b-4586-879c-41a126a5f932" /> ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-6036-fix-disabled-state-styles-on-Vue-widget-number-input-INT-and-FLOAT-widgets-28b6d73d365081f8aef7fa860b641f7d) by [Unito](https://www.unito.io) --------- Co-authored-by: github-actions <github-actions@github.com>	2025-10-12 23:34:08 -07:00