Bookstack: Cannot scroll in WYSIWYG editor on iPad.

[brian-emery]

I recently installed BookStack and intended to do quite a bit of editing from my iPad Pro. I've found that I'm unable to scroll while using the WYSIWYG editor. I've tested this on Safari, Chrome, and Firefox with the same result. I've also tested on an Android phone, which seems to work fine. The Markdown editor scrolls without issue, but most of the people who will be contributing to the wiki will be much more comfortable in the WYSIWYG editor.

[ssddanbrown]

Hi @brian-emery,
Yeah, I'm aware of the not-so-great mobile editing experience right now. I'm looking to do a design update fairly soon as mobile/tablet compatibility will become a core consideration in this.

[ssddanbrown]

Design update done but unfortunately I think there's simply fundamental issues with scrolling areas like this on mobile safari (All iOS browsers use safari under-the-hood).
As discussed in #1439, We're going to need to look at changing the layout system to suit iOS.

[Zciwobukaj]

Nice news ! Truly this is the last issue remaining before Bookstack would be 100% functional for me 🙂

[ssddanbrown]

Well the fix for this was suspiciously simple. Seems to work though, Tested on iPad and iPhone. Will be in the next release.

[Zciwobukaj]

Hi, I take advantage to the 0.26.3 release to ask whether you know or not the moment when this feature will be released ?
Of course I can't urge you to move faster, this is open source software made on your free time. The thing is that today I really miss this feature to edit documents from my iphone / ipad. Would be really nice to see this dream become true, particularly if you find a solution on your side ^^

Thanks in advance, and congrats for the super job you do :)
Julien

[ssddanbrown]

@Zciwobukaj You can try adding this to the "Custom head content html" setting in the meantime until the next release:

<style>
.edit-area.flex > div > .mce-tinymce.mce-container.mce-panel > .mce-container-body > .mce-edit-area {
    -webkit-overflow-scrolling:touch;
    overflow:auto;
}
</style>

[Zciwobukaj]

This works ! Many thanks 🙂

@Zciwobukaj(https://github.com/Zciwobukaj) You can try adding this to the "Custom head content html" setting in the meantime until the next release:

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub(https://github.com/BookStackApp/BookStack/issues/1058?email_source=notifications&email_token=AISCVUE2ZGHLD6VMXJGCQZDQDWUX5A5CNFSM4F3CV3Q2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOD37KZ6I#issuecomment-520006905), or mute the thread(https://github.com/notifications/unsubscribe-auth/AISCVUHOH7MH2QAY7OX2BS3QDWUX5ANCNFSM4F3CV3QQ).