add build

.travis.yml

@@ -0,0 +1,7 @@
+language: node_js
+cache:
+  directories:
+    - node_modules
+  yarn: true
+node_js:
+  - 9

package.json

@@ -19,11 +19,7 @@
     }
   },
   "eslintConfig": {
-    "extends": ["eslint-config-synacor", "prettier"],
-    "rules": {
-      "react/display-name": "off",
-      "react/no-did-mount-set-state": "off"
-    }
+    "extends": ["eslint-config-synacor", "prettier"]
   },
   "eslintIgnore": ["build/*"],
   "devDependencies": {

src/components/loading.js

@@ -37,9 +37,11 @@ const Pulsate = styled.div`
   }
 `
 
-export default () => (
+const Loading = () => (
   <Pulsate>
     <div />
     <div />
   </Pulsate>
 )
+
+export default Loading

src/index.js

@@ -1,40 +1,8 @@
 import App from './components/app'
-import styled, { injectGlobal } from 'react-emotion'
+import styled from 'react-emotion'
 import { ThemeProvider } from 'emotion-theming'
 import { Grid } from 'react-emotion-flexboxgrid'
-
-injectGlobal`
-	@import url('https://fonts.googleapis.com/css?family=Roboto');
-	html, body {
-		height: 100%;
-		width: 100%;
-		overflow-x: hidden;
-		padding: 0;
-		margin: 0;
-		background: #FAFAFA;
-		font-family: 'Roboto', arial, sans-serif;
-		font-weight: 600;
-		color: #e8eaf6;
-		-webkit-font-smoothing: antialiased;
-		-moz-osx-font-smoothing: grayscale;
-	}
-
-	* {
-		box-sizing: border-box;
-	}
-
-	#app {
-		height: 100%;
-		width: 100%;
-		opacity: 1;
-		backface-visibility: hidden;
-	}
-
-	ul {
-		padding: 0;
-		margin: 0;
-	}
-`
+import './utils/global'
 
 const theme = {
   primary: '#4a0072',
@@ -52,7 +20,7 @@ const System = styled(Grid)`
   height: 100%;
 `
 
-export default () => (
+const Main = () => (
   <ThemeProvider theme={theme}>
     <Wrapper>
       <System>
@@ -61,3 +29,5 @@ export default () => (
     </Wrapper>
   </ThemeProvider>
 )
+
+export default Main

src/utils/global.js

@@ -0,0 +1,34 @@
+import { injectGlobal } from 'react-emotion'
+
+export default injectGlobal`
+	@import url('https://fonts.googleapis.com/css?family=Roboto');
+	html, body {
+		height: 100%;
+		width: 100%;
+		overflow-x: hidden;
+		padding: 0;
+		margin: 0;
+		background: #FAFAFA;
+		font-family: 'Roboto', arial, sans-serif;
+		font-weight: 600;
+		color: #e8eaf6;
+		-webkit-font-smoothing: antialiased;
+		-moz-osx-font-smoothing: grayscale;
+	}
+
+	* {
+		box-sizing: border-box;
+	}
+
+	#app {
+		height: 100%;
+		width: 100%;
+		opacity: 1;
+		backface-visibility: hidden;
+	}
+
+	ul {
+		padding: 0;
+		margin: 0;
+	}
+`