mobile menu

src/pages/Login.js

@@ -136,6 +136,7 @@ const Login = inject("rootStore") ( observer(
       return {
         container: {
           padding: '0%',
+          paddingTop: '15%',
           '@media (min-width: 500px)': {
             padding: '20%',
             paddingTop: '10%',

src/pages/Main.js

@@ -1,6 +1,7 @@
 import React, {Component} from 'react';
 import jss from 'jss';
 import preset from 'jss-preset-default';
+import { Segment, Container } from 'semantic-ui-react'
 
 /*
 * Functions import
@@ -55,7 +56,15 @@ class Main extends Component {
   render() {
     return(
       <div>
-        <Menu />
+        <Menu>
+          <div style={{minHeight: '100vh'}}>
+            <Container className={this.classes.mainContainer}>
+              <Segment>
+                awdawd
+              </Segment>
+            </Container>
+          </div>
+        </Menu>
       </div>
     );
   }
@@ -63,7 +72,9 @@ class Main extends Component {
 
   getStyles() {
     return {
-      
+      mainContainer: {
+        paddingTop: '80px'
+      }
     }
   }
 }

src/pages/VerifyEmail.js

@@ -65,7 +65,7 @@ class VerifyEmail extends Component {
           <Segment padded="very">
           <Message warning>
             <Message.Header>Pease verify your email adress</Message.Header>
-            <p>Please check your emails and follow the instructions. Check your spam foulder if you didn't get it.</p>
+            <p>Please check your emails and follow the instructions. Check your spam folder if you didn't get it.</p>
             <p>Reload this page after:</p>
             <Button primary onClick={this.reload}>Reload</Button>
           </Message>
@@ -80,6 +80,7 @@ class VerifyEmail extends Component {
     return {
       container: {
         padding: '0%',
+        paddingTop: '15%',
         '@media (min-width: 500px)': {
           padding: '20%',
           paddingTop: '10%',