ux: improve editor visibility and interaction feedback

- Add text cursor on editor container and EditorContent
- Add focus state rules for tiptap and ProseMirror
- Make it more obvious that the editor is an interactive text field

Author: jerelvelarde

apps/app/src/app/canvas/page.tsx

@@ -265,8 +265,12 @@ const DocumentEditor = () => {
           Write whatever you want here in Markdown format...
         </div>
       )}
-      <div className="flex-1 overflow-hidden flex flex-col">
-        <EditorContent editor={editor} className="h-full p-10 overflow-y-auto" />
+      <div className="flex-1 overflow-hidden flex flex-col" style={{ cursor: "text" }}>
+        <EditorContent
+          editor={editor}
+          className="h-full p-10 overflow-y-auto"
+          style={{ cursor: "text" }}
+        />
       </div>
     </div>
   );

apps/app/src/app/canvas/style.css

@@ -99,3 +99,26 @@
   padding: 2px;
   font-style: normal;
 }
+
+/* Editor focus and interaction states */
+.tiptap {
+  outline: none;
+  cursor: text;
+}
+
+.tiptap:focus,
+.tiptap:focus-visible {
+  outline: none;
+}
+
+/* Tiptap container styling */
+.ProseMirror {
+  outline: none;
+  cursor: text;
+  min-height: 100%;
+}
+
+.ProseMirror:focus,
+.ProseMirror:focus-visible {
+  outline: none;
+}