From bfc8c560b210a6268168a6414f8d2792e7856ab6 Mon Sep 17 00:00:00 2001
From: dtoro <d.toro.v@pm.me>
Date: Tue, 10 Mar 2026 22:49:07 +0100
Subject: [PATCH] fix: styles of border and copy

---
 frontend/src/components/base/BaseNode.tsx       | 4 ++--
 frontend/src/components/nodes/RenderingNode.tsx | 5 ++++-
 frontend/src/styles.css                         | 6 +++---
 3 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/frontend/src/components/base/BaseNode.tsx b/frontend/src/components/base/BaseNode.tsx
index 3041d46..d301f6e 100644
--- a/frontend/src/components/base/BaseNode.tsx
+++ b/frontend/src/components/base/BaseNode.tsx
@@ -49,9 +49,9 @@ export function BaseNode({
   return (
     <div
       className={cn(
-        "bg-card text-card-foreground relative rounded-md border",
+        "bg-card text-card-foreground relative rounded-md border transition-[border-color,box-shadow] duration-200",
         "hover:ring-1",
-        selected && "border-primary shadow-[0_0_0_2px_hsl(var(--primary)_/_0.4)]",
+        selected && "border-primary/70 shadow-[0_0_0_2px_hsl(var(--primary)_/_0.22)]",
         className,
       )}
       data-selected={selected}
diff --git a/frontend/src/components/nodes/RenderingNode.tsx b/frontend/src/components/nodes/RenderingNode.tsx
index 3b25b0a..5529907 100644
--- a/frontend/src/components/nodes/RenderingNode.tsx
+++ b/frontend/src/components/nodes/RenderingNode.tsx
@@ -32,6 +32,7 @@ import { Input } from '../ui/input'
 import { Button } from '../ui/button'
 import { ToggleGroup, ToggleGroupItem } from '../ui/toggle-group'
 import { useTheme } from '../../lib/themeContext'
+import { toast } from 'sonner'
 
 export type RenderingNodeData = {
     viewportWidth?: number
@@ -759,7 +760,9 @@ function RenderingNodeComponent({ id, data, width, height, selected }: Props) {
                                     className="absolute top-2 right-2 z-10 h-7 w-7 shrink-0 rounded-md shadow-sm"
                                     onClick={() => {
                                         const text = resolvedContent ?? ''
-                                        if (text) navigator.clipboard?.writeText(text).catch(() => {})
+                                        if (text) {
+                                            navigator.clipboard?.writeText(text).then(() => toast.success('Copied to clipboard')).catch(() => {})
+                                        }
                                     }}
                                     disabled={!resolvedContent}
                                     title="Copy raw output"
diff --git a/frontend/src/styles.css b/frontend/src/styles.css
index bdfb843..689d22c 100644
--- a/frontend/src/styles.css
+++ b/frontend/src/styles.css
@@ -32,12 +32,12 @@ body {
 }
 
 .react-flow__node:focus-visible>div:first-child {
-    border-color: hsl(var(--primary));
-    box-shadow: 0 0 0 2px hsl(var(--primary) / 0.4);
+    border-color: hsl(var(--primary) / 0.7);
+    box-shadow: 0 0 0 2px hsl(var(--primary) / 0.22);
 }
 
 .dark .react-flow__node:focus-visible>div:first-child {
-    box-shadow: 0 0 0 2px hsl(var(--primary) / 0.5);
+    box-shadow: 0 0 0 2px hsl(var(--primary) / 0.28);
 }
 
 .react-flow__node .react-flow__handle {