Fix z-index for all auth wrappers (#12894)

* Add Cypress auth test to for small screen sizes

Note: it should fail on 640x360px.

* Fix z-index for all auth wrappers

Note: all tests in `signin.cy.specs.js` should pass at this point.

frontend/src/metabase/auth/containers/ForgotPasswordApp.jsx

@@ -29,7 +29,7 @@ export default class ForgotPasswordApp extends Component {
 
     return (
       <div className="full-height flex flex-column flex-full md-layout-centered">
-        <div className="Login-wrapper wrapper Grid Grid--full md-Grid--1of2">
+        <div className="Login-wrapper wrapper Grid Grid--full md-Grid--1of2 relative z2">
           <div className="Grid-cell flex layout-centered text-brand">
             <LogoIcon className="Logo my4 sm-my0" height={65} />
           </div>

frontend/src/metabase/auth/containers/PasswordResetApp.jsx

@@ -72,7 +72,7 @@ export default class PasswordResetApp extends Component {
         <div className="full-height">
           <div className="full-height flex flex-column flex-full md-layout-centered">
             <div className="wrapper">
-              <div className="Login-wrapper Grid  Grid--full md-Grid--1of2">
+              <div className="Login-wrapper Grid  Grid--full md-Grid--1of2 relative z2">
                 <div className="Grid-cell flex layout-centered text-brand">
                   <LogoIcon className="Logo my4 sm-my0" height={65} />
                 </div>
@@ -91,7 +91,7 @@ export default class PasswordResetApp extends Component {
     } else {
       return (
         <div className="full-height bg-white flex flex-column flex-full md-layout-centered">
-          <div className="Login-wrapper wrapper Grid  Grid--full md-Grid--1of2">
+          <div className="Login-wrapper wrapper Grid  Grid--full md-Grid--1of2 relative z2">
             <div className="Grid-cell flex layout-centered text-brand">
               <LogoIcon className="Logo my4 sm-my0" height={65} />
             </div>

frontend/test/metabase/scenarios/auth/signin.cy.spec.js

 import { restore, signIn, signOut, USERS } from "__support__/cypress";
 
+const sizes = [[1280, 800], [640, 360]];
+
 describe("scenarios > auth > signin", () => {
   before(restore);
   beforeEach(signOut);
@@ -53,4 +55,21 @@ describe("scenarios > auth > signin", () => {
     // order table should load after login
     cy.contains("37.65");
   });
+
+  sizes.forEach(size => {
+    it(`should redirect from /auth/forgot_password back to /auth/login (viewport: ${size})`, () => {
+      if (Cypress._.isArray(size)) {
+        cy.viewport(size[0], size[1]);
+      } else {
+        cy.viewport(size);
+      }
+
+      cy.visit("/");
+      cy.url().should("contain", "auth/login");
+      cy.findByText("I seem to have forgotten my password").click();
+      cy.url().should("contain", "auth/forgot_password");
+      cy.findByText("Back to login").click();
+      cy.url().should("contain", "auth/login");
+    });
+  });
 });