refine (responsive) navigation

[alee]

from @kintigh

The Navigation for anything narrower than 1450 or so pixels is really confusing. I had commented on this earlier but Ann’s testing really brought this out. Lots of people will be using this on laptops with relatively narrow screens including the MacBook Pro that Ann is using. With Ann’s help I have modified the documentation to describe how it works now, but I fear someone coming in fresh will not look at the documentation, and will try to figure it out and not get it and then just give up. Now the menu icon, when pressed, shows only the current page. One must press the V to show a dropdown to see any additional pages. It would be quite a bit clearer if all the pages were always shown once the menu button is pressed, with the unavailable ones greyed out as they are now on the dropdown (along with the Load Analysis, which is shown now). That would be an improvement, though I think the whole menu thing is seriously problematic because I don’t think it is at all obvious that one needs to press it I the first place if one starts with a small screen. As it is displayed, the hamburger could just be a graphic that highlights the SKOPE title.

[kintigh]

THis is the rest of the comment on the Navigation Bar. The Navigation bar options now stack 3 and 1 only between about 1435 and 1450 pixels but oddly never go to 2 an 2. Once you get under about 1435 pixels you are stuck with the menu problem. We don’t need the checkmarks or other icons before the labels in the nav bar if we underline the active option in orange (or just display the text it in orange). If we’d get rid that the icons and have them stack 2 and 2, we could go to a much narrower window an still have the nav bar work. We could even go to a smaller font size.

Better than stacking we could, all the time (not just on narrow screens) do one of these options:

SKOPE Select Select Visualize Analyze Load Synthesizing Knowledge of Past Environments Dataset Area Data Data Analysis

Or

SKOPE Synthesizing Knowledge Select Select Visualize Analyze Load of Past Environments Dataset Area Data Data Analysis

Even with SKOPE, the spelled out title (in a smaller font), the Page names in the current font size used with the current stacked version, and a Load Analysis button (which would be better smaller and maybe on 2 lines in any case) a it looks to me like this would fit on a screen of 800 pixels or even less and would be WAY better.