Improving the editing experience of the rich text block

[AlessioGr]

This is how I style text if my rich text box is really big:
https://user-images.githubusercontent.com/70709113/169102920-dead434e-6554-4628-9093-d61850c371c0.mp4

To improve the editing experience, I suggest:

1. Make the entire toolbar stick to the top of the page if you are scrolling down (this is currently most important for me)
2. When selecting text, show common formatting options (like bold or italic text) right next to the mouse pointer (similar to https://editorjs.io/)
3. If the text is smaller than the height of the rich text box, there is a lot of white space. This white space is unneeded and annoying when you have a lot of blocks on top of each other. Example:
   https://user-images.githubusercontent.com/70709113/169103574-37f3d67c-1b5b-4e0f-afb9-8071cc50608d.mp4
   As you can see, 90% of the space goes unused in this specific example. The better option would be to make it fit to the content automatically without having a minimum height as large as it is currently.

[jmikrut]

Hey @AlessioGr — these are all great suggestions. We actually have some plans to improve the Admin UI, including improvements to the Rich Text field, and each one of your suggestions are already on our radar 😎

Some will come before others, but I'll report back here once we have an update for you!

[endlessuniverse]

Hello there! Take a look at TipTap editor as a Slate alternative and the following implementations:
https://tiptap.dev/guide/output
https://github.com/blocksley/blocksley
https://github.com/mfoitzik/quasar2-tiptap2
https://github.com/donotebase/quasar-tiptap
https://github.com/apostrophecms/apostrophe-tiptap-rich-text-widgets

[AlessioGr]

Hello there! Take a look at TipTap editor as a Slate alternative and the following implementations: https://tiptap.dev/guide/output https://github.com/blocksley/blocksley https://github.com/mfoitzik/quasar2-tiptap2 https://github.com/donotebase/quasar-tiptap https://github.com/apostrophecms/apostrophe-tiptap-rich-text-widgets

I'd definitely love TipTap as editor. For some inspiration, I already made one here with dope stuff like spell checking and AI predictions, but in svelte. I'd need to freshen up my react skills first to make a custom payload block for that, as it's a lot harder 😅