Improve the UX of the adder while selecting text on mobile

[LMS007]

This issue related to this bug hypothesis/product-backlog#878 & Related PR #2625

The problem is on mobile, when selecting text, the adder can actually interfere and get in the way of the process of selecting text by blocking the selection itself.

Ideas for a possible fix.

1. Make the adder ignore user events while the user is selecting text e.g. pointer-events: none

2. Widthold showing the adder entirely until we know the user has stopped selecting text.

3. Adjust the UX on smaller devices and show the adder on the bottom of the screen --that may still be a problem if the user wanted to select text near the bottom and it was in the way.

There may be other ideas we have not yet thought of. Solutions 1 and 2 assume that events fire that logically allow us to determine that state.

Update

4. The ESC key should close the adder (accessibility)

[robertknight]

Related Slack thread: https://hypothes-is.slack.com/archives/C1M8NH76X/p1602516333256900

[LMS007]

Additionally, in Android, the native "copy, share, select all, web search" bar renders directly above a selection and will cover the adder if the text selection is done from bottom to top. For this reason it may be best to stick the adder either on the very bottom or top of the page depending on where the selection is made. Additionally it appears difficult to pin down a condition when the user is ready to click the adder. no mouse up, touch end, or pointer events fire when lifting your finger after you start making a text selection.