Adds media queries for smaller screens

src/components/LoginPage/LoginPage.scss

@@ -165,6 +165,14 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 }
 
 
-@media (min-width: 700px) {
-
+@media (max-height: 800px) {
+  .container {
+    padding-top: 2vh;
+  }
+  .loginContainer {
+    margin-top: 16px;
+  }
+  .root .footerLogo {
+    bottom: 4px;
+  }
 }

src/components/MigrationDetail/MigrationDetail.js

@@ -161,12 +161,12 @@ class MigrationDetail extends Component {
                </div>*/}
             </div>
           </div>
-          <MigrationNetworks migration={item}/>
+          <MigrationNetworks migration={item} />
           <div className={s.container + " " + s.buttons}>
             { item.type == "replica" && <button
               onClick={(e) => this.createMigrationFromReplica(e, item)}
-              disabled={disabled} className={disabled ? "disabled": ""}>
-              Create Migration
+              disabled={disabled} className={disabled ? "disabled": ""} >
+              Migrate Replica
             </button>}
             <button className="wire" onClick={(e) => this.deleteMigration(e)}>Delete</button>
           </div>

src/components/MigrationWizard/MigrationWizard.scss

@@ -124,3 +124,19 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
     }
   }
 }
+
+@media (max-height: 800px) {
+  .root {
+    padding-top: 88px;
+    padding-bottom: 112px;
+    .stepTitle {
+      margin-bottom: 32px;
+    }
+  }
+  .wizardControls {
+    bottom: 16px;
+    .buttons {
+      margin-bottom: 32px;
+    }
+  }
+}

src/components/WizardMigrationType/WizardMigrationType.scss

@@ -122,6 +122,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 .container {
   margin: 0 auto;
   padding: 0px;
+  position: relative;
   max-width: $max-content-width;
   &:after {
     content: " ";