BI-2218 Optimize sandbox landing page for mobile device

[davedrp]

Description

BI-2218 Optimize sandbox landing page for mobile device

Please include a summary of the change that was made.
The LOG IN button will stay visible in the side bar, even when viewed by a phone in landscape.

Dependencies

bi-api: future/1.2

Testing

To test in you local environment set the environment variable VUE_APP_SANDBOX= public.
If testing in you browser, use the Developer Tools to view the page in responsive mode (width = 360px or less)
Go to Welcome Page.

EXPECTED RESULT
The LOG IN button should be visible and active.

Checklist:

• [x ] I have performed a self-review of my own code
• [ x] I have tested my code and ensured it meets the acceptance criteria of the story
• I have create/modified unit tests to cover this change
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to documentation
• I have run TAF: <link to TAF run>
• I have run SiteImprove on pages impacted by changes

[mlm483]

There are a few issues.

1. When VUE_APP_SANDBOX=public (public sandbox) a banner is shown on the first visit to the public sandbox, which is still present and covers the whole screen on mobile.
   
2. When VUE_APP_SANDBOX=true (private sandbox) or VUE_APP_SANDBOX=false (not a sandbox) the side nav is in the way and cannot be closed on mobile.

[davedrp]

There are a few issues.

1. When `VUE_APP_SANDBOX=public` (public sandbox) a banner is shown on the first visit to the public sandbox, which is still present and covers the whole screen on mobile.

Per Shawn; the banner can stay as is.

2. When `VUE_APP_SANDBOX=true` (private sandbox) or `VUE_APP_SANDBOX=false` (not a sandbox) the side nav is in the way and cannot be closed on mobile.

The side nav will default to hidden in these conditions

[mlm483]

Looks good.