simplify markup

src/templates/blog.js

@@ -12,7 +12,7 @@ export default class IndexPage extends React.Component {
 
     return (
       <Layout>
-        <PostList posts={posts} title="Latest posts" />
+        <PostList posts={posts} title="Aktuelt" />
         <Pagination pageContext={pageContext} pathPrefix="/" />
       </Layout>
     )

src/templates/page.js

@@ -5,22 +5,12 @@ import Layout from '../components/Layout'
 
 export const PageTemplate = ({ title, content }) => {
   return (
-    <section className="section section--gradient">
-      <div className="container">
-        <div className="columns">
-          <div className="column is-10 is-offset-1">
-            <div className="section">
-              <h2 className="title is-size-3 has-text-weight-bold is-bold-light">
-                {title}
-              </h2>
-              <div
-                className="content"
-                dangerouslySetInnerHTML={{ __html: content }}
-              />
-            </div>
-          </div>
-        </div>
-      </div>
+    <section className="page">
+      <h1 className="section-title">{title}</h1>
+      <div
+        className="content"
+        dangerouslySetInnerHTML={{ __html: content }}
+      />
     </section>
   )
 }

src/templates/post.js

@@ -13,49 +13,43 @@ export const BlogPostTemplate = ({
   author,
 }) => {
   return (
-    <section className="section">
-      <div className="container content">
-        <div className="columns">
-          <div className="column is-10 is-offset-1">
-            <h1 className="title is-size-2 has-text-weight-bold is-bold-light">
-              {title}
-            </h1>
-            <div dangerouslySetInnerHTML={{ __html: content }} />
-            <div style={{ marginTop: `4rem` }}>
-              <p>
-                {date} - posted by{' '}
-                <Link to={`/author/${author.slug}`}>{author.name}</Link>
-              </p>
-              {categories && categories.length ? (
-                <div>
-                  <h4>Categories</h4>
-                  <ul className="taglist">
-                    {categories.map(category => (
-                      <li key={`${category.slug}cat`}>
-                        <Link to={`/categories/${category.slug}/`}>
-                          {category.name}
-                        </Link>
-                      </li>
-                    ))}
-                  </ul>
-                </div>
-              ) : null}
-              {tags && tags.length ? (
-                <div>
-                  <h4>Tags</h4>
-                  <ul className="taglist">
-                    {tags.map(tag => (
-                      <li key={`${tag.slug}tag`}>
-                        <Link to={`/tags/${tag.slug}/`}>{tag.name}</Link>
-                      </li>
-                    ))}
-                  </ul>
-                </div>
-              ) : null}
-            </div>
-          </div>
-        </div>
+    <section className="post-page">
+      <h1 className="section-title">
+        {title}
+      </h1>
+      <div className="post-meta">
+        <p>
+          {date} - posted by{' '}
+          <Link to={`/author/${author.slug}`}>{author.name}</Link>
+        </p>
       </div>
+      <div dangerouslySetInnerHTML={{ __html: content }} />
+        {categories && categories.length ? (
+          <div>
+            <h4>Categories</h4>
+            <ul className="taglist">
+              {categories.map(category => (
+                <li key={`${category.slug}cat`}>
+                  <Link to={`/categories/${category.slug}/`}>
+                    {category.name}
+                  </Link>
+                </li>
+              ))}
+            </ul>
+          </div>
+        ) : null}
+        {tags && tags.length ? (
+          <div>
+            <h4>Tags</h4>
+            <ul className="taglist">
+              {tags.map(tag => (
+                <li key={`${tag.slug}tag`}>
+                  <Link to={`/tags/${tag.slug}/`}>{tag.name}</Link>
+                </li>
+              ))}
+            </ul>
+          </div>
+        ) : null}
     </section>
   )
 }