Canvas: Consistent spacing on node details component
Change-Id: Ia008d918723bc77a97a1ce37cd02adcd2accc9fe
diff --git a/apps/canvas/front/src/components/node-app.tsx b/apps/canvas/front/src/components/node-app.tsx
index d2aa36e..b7aa7dc 100644
--- a/apps/canvas/front/src/components/node-app.tsx
+++ b/apps/canvas/front/src/components/node-app.tsx
@@ -18,13 +18,13 @@
import { DeepPartial, EventType, useForm, ControllerRenderProps, FieldPath } from "react-hook-form";
import { zodResolver } from "@hookform/resolvers/zod";
import { Form, FormControl, FormField, FormItem, FormMessage } from "./ui/form";
-import { Input } from "./ui/input";
import { Button } from "./ui/button";
import { Handle, Position, useNodes } from "@xyflow/react";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./ui/select";
import { PencilIcon, XIcon } from "lucide-react";
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "./ui/tooltip";
import { Textarea } from "./ui/textarea";
+import { Input } from "./ui/input";
export function NodeApp(node: ServiceNode) {
const { id, selected } = node;
@@ -411,7 +411,7 @@
return (
<>
<Form {...form}>
- <form>
+ <form className="space-y-2">
<FormField
control={form.control}
name="name"
@@ -420,7 +420,7 @@
<FormControl>
<Input
placeholder="name"
- className="border border-black"
+ className="lowercase"
{...field}
ref={focus(field, "name")}
/>
@@ -491,7 +491,7 @@
render={({ field }) => (
<FormItem>
<FormControl>
- <Input placeholder="master" className="border border-black" {...field} />
+ <Input placeholder="master" className="lowercase" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -503,7 +503,7 @@
render={({ field }) => (
<FormItem>
<FormControl>
- <Input placeholder="/" className="border border-black" {...field} />
+ <Input placeholder="/" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -534,7 +534,7 @@
render={({ field }) => (
<FormItem>
<FormControl>
- <Input placeholder="name" className="border border-black" {...field} />
+ <Input placeholder="name" className="lowercase" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -546,7 +546,7 @@
render={({ field }) => (
<FormItem>
<FormControl>
- <Input placeholder="value" className="border border-black" {...field} />
+ <Input placeholder="value" {...field} />
</FormControl>
<FormMessage />
</FormItem>
@@ -567,7 +567,7 @@
<li key={v.id}>
<Input
type="text"
- className="border border-black"
+ className="uppercase"
defaultValue={value}
onKeyUp={saveAliasOnEnter(v)}
onBlur={saveAliasOnBlur(v)}