minor css fixes

package.json

@@ -18,11 +18,14 @@
     "copyfiles": "^1.2.0",
     "gsap": "^1.19.1",
     "normalize-css": "^2.3.1",
+    "preact": "^7.2.0",
+    "preact-compat": "^3.14.0",
     "react": "^15.4.2",
     "react-bootstrap": "^0.30.8",
     "react-dom": "^15.4.2",
     "react-router-dom": "next",
     "rimraf": "^2.6.1",
+    "sendgrid": "^4.7.1",
     "superb": "^1.3.0"
   },
   "devDependencies": {

src/containers/About/about.css

@@ -8,7 +8,7 @@
 .background {
     background: linear-gradient(40deg,#1F1C2C,transparent 100%),
                 linear-gradient(230deg, #928DAB, transparent),
-                #ffa949 url('../../../static/img/bgabout.jpg') center;
+                #ffa949 url('http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134159/bgabout_dbbkaq.jpg') center;
     background-size: cover; 
     height: calc(100vh - 10px);
     width: calc(100vw - 10px);
@@ -41,6 +41,7 @@
     font-weight: bold;
     font-size: 85px;
     margin: auto;
+    margin-bottom: 50vh;
     animation-name: heading;
     animation-duration: 0.4s;
     animation-timing-function: ease;

src/containers/About/index.js

@@ -51,15 +51,15 @@ class About extends Component {
             </p>
             <h2>Internships :</h2>
             <div className={styles.internships}>
-                <img src="../../../static/img/youstart.png" alt="Youstart"/>
+                <img src="http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134174/youstart_mlu2py.png" alt="Youstart"/>
                 <div className={styles.internAbout}>
                     <h3>Youstart Labs</h3>
                     <h5>Jan 2017 - Currently</h5>
                     <p>working mainly in react native and node js (express, loopback etc) </p>
                 </div>
             </div>
             <div className={styles.internships}>
-                <img src="../../../static/img/celebal.png" alt="Celebal"/>
+                <img src="http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134171/celebal_noerpi.png" alt="Celebal"/>
                 <div className={styles.internAbout}>
                     <h3>Celebal Corp</h3>
                     <h5>Sept 2016 - Dec 2016</h5>

src/containers/Contact/contact.css

@@ -7,7 +7,7 @@
 .background {
     background: linear-gradient(40deg,#1F1C2C,transparent 100%),
                 linear-gradient(230deg, #928DAB, transparent),
-                #ffa949 url('../../../static/img/bgcontact.jpg') center;
+                #ffa949 url('http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134166/bgcontact_bigclr.jpg') center;
     background-size: cover; 
     height: calc(100vh - 10px);
     width: calc(100vw - 10px);
@@ -39,6 +39,7 @@
     font-weight: bold;
     font-size: 85px;
     margin: auto;
+    margin-bottom: 50vh;
     animation-name: heading;
     animation-duration: 0.4s;
     animation-timing-function: ease;

src/containers/Contact/index.js

@@ -5,9 +5,17 @@ import styles from './contact.css'
 import Footer from '../../utils/footer'
 import { Form, FormControl, FormGroup, Col, ControlLabel, Checkbox, Button } from 'react-bootstrap'
 
+
+
+
 class Contact extends Component {
   constructor(props) {
     super(props)
+    this.state = {
+      email: '',
+      subject: '',
+      message: ''
+    }
     this.handleScroll = this.handleScroll.bind(this)
   }
   componentDidMount() {
@@ -35,15 +43,39 @@ class Contact extends Component {
       })
     }
   }
+  handleSubmit(e) {
+    e.preventDefault()
+    this.setState({
+      email: '',
+      subject: '',
+      message: ''
+    })
+    alert("sorry I don't have a server right now also I am out of my firebase limits so no backend for now mail me instead [email protected]")
+  }
+  handleEmailChange(e) {
+    this.setState({
+      email: e.target.value
+    })
+  }
+  handleSubjectChange(e) {
+    this.setState({
+      subject: e.target.value
+    })
+  }
+  handleMessageChange(e) {
+    this.setState({
+      message: e.target.value
+    })
+  }
   render() {
     const FormInstance = (
-      <Form horizontal>
+      <Form horizontal onSubmit={::this.handleSubmit}>
         <FormGroup controlId="formHorizontalEmail">
           <Col componentClass={ControlLabel} sm={2}>
             Email
           </Col>
           <Col sm={8}>
-            <FormControl type="email" placeholder="Email" />
+            <FormControl type="email" placeholder="Email" value={this.state.email} onChange={::this.handleEmailChange} />
           </Col>
         </FormGroup>
 
@@ -52,15 +84,15 @@ class Contact extends Component {
             Subject
           </Col>
           <Col sm={8}>
-            <FormControl type="text" placeholder="Subject" />
+            <FormControl type="text" placeholder="Subject" value={this.state.subject} onChange={::this.handleSubjectChange} />
           </Col>
         </FormGroup>
         <FormGroup controlId="formControlsTextarea">
           <Col componentClass={ControlLabel} sm={2}>
             Message
           </Col>
           <Col sm={8}>
-            <FormControl componentClass="textarea" placeholder="message" />
+            <FormControl componentClass="textarea" placeholder="message" value={this.state.message} onChange={::this.handleMessageChange} />
           </Col>
         </FormGroup>
         <FormGroup>

src/containers/Landing/Landing.css

@@ -8,7 +8,7 @@
 .background {
     background: linear-gradient(40deg,#1F1C2C,transparent 100%),
                 linear-gradient(230deg, #928DAB, transparent),
-                #ffa949 url('../../../static/img/bg.jpg') center;
+                #ffa949 url('http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134157/bg_q27nqt.jpg') center;
     background-size: cover; 
     height: calc(100vh - 10px);
     width: calc(100vw - 10px);
@@ -50,7 +50,7 @@
 }
 
 .about {
-    margin-top: 105px;
+    margin-top: 10%;
     overflow: hidden;
     margin-left: 50px; 
     color: white;

src/containers/Landing/index.js

@@ -61,6 +61,7 @@ class App extends Component {
   }
   handleScroll(event) {
     let height = this.refs.heading.getBoundingClientRect().top
+    console.log(this.refs.heading.getBoundingClientRect())
     if(height < 50) {
       this.refs.background.style.filter = 'blur(2px)'
     } else {
@@ -88,7 +89,7 @@ class App extends Component {
             <span className={styles.heading} ref='heading'>
               Rohan Malhotra
             </span>
-            <Subhead words={['Coder','Designer','JS Lover','Wizard','Indian','Geek','Startup Enthusiast','Web Developer','Student','Casual Nerd', 'Developer', 'Casual Pentester', 'FOSS Enthusiast']} />
+            <Subhead words={['Coder','Designer','Wizard','Indian','Geek','Startup Enthusiast','Web Developer','Student','Casual Nerd', 'Developer', 'Casual Pentester']} />
           </div>
           <div className={styles.about}>
             <p>

src/containers/Navigation/Navigation.css

@@ -4,6 +4,7 @@
     overflow: hidden;
     justify-content: flex-end;
     margin-right: 20px;
+    margin-bottom: 5%;
 }
 
 .menu {

src/containers/Projects/projects.css

@@ -8,7 +8,7 @@
 .background {
     background: linear-gradient(40deg,#1F1C2C,transparent 100%),
                 linear-gradient(230deg, #928DAB, transparent),
-                #ffa949 url('../../../static/img/bgprojects.jpg') center;
+                #ffa949 url('http://res.cloudinary.com/www-rohanm-com/image/upload/v1489134169/bgprojects_jcwtwb.jpg') center;
     background-size: cover; 
     height: calc(100vh - 10px);
     width: calc(100vw - 10px);

src/utils/footer.css

@@ -3,7 +3,7 @@
     justify-content: flex-end;
     margin: 30px 10px 10px;
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
-    font-size: 24px;
+    font-size: 20px;
     font-weight: 400;
 }
 

webpack.config.js

@@ -62,7 +62,6 @@ module.exports = {
   externals: {
       'TweenLite': 'TweenLite'
   },
-
   plugins: [
     new webpack.HotModuleReplacementPlugin(),
     new webpack.NamedModulesPlugin()

webpack.config.production.js

@@ -27,24 +27,6 @@ module.exports = {
             'postcss-loader',
         ],
       },
-      {
-        test: /\.(gif|png|jpe?g|svg)$/i,
-        loaders: [
-          'file-loader',
-          {
-            loader: 'image-webpack-loader',
-            query: {
-              progressive: true,
-              optimizationLevel: 7,
-              interlaced: false,
-              pngquant: {
-                quality: '65-90',
-                speed: 4
-              }
-            }
-          }
-        ]
-      },
       {
         test: /\.json$/,
         use: 'json-loader'