humhub / humhub-prosemirror

Other
17 stars 8 forks source link

Markdown toolbar hidden when selecting text on mobile #127

Open marc-farre opened 9 months ago

marc-farre commented 9 months ago

What steps will reproduce the problem?

  1. Open Humhub on a mobile device
  2. Write a new post (don't save)
  3. Select some text you've just written

What is the expected result?

It is possible to access the toolbar, e.g. to change your text to bold.

What do you get instead?

A mobile contextual menu is displayed on top of the toobar.

Humhub mobile app (Android): Screenshot_20231117_111411_com humhub app resized

Chrome (Android): Screenshot_20231117_111642_com brave browser resized

Additional info

Discussion: https://community.humhub.com/comment/perma?id=46837

Q A
HumHub version 1.15.0
ArchBlood commented 9 months ago

The issue is more of a probably with the UI, see https://github.com/humhub/polls/issues/73 for the quick solution to the problem.

felixhahnweilheim commented 9 months ago

On my phone I can move the toolbar somewhere else (just by holding it). But I guess most users don't know that.

marc-farre commented 9 months ago

On my phone I can move the toolbar somewhere else (just by holding it). But I guess most users don't know that.

Not on my Android 11 with Brave or the Humhub mobile app

felixhahnweilheim commented 9 months ago

Ok, I am on Android 13. (It works the same on any browser or app.) https://github.com/humhub/humhub/assets/84990763/b6c6febb-baeb-48f2-9816-3aec1304d21e

But I still would recommend to move the Prosemirror toolbar to somewhere else (in mobile view). Ideally directly over the keyboard if possible. (That's how other apps, e.g. GitHub Mobile or the Samsumg Notes App, do it. But I don't know if there is a good way for a web-based app). Screenshot_20231117_221813_Samsung Notes.jpg

Alternatively it could be directly under the text field maybe?

ArchBlood commented 9 months ago

Ok, I am on Android 13. (It works the same on any browser or app.) https://github.com/humhub/humhub/assets/84990763/b6c6febb-baeb-48f2-9816-3aec1304d21e

But I still would recommend to move the Prosemirror toolbar to somewhere else (in mobile view). Ideally directly over the keyboard if possible. (That's how other apps, e.g. GitHub Mobile or the Samsumg Notes App, do it. But I don't know if there is a good way for a web-based app). Screenshot_20231117_221813_Samsung Notes.jpg

Alternatively it could be directly under the text field maybe?

It should be in focus mode by default, so as soon as typing is done it should focus on the field, as for the highlighting and native popup function of the keyboard, that is a slightly harder issue to fix as it comes from the keyboard function, the only way of fixing this would be switching the richtext editor to LAYOUT_INLINE which is slightly bulky, moving the editor toolbar was mentioned before but I don't know why the discussion was stopped afterward.