invitation jpeg is added

src/App.js

@@ -11,11 +11,11 @@ const styles = {
     display: 'inline-block'
   },
   main: {
-    display: 'flex'
+    // display: 'flex'
   },
   meat: {
     flex: 3,
-    backgroundColor: '#8cdb80'
+    backgroundColor: '#ffffff'
   },
   warning: {
     display: 'inline-block',
@@ -31,7 +31,7 @@ const styles = {
     animation: 'App-logo-spin infinite 20s linear'
   },
   logo: {
-    height: '12em'
+    height: '50%'
   },
   columnLeft: {
     flex: 1,
@@ -55,93 +55,11 @@ class App extends Component {
   render() {
     return (
       <div className="App" style={styles.main}>
-      <aside style={styles.columnLeft}>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-        <span style={styles.tree}>
-          <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-        </span>
-      </aside>
-        <header className="App-header" style={styles.meat}>
-          <img src='https://jokideo.com/wp-content/uploads/meme/2014/11/Why-santas-sack-so-big---christmas-meme.jpg'  alt="logo" style={styles.logo} />
 
-          <h1>MERRY CHRISTMAS <WinkEmoji /> </h1>
-          <span style={styles.warning}><WarningIcon /> Warning: KIDS-FREE PARTY <WarningIcon/> </span>
-          <br />
+        <header className="App-header" style={styles.meat}>
+          <img src={require('./invite.jpeg')} alt="invite" style={styles.logo}/>
           <ChristmasForm />
-          <br />
-          <br />
-          <br />
         </header>
-        <aside style={styles.columnRight}>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-          <span style={styles.tree}>
-            <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/> <TreeIcon style={styles.spin}/>
-          </span>
-        </aside>
         <Button onClick={this.testClick}> TEST </Button>
       </div>
     );

src/form.js

@@ -84,7 +84,7 @@ class TextFields extends React.Component {
           />
         </div>
         <div style={styles.fullWidth}>
-        <InputLabel htmlFor="significant-other">Bringing Someone?</InputLabel>
+        <InputLabel htmlFor="significant-other">Bringing someone?</InputLabel>
           <input
               id="significant-other"
               name="Significant Other"