Canvas: Improve spacing on details component
Change-Id: Id18e89c9413e5f6d988b68d1f6582cdbee980a9d
diff --git a/apps/canvas/front/src/components/details.tsx b/apps/canvas/front/src/components/details.tsx
index 2f65601..cb5aba5 100644
--- a/apps/canvas/front/src/components/details.tsx
+++ b/apps/canvas/front/src/components/details.tsx
@@ -50,15 +50,15 @@
>
{sorted.map((n, index) => (
<>
- {index > 0 && <Separator className="my-2" />}
- <AccordionItem key={n.id} value={n.id} className="px-3">
- <AccordionTrigger>
+ {index > 0 && <Separator />}
+ <AccordionItem key={n.id} value={n.id} className="px-1">
+ <AccordionTrigger className="!h-fit">
<div className="flex flex-row space-x-2 items-center">
<Icon type={n.type} />
<span>{nodeLabel(n)}</span>
</div>
</AccordionTrigger>
- <AccordionContent>
+ <AccordionContent className="pt-1">
<NodeDetails {...n} />
</AccordionContent>
</AccordionItem>
diff --git a/apps/canvas/front/src/components/node-app.tsx b/apps/canvas/front/src/components/node-app.tsx
index bf41a4b..f01bd98 100644
--- a/apps/canvas/front/src/components/node-app.tsx
+++ b/apps/canvas/front/src/components/node-app.tsx
@@ -734,7 +734,12 @@
data.ports &&
data.ports.map((p) => (
<li key={p.id} className="flex flex-row items-center gap-1">
- <Button size={"icon"} variant={"ghost"} onClick={() => removePort(p.id)}>
+ <Button
+ size={"icon"}
+ variant={"ghost"}
+ onClick={() => removePort(p.id)}
+ className="w-4 h-4"
+ >
<XIcon />
</Button>
<div>
@@ -799,7 +804,7 @@
<Tooltip>
<TooltipTrigger>
<div className="flex flex-row items-center gap-1">
- <Button size={"icon"} variant={"ghost"}>
+ <Button size={"icon"} variant={"ghost"} className="w-4 h-4">
<PencilIcon />
</Button>
<div>{value}</div>