nextcloud
Buttons outside editor (smart picker, assistent, link settings) invisible in mobile and embedded editors
Describe the bug We have several UI elements positioned outside the editor: assistant button on the right, link settings three-dot-menu on the left and smart picker button also on the left.
All these buttons are invisible and thus inaccessible on mobile view as the editor takes full width there.
Same problem exists when the text editor gets embedded in a container that has 670px width or less - as is currently the case in Collectives. While we can fix this in Collectives by providing more horizontal space to the parent container, we will still run into this problem again when text gets embedded in other places that don't have so much space available.
@marcoambrosini do you have a good idea how to solve his design-wise?
Hi @mejo- I would put all this functionality in buttons at the bottom of the screen in a toolbar. Right above the mobile keyboard.
We discussed this issue during the contributors week. Here's the notes:
The basic issue is that we have, on the left, from left to right: a plus button, a drag handle, and a 3-dots-hamburger menu and the assistant button.
- The plus follows cursor on desktop? (Was on cursor at mobile because mobile has no hover)
- AI button prominence maybe not so important any more? Can the button be demoted to the topbar?
- On desktop, maybe one context menu? But it was removed historically for a11y reasons.
- Talked about whether the three-dots were actually necessary, possible strategies to remove it.
- Option: move options into the current bubble menu, or add an inline button after the link text.
- Question: should clicking on the text open the link it points to? Or the bubble (current behaviour)?
- Decent consensus: Easy first step to move the three-dots stuff into the bubble.
- Move assistant button into the toolbar (as high priority so it doesn't get hidden)
- Another low-hanging fruit: Max: move the + inline with text, somewhere between left-aligned and centre-aligned, only visible when the cursor is hovering an empty para. Marco disagrees.
- Low hanging fruit: make drag handle full height of node
- Julia: selection-based contextual tool tray thingy would be a good endgame
- Good consensus, but more longterm
- Drag handle should be closest to text. maybe make + behave the same for now