Set position with string & default to bottom right

[janaagaard75]

• Enable setting the position of the panel with a the string topRight, bottomRight, bottomLeft or topLeft.
• Default to bottom right corner instead of top right.

The rationale for moving to bottom right by default is that most website place controls in the top right corner (log in information, burger menu, etc.), so having the development tools in the top right corner could easily interfere with the UI of the website. Moving the controls to the bottom right limits the sites where the controls will overlap something, and it will often be possible to move the dev tools out of the way by scrolling on the page.

[mweststrate]

I like this change, but I can imagine people are easily lost when the tools appear suddenly on a different place. Would it make sense to add preset positions so that it would be easier for people to change back to the original behavior? Like position="topRight" (or topLeft, bottomLeft, bottomRight) and make the default bottomRight?

[janaagaard75]

I don't think people would get lost, if the change is documented here on the site. I like being able to tweak the exact position of the tools with top/bottom/left/right values.

What about documenting the change, and the writing the values to set, if you prefer the old top right default?

[mweststrate]

Bottom right is fine by default I think, I was more that supporting position short cuts as well makes it easy for people to change it back to top right by just saying: position="topRight", that is a minimal change we can mention in the readme and it allows for easy toggling between positions

[janaagaard75]

Sure. I will update the pull request to include this, as well as note about it in the readme.

[mweststrate]

Awesome, thanks!

Op vr 24 aug. 2018 22:38 schreef Jan Aagaard notifications@github.com:

Sure. I will update the pull request to include this, as well as note about it in the readme.

— You are receiving this because you commented.

Reply to this email directly, view it on GitHub https://github.com/mobxjs/mobx-react-devtools/pull/100#issuecomment-415876053, or mute the thread https://github.com/notifications/unsubscribe-auth/ABvGhP9NfmoAkgtLNbwTksMcFoYA8HA_ks5uUGQ8gaJpZM4Vm-_2 .

[mweststrate]

@janaagaard75 any updates on this one?

[janaagaard75]

I have been spending my free time on other side projects, so not yet. Sorry. I will try to get this done within the next week so that you can get this pull request closed.

[janaagaard75]

I've updated the pull request including support for setting position to a string value. I found it a bit hard to document this nicely in the readme file.

The nice gif of the website shows the panel in top right corner. It might be worth adding a comment below the gif along the lines: The default position of the panel has been moved to the bottom right corner. If you prefer the top right corner, as it is shown in this gif, the set position to topRight.

[mweststrate]

Merging, thanks!

[mweststrate]

Released as 6.1.0. Sorry, somehow this was slipped of the to-be-released list before