💅 start stylin

src/components/Layout.js

@@ -2,7 +2,7 @@ import React from 'react'
 import Helmet from 'react-helmet'
 
 import Navbar from './Navbar'
-import './all.sass'
+import '../css/main.scss'
 
 const TemplateWrapper = ({ children }) => (
   <div>

src/components/PostList.js

@@ -14,8 +14,7 @@ export default class IndexPage extends React.Component {
           </div>
           {posts.map(({ node: post }) => (
             <div
-              className="content"
-              style={{ border: '1px solid #eaecee', padding: '2em 4em' }}
+              className="blog-post"
               key={post.id}
             >
               <p>

src/css/base.scss

@@ -0,0 +1,8 @@
+body {
+  background: $color-background;
+}
+
+.blog-post {
+  background: white;
+  padding: 0 0 2rem;
+}

src/css/fonts.scss

@@ -0,0 +1,3 @@
+body {
+  font-family: monospace;
+}

src/css/main.scss

@@ -0,0 +1,4 @@
+/* DNS 2019 STYLE */
+@import 'variables.scss';
+@import 'fonts.scss';
+@import 'base.scss';

src/css/variables.scss

@@ -0,0 +1 @@
+$color-background: orange;