Fix text box to be "full sized"

src/lib/components/tiptap/TipTap.svelte

@@ -16,6 +16,11 @@
       element,
       extensions: [StarterKit],
       content: initialContent,
+      editorProps: {
+        attributes: {
+          class: 'outline-none h-full'
+        }
+      },
       onUpdate: ({ editor }) => {
         content = editor.getHTML();
       }
@@ -55,7 +60,13 @@
     >1. List</button>
   </div>
 
-  <div bind:this={element} class="p-3 min-h-40 prose prose-sm max-w-none focus:outline-none"></div>
+<div
+  bind:this={element}
+  role="textbox"
+  tabindex="-1"
+  class="p-3 min-h-40 prose prose-sm max-w-none cursor-text [&_.tiptap]:outline-none [&_.tiptap]:h-full [&_.tiptap_p]:my-1 [&_.tiptap_p:first-child]:mt-0 [&_.tiptap_p:last-child]:mb-0"
+  onmousedown={() => editor?.commands.focus()}
+></div>
 </div>
 
 <input type="hidden" {name} value={content} />