In addition to the CSS, in the JavaScript, there is the “mode” property; it controls the level of nested tags to which the style is applied. When set to “all” (the default), it wraps every tag/block (called a “node” in tiptap). There are also modes “deepest” and “shallowest” which might be useful.
https://tiptap.dev/docs/editor/extensions/functionality/focus
When I put it in, my intention was to highlight the current node/paragraph as a visual cue. So that should be “deepest” rather than “all”? And I just copied the css from the example code which set it to purple
Finally, I think the css scope isn’t quite right…it shouldn’t wrap the editor itself 🙁
In addition to the CSS, in the JavaScript, there is the “mode” property; it controls the level of nested tags to which the style is applied. When set to “all” (the default), it wraps every tag/block (called a “node” in tiptap). There are also modes “deepest” and “shallowest” which might be useful.
https://tiptap.dev/docs/editor/extensions/functionality/focus
When I put it in, my intention was to highlight the current node/paragraph as a visual cue. So that should be “deepest” rather than “all”? And I just copied the css from the example code which set it to purple
Finally, I think the css scope isn’t quite right…it shouldn’t wrap the editor itself 🙁