Added textAreaField block to the form library

Nothing special except that the elements in .field-h are now aligned
to the start instead of baseline. That way, textarea labels are aligned
to the textarea first line instead of its bottom.

assets/templates/_libs/forms.jet.html

@@ -92,6 +92,28 @@ SPDX-License-Identifier: AGPL-3.0-only
                      inputClass=inputClass) }}
 {{- end -}}
 
+{{- block textAreaField(
+  field, value=nil, type="text", name, label, class="", required=false, help,
+  controlAttrs=attrList(), inputAttrs=attrList(), inputClass="form-textarea w-full",
+  rows=3
+) -}}
+  {{ inputAttrs.Set("rows", rows) }}
+  {{- if value == nil -}}
+    {{ value = field.String() }}
+  {{- end -}}
+  {{- if required -}}
+    {{ inputAttrs.Set("required", true) }}
+  {{- end -}}
+  {{- yield ariaAttrs(attrs=inputAttrs, field=field, name=name, help=help) -}}
+
+  {{- yield formField(field=field, name=name, label=label, help=help, class=class,
+                      required=required, controlAttrs=controlAttrs) content -}}
+    <textarea id="{{ name }}" name="{{ name }}" class="{{ inputClass }}" {{ inputAttrs }}>
+    {{- value -}}
+    </textarea>
+    {{- yield content -}}
+  {{- end -}}
+{{- end -}}
 
 {{- block checkboxField(
   field, checked=nil, name, label, class="", help

assets/templates/cookbook/ui.jet.html

@@ -155,6 +155,13 @@ Removable message
   class="field-h",
 ) }}
 
+{{ yield textAreaField(
+  field=.Form.Get("text"),
+  name="textarea",
+  label="Textarea",
+  class="field-h",
+) }}
+
 {{ yield selectField(
   field=.Form.Get("select"),
   name="select",

web/ui/styles/forms.scss

@@ -156,7 +156,7 @@
 
   // Horizontal field
   .field-h {
-    @apply flex gap-2 items-baseline max-w-std;
+    @apply flex gap-2 items-start max-w-std;
 
     @screen max-sm {
       @apply block;
@@ -164,6 +164,7 @@
 
     & > label:first-child,
     & > .field-spacer:first-child {
+      padding-top: theme("spacing.2");
       flex-basis: theme("spacing.40");
       flex-shrink: 0;
 
@@ -171,6 +172,10 @@
         flex-basis: theme("spacing.60");
       }
     }
+
+    & > div > ul {
+      padding-top: theme("spacing.2");
+    }
   }
 
   .field-h--compact {