Feat: #11

packages/frontend/src/components/Textarea.vue

@@ -3,6 +3,8 @@
     <label :for="id">{{ label }}</label>
 
     <textarea
+      @input="resize"
+      rows="1"
       autocomplete="off"
       v-model="model"
       v-bind="$attrs"
@@ -31,8 +33,6 @@
   background-color: var(--bg-sub-color);
   color: var(--text-color);
   font-size: 1rem;
-  resize: vertical;
-  field-sizing: content;
   border: 1px solid transparent;
   outline: none;
   padding: 0.6rem;
@@ -58,4 +58,9 @@ defineProps<{
 
 const model = defineModel<string>();
 const id = useId();
+
+const resize = (event: any) => {
+  event.target.style.height = "auto";
+  event.target.style.height = event.target.scrollHeight + 'px';
+}
 </script>