From a0bb023f80cf7d23b3fb797db6e8f1e0a626b14e Mon Sep 17 00:00:00 2001
From: Lucio Lelii <lucio.lelii@isti.cnr.it>
Date: Thu, 29 Jan 2026 13:38:06 +0100
Subject: [PATCH] added

---
 .../nodes/input/input-node.component.html     | 19 +++++++++++--------
 src/app/shared/nodes/llm/llm.html             |  4 ++--
 .../nodes/output/output-node.component.html   | 18 ++++++++++++------
 3 files changed, 25 insertions(+), 16 deletions(-)

diff --git a/src/app/shared/nodes/input/input-node.component.html b/src/app/shared/nodes/input/input-node.component.html
index afff0bc..e1e8da3 100644
--- a/src/app/shared/nodes/input/input-node.component.html
+++ b/src/app/shared/nodes/input/input-node.component.html
@@ -1,17 +1,20 @@
-<div class="relative rounded-xl bg-white shadow-md border border-gray-200 overflow-visible">
+<div class="cursor-move user-select-none rounded-xl bg-emerald-100 shadow-lg border border-gray-200 overflow-visible">
   <!-- header/row relativa -->
   <div class="relative w-full p-3 flex items-center justify-between">
-    <p class="text-sm font-semibold text-gray-700">{{ data.label }}</p>
-
-     <div refComponent 
-     [data]="{
+    <div class="grid grid-cols-4 h-full">
+      <div class="col-span-3 align-middle h-full flex justify-center flex-col">
+        <p class="text-ls font-bold text-gray-700">{{ data.label }}</p>
+        <p class="text-xs text-gray-500">Text</p>
+      </div>
+      <div class="align-middle h-full flex flex-col justify-center items-end">
+        <div refComponent class="absolute right-1" [data]="{
         type: 'socket',
         side: 'output',
         key: outputKey,
         nodeId: data.id,
         payload: outputSocket
-      }"
-      [emit]="emit"
-    ></div>
+      }" [emit]="emit"></div>
+      </div>
+    </div>
   </div>
 </div>
\ No newline at end of file
diff --git a/src/app/shared/nodes/llm/llm.html b/src/app/shared/nodes/llm/llm.html
index 67c6148..b995ff0 100644
--- a/src/app/shared/nodes/llm/llm.html
+++ b/src/app/shared/nodes/llm/llm.html
@@ -1,7 +1,7 @@
-<div class="relative w-55 rounded-2xl bg-white border border-gray-200 shadow-lg overflow-visible font-sans">
+<div class="cursor-move relative user-select-none w-55 rounded-2xl bg-white border border-gray-200 shadow-lg overflow-visible font-sans">
   <!-- Header -->
   <div
-    class=" cursor-move flex items-center gap-2 px-3 py-2 bg-linear-to-br from-violet-600 to-indigo-500 text-white rounded-t-2xl">
+    class="flex items-center gap-2 px-3 py-2 bg-linear-to-br from-violet-600 to-indigo-500 text-white rounded-t-2xl">
     <div class="w-12 h-8 rounded-lg bg-white/20 flex items-center justify-center">
       <img src="llm_node.png" alt="LLM" class="w-12 h-8" />
     </div>
diff --git a/src/app/shared/nodes/output/output-node.component.html b/src/app/shared/nodes/output/output-node.component.html
index c61f33b..2bd740d 100644
--- a/src/app/shared/nodes/output/output-node.component.html
+++ b/src/app/shared/nodes/output/output-node.component.html
@@ -1,15 +1,21 @@
-<div class="relative rounded-xl bg-white shadow-md border border-gray-200 overflow-visible">
+<div class="cursor-move user-select-none rounded-xl bg-red-100 shadow-lg border border-gray-200 overflow-visible">
   <!-- header/row relativa -->
-  <div class="relative p-3 flex items-center justify-between overflow-visible">
-    <div refComponent [data]="{
+  <div class="relative w-full p-3 flex items-center justify-between">
+    <div class="grid grid-cols-4 h-full gap-1">
+      <div class="align-middle h-full flex flex-col justify-center items-start">
+         <div refComponent class="absolute left-1"   
+         [data]="{
           type: 'socket',
           side: 'input',
           key: inputKey,
           nodeId: data.id,
           payload: inputSocket
         }" [emit]="emit"></div>
-    <p class="text-sm font-semibold text-gray-700">{{ data.label }}</p>
-
-    
+      </div>
+      <div class="align-middle col-span-3 h-full flex justify-center items-start flex-col">
+        <p class="text-ls font-bold text-gray-700">{{ data.label }}</p>
+        <p class="text-xs text-gray-500">Text</p>
+      </div>  
+    </div>
   </div>
 </div>
\ No newline at end of file