From c033e9e4d785c419da52a14d20715805249d1522 Mon Sep 17 00:00:00 2001 From: Christian Byrne Date: Thu, 25 Sep 2025 19:08:22 -0700 Subject: [PATCH] Add theme-aware styling for Vue node tooltips (#5786) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Adds light theme colors from the [designs](https://www.figma.com/design/31uH3r4x3xbIctuRWYW6NM/V3---Nodes?node-id=6267-16837&m=dev). ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5786-Add-theme-aware-styling-for-Vue-node-tooltips-27a6d73d36508167979fe797efcbe3c0) by [Unito](https://www.unito.io) --- src/assets/css/style.css | 2 ++ src/renderer/extensions/vueNodes/composables/useNodeTooltips.ts | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/assets/css/style.css b/src/assets/css/style.css index 635beea43..d331541f7 100644 --- a/src/assets/css/style.css +++ b/src/assets/css/style.css @@ -89,6 +89,8 @@ --color-sand-200: #d6cfc2; --color-sand-300: #888682; + --color-pure-white: #ffffff; + --color-slate-100: #9c9eab; --color-slate-200: #9fa2bd; --color-slate-300: #5b5e7d; diff --git a/src/renderer/extensions/vueNodes/composables/useNodeTooltips.ts b/src/renderer/extensions/vueNodes/composables/useNodeTooltips.ts index 034047471..6fbfb9733 100644 --- a/src/renderer/extensions/vueNodes/composables/useNodeTooltips.ts +++ b/src/renderer/extensions/vueNodes/composables/useNodeTooltips.ts @@ -93,7 +93,7 @@ export function useNodeTooltips( pt: { text: { class: - 'bg-charcoal-800 border border-slate-300 rounded-md px-4 py-2 text-white text-sm font-normal leading-tight max-w-75 shadow-none' + 'bg-pure-white dark-theme:bg-charcoal-800 border dark-theme:border-slate-300 rounded-md px-4 py-2 text-charcoal-700 dark-theme:text-pure-white text-sm font-normal leading-tight max-w-75 shadow-none' }, arrow: { class: 'before:border-slate-300'