frontend code refactoring

web/src/components/Contact.js

@@ -1,6 +1,7 @@
 import React, { Component } from 'react';
 import {Button, TextField} from 'react-md';
-import '../css/Intent.css'
+import '../css/Common.css';
+import '../css/components/Contact.css';
 import {EMAIL_MAX_LENGTH} from '../config/constants';
 
 class Contact extends Component {
@@ -18,21 +19,20 @@ class Contact extends Component {
 
   render() {
     return (
-      <div className="LaunchRequestBox">
-        <h5 style={{textAlign:'left', marginTop: '30px', marginLeft: '20px'}}> Contact address will be used for direct messaging through Alexa </h5>
+      <div className="RightPanelBox">
+        <h5 className="PanelSubTitle"> Contact address will be used for direct messaging through Alexa </h5>
         <TextField
           id="contact email"
           lineDirection="center"
           label="Contact email"
-          className="md-cell md-cell--bottom"
-          style={{width:'60%', marginLeft: '20px'}}
+          className="md-cell md-cell--bottom ContactEmailInput"
           maxLength={EMAIL_MAX_LENGTH}
           onChange={this.handleEmailEdit}
           value={this.state.contactEmail}/>
         <br></br>
         <br></br>
         <br></br>
-        <Button style={{float:'right', marginRight: '20px'}} flat primary swapTheming 
+        <Button className="SaveButton" flat primary swapTheming 
                 onClick={()=>{this.props.onSaveEmailClick(this.state.contactEmail)}}
                 disabled={this.props.waiting}>Save</Button>
       </div>