Merge pull request gatsbyjs#1 from gesposito/master

Converted to ES6, JSX
pragmaticpat · Sep 13, 2015 · 86b56da · 86b56da
2 parents 6feb491 + 896b2f5
commit 86b56da
Show file tree

Hide file tree

Showing 6 changed files with 76 additions and 61 deletions.
diff --git a/app.coffee b/app.coffee
diff --git a/app.js b/app.js
@@ -0,0 +1,11 @@
+exports.loadContext = function(callback) {
+  var context;
+  context = require.context('./pages', true);
+  if (module.hot) {
+    module.hot.accept(context.id, function() {
+      context = require.context('./pages', true);
+      return callback(context);
+    });
+  }
+  return callback(context);
+};
diff --git a/html.cjsx b/html.cjsx
diff --git a/html.jsx b/html.jsx
@@ -0,0 +1,38 @@
+import React from 'react';
+import Typography from 'typography';
+import DocumentTitle from 'react-document-title';
+
+var TypographyStyle = new Typography().TypographyStyle;
+
+module.exports = React.createClass({
+  getDefaultProps: function() {
+    return {
+      body: ""
+    };
+  },
+
+  render: function() {
+    var title;
+    title = DocumentTitle.rewind();
+    if (this.props.title) {
+      title = this.props.title;
+    }
+
+    return (
+      <html lang="en">
+        <head>
+          <meta charSet="utf-8"/>
+          <meta httpEquiv="X-UA-Compatible" content="IE=edge"/>
+          <meta name='viewport' content='width=device-width, initial-scale=1.0 maximum-scale=1.0'/>
+          <title>{title}</title>
+          <link rel="shortcut icon" href={this.props.favicon}/>
+          <TypographyStyle/>
+        </head>
+        <body>
+          <div id="react-mount" dangerouslySetInnerHTML={{__html: this.props.body}} />
+          <script src="/bundle.js"/>
+        </body>
+      </html>
+    );
+  }
+});
diff --git a/pages/_template.cjsx b/pages/_template.cjsx
diff --git a/pages/_template.jsx b/pages/_template.jsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import { RouteHandler, Link, State } from 'react-router';
+import { Container, Grid, Breakpoint, Span } from 'react-responsive-grid';
+import Typography from 'typography';
+
+var typography = new Typography();
+var rhythm = typography.rhythm, fontSizeToMS = typography.fontSizeToMS;
+
+module.exports = React.createClass({
+  mixins: [State],
+
+  render: function() {
+    return (
+      <div>
+        <Container
+          style={{
+            maxWidth: 960,
+            padding: `${rhythm(1)} ${rhythm(1/2)}`,
+            paddingTop: 0
+          }}
+        >
+          <RouteHandler typography={typography} {...this.props}/>
+        </Container>
+      </div>
+    );
+  }
+});