Move 'Show Info' button in info addon

Is your feature request related to a problem? Please describe.

When using @storybook/addon-info the ‘Show Info’ button at the top right of the component view area overlays the rendered component. This was a problem when we had a full-width component that had an icon on the right hand side that was being covered by the button.

Describe the solution you’d like

It would be nice to make use of Storybooks built-in top bar area. Take a look at the screenshot below 👇

Describe alternatives you’ve considered

There could potentially be a way to toggle this ‘Show Info’ button but I think the solution I’ve suggested above is the better fix.

Are you able to assist bring the feature to reality?

Yes

[techieshark]

@joeycozza I think I’ve seen the idea of changing addon-info in related manner mentioned in other issues (assuming I’m understanding the proposals correctly):

https://github.com/storybooks/storybook/issues/1147#issuecomment-475810179 https://github.com/storybooks/storybook/issues/6049#issuecomment-472175592

cc @shilman

[jamime]

PR for addon-docs https://github.com/storybookjs/storybook/issues/7101