Platform: Editor comment button is outside of the editor

[Sebastian-ubs]

With the comment button (that appears on double clicking a word) overflowing the editor by 17px, there is a need to provide for this space when embedding the editor anywhere.
While not using comments, it is unclear why this space is preserved - especially when this space has a (slightly) different background color.

Unfortunately this space is as well not usable for / not used by the toolbar

I understand the inspiration by google docs, but there is always a lot of space around it and it is not ment to be put into a lot of small editor windows (like for Platform).
So: How to solve this? Should the button position be configurable? Or there always should be space (in the same color) provided? And can the toolbar also use this space? Or ... ?

[irahopkinson]

@Sebastian-ubs yeah the editor is still pre-release so it doesn't claim to have many of these things sorted. I've added the commenting functionality from the Lexical Playground almost verbatim. The functionality is there to spark this kind of discussion both for UX and how it interacts with Platform.Bible including designing the comment data model. I'm still waiting to hear from UX about all the kinds of things you have raised above and more.

[Sebastian-ubs]

Thanks @irahopkinson, was there any specific request to UX about reviewing certain things of the editor? I have not heared about it.

[Sebastian-ubs]

btw: I was able to work around it using

.CommentPlugin_AddCommentBox {
  left: unset !important;
  right: 0 !important;
}

It seems strange that positioning something at the right border is done using the left property anyhow.

I am curious to hear what you think should be the next steps to discuss the comment data model and visual appearance.