Create a fullscreen toggle element

[garrettmflynn]

fix #428

[CodyCBakerPhD]

This really looks amazing when the screen is maximized - dare I say even better than the main neurosift site?

Only minor thing here, screenshot below

Not clear that the fullscreen button is for the nested neurosift window; any way to pin it to the upper-right of the nested window?

[CodyCBakerPhD]

Similarly, for a single-session preview, it looks like this for me by default

'Inspector Report' gets clipped off even when in fullscreen, and the fullscreen button partially occludes the 'Inspector Report' title, even in fullscreen

[CodyCBakerPhD]

Other than that looks great!

[garrettmflynn]

Fixed the former—but for the latter, I'd assumed you wanted the Inspector Report to be included in the maximization. Hence why it's pinned to the limits of both rather than just Neurosift.

When there are actual warnings populating the list, there isn't any meaningful information occluded:

Furthermore, if the structure of Neurosift itself changes (e.g. no navigation bar), this will become an issue as well.

As a tentative fix, I've made the toggle semi-transparent, transitioning the opacity to 100% when the user hovers over it.

Does this work as a more general fix for the latter case?

[garrettmflynn]

I've also added a minWidth + emptyMessage content to the Inspector List in this case so that the header is never occluded.

[CodyCBakerPhD]

I'd assumed you wanted the Inspector Report to be included in the maximization. Hence why it's pinned to the limits of both rather than just Neurosift.

Absolutely, the full screen is especially better at reporting both

My minor annoyance was with the text clipping and button overlay not looking great, but

As a tentative fix, I've made the toggle semi-transparent, transitioning the opacity to 100% when the user hovers over it.
I've also added a minWidth + emptyMessage content to the Inspector List in this case so that the header is never occluded.

Both do a great job of alleviating that issue!