Make sidebar slide in and slide out

[dojutsu-user]

Fixes #697

Final result:

[dojutsu-user]

I am still unsure about these lines

https://github.com/rtfd/sphinx_rtd_theme/blob/4a3d790e61d7524baac698badee814cd286b1219/sass/_theme_layout.sass#L372-L375

[Blendify]

Oops wrong PR

[Blendify]

I think this makes sense but one additional thing that should be added is swipe gesture support

Seems pretty simple, here is a jquery example: http://demos.jquerymobile.com/1.3.2/examples/panels/panel-swipe-open.html#&ui-state=dialog

[dojutsu-user]

@Blendify
I don't know why, but I didn't get it working with jquery.
But it is working fine with vanilla javascript.
Here is the final result

[dojutsu-user]

@jessetan
I think I have added all the improvements suggested by you.
Also, I have changed the javascript code to jquery, implementing the swiperight and swipeleft events, but for some reason it is still not working.

[jessetan]

Using swipelft and swiperight events do not work because they require jQuery mobile, we only include jQuery at this time.
Using vanilla JS (as you had before) is probably better than adding a whole new library. I suggest you do add some more logic to discern real horizontal swipes from "touches" that have a strong vertical component (e.g. a diagonal swipe)

[dojutsu-user]

@jessetan
Added the improvements.
I googled a little bit and found that maximum allowed time for the swiping so that the sidebar slides in can be added.
I have added it.
Need you review.

[jessetan]

If I run this in desktop Chrome devtools with device emulation, my vertical scrolling is broken when the menu is visible. Does it work for you (on a real device)?

[dojutsu-user]

@jessetan

my vertical scrolling is broken

Exactly what you mean by this?
I tested it on a real device and the only unexpected thing I noticed that if I'm on a middle of a page and swiped right (to open navbar), then it move me back to the starting of the page.

[jessetan]

Exactly what you mean by this?

I mean that I can swipe up and down to scroll the body content when the menu is collapsed, but when the menu is open I can not swipe up and down to scroll the body content nor the contents of the menu if it is longer than can fit on the screen.

[dojutsu-user]

@jessetan
When the menu is open, swiping up/down on the body is not there. But I can swipe up/down on the menu if it is longer than the screen size (tested on a real device).

[dojutsu-user]

@jessetan
Any update on this?

[jessetan]

Expanding the menu on the "Paragraph level markup" page in the the documentation (https://sphinx-rtd-theme.readthedocs.io/en/latest/demo/demo.html) makes the content part invisible. This works if I remove the position: fixed on .wy-nav-content-wrap.shift but there may be other side effects.

Is it possible to close the menu when the content part is clicked/tapped? That feels more logicol on mobile

With this PR I can't seem to do inertial scrolling (is that the name?) on mobile Chrome or Safari where you give it a fast flick and it keeps scrolling for a while