style: add base layout for workflow step fowm

src/components/item/WorkflowStepsFormSection/WorkflowStepsFormSection.tsx

 import React from 'react'
 import { WorkflowCore } from '@/api/sshoc'
+import { Button } from '@/elements/Button/Button'
+import { Icon } from '@/elements/Icon/Icon'
+import { Svg as CrossIcon } from '@/elements/icons/small/cross.svg'
+import { Svg as PlusIcon } from '@/elements/icons/small/plus.svg'
+import { Svg as TriangleIcon } from '@/elements/icons/small/triangle.svg'
 import { FormField } from '@/modules/form/FormField'
 import { FormFieldArray } from '@/modules/form/FormFieldArray'
 
@@ -12,21 +17,34 @@ export interface ItemFormValues extends WorkflowCore {
  */
 export function WorkflowStepsFormSection(): JSX.Element {
   return (
-    <section>
+    <section className="flex flex-col space-y-2">
+      <strong className="mb-6 text-error-500">
+        Editing and sorting workflow steps is not yet implemented.
+      </strong>
+
       <FormField name="label" subscription={{ value: true }}>
         {({ input }) => {
-          return <h2>{input.value}</h2>
+          return (
+            <div className="flex flex-col px-4 py-3 border border-gray-200 rounded bg-gray-75">
+              <h2 className="text-base font-bold text-gray-800 font-body">
+                {input.value}
+              </h2>
+              <div className="flex self-end space-x-8 text-primary-750">
+                <Button variant="link">
+                  <Icon icon={PlusIcon} className="w-2.5 h-2.5" />
+                  <span>Add a step</span>
+                </Button>
+                <Button variant="link">Edit</Button>
+              </div>
+            </div>
+          )
         }}
       </FormField>
 
-      <strong>
-        Editing and sorting workflow steps is not yet implemented.
-      </strong>
-
       <FormFieldArray name="composedOf">
         {({ fields }) => {
           return (
-            <div>
+            <div className="flex flex-col ml-8 space-y-2">
               {fields.map((name) => {
                 return (
                   <FormField
@@ -35,7 +53,38 @@ export function WorkflowStepsFormSection(): JSX.Element {
                     subscription={{ value: true }}
                   >
                     {({ input }) => {
-                      return <h3>{input.value}</h3>
+                      return (
+                        <div className="flex flex-col px-4 py-3 border border-gray-200 rounded bg-gray-75">
+                          <h3 className="text-base font-medium text-gray-800 font-body">
+                            {input.value}
+                          </h3>
+                          <div className="flex self-end space-x-8 text-primary-750">
+                            <Button variant="link">
+                              <Icon
+                                icon={TriangleIcon}
+                                className="w-2.5 h-2.5 transform rotate-180"
+                              />
+                              <span>Move up</span>
+                            </Button>
+                            <Button variant="link">
+                              <Icon
+                                icon={TriangleIcon}
+                                className="w-2.5 h-2.5"
+                              />
+                              <span>Move down</span>
+                            </Button>
+                            <Button variant="link">
+                              <Icon icon={PlusIcon} className="w-2.5 h-2.5" />
+                              <span>Add a substep</span>
+                            </Button>
+                            <Button variant="link">
+                              <Icon icon={CrossIcon} className="w-2.5 h-2.5" />
+                              <span>Delete</span>
+                            </Button>
+                            <Button variant="link">Edit</Button>
+                          </div>
+                        </div>
+                      )
                     }}
                   </FormField>
                 )