WIP I guess

assets/sass/components/_home.scss

@@ -0,0 +1,9 @@
+.home__about,
+.home__photos,
+.home__blog {
+  margin-top: 8vmin;
+}
+
+.home__more {
+  text-align: right;
+}

assets/sass/components/_post.scss

@@ -1,6 +1,7 @@
 .post {
   border-bottom: 1px dashed $border-color;
-  padding: 1.5em $pad-min;
+  margin-top: 2em;
+  padding-bottom: 1.5em;
 
   img {
     max-width: 100%;

assets/sass/components/_site-header.scss

@@ -6,3 +6,7 @@
     border-bottom: 1px dashed $text-color-dark;
   }
 }
+
+.site-header__home-link {
+  color: inherit;
+}

assets/sass/elements/_blockquote.scss

@@ -1,4 +1,5 @@
 blockquote {
   padding-left: 2rem;
   border-left: 3px solid $text-color-light;
+  margin: 1em 0;
 }

assets/sass/main.scss

@@ -28,11 +28,13 @@
 // 5. Objects – class-based selectors which define undecorated design patterns,
 //    for example media object known from OOCSS
 @import "objects/container";
+@import "objects/outer";
 
 // 6. Components – specific UI components.
 //    This is where majority of our work takes place and our UI components
 //    are often composed of Objects and Components
 @import "components/site-header";
+@import "components/home";
 @import "components/posts";
 @import "components/post";
 @import "components/photos";

assets/sass/objects/_outer.scss

@@ -0,0 +1,3 @@
+.outer {
+  padding: 0 $pad-min;
+}

content/_index.md

@@ -0,0 +1,7 @@
+---
+date: '2019-10-16'
+---
+
+Hi, my name is Dan Barber. I’m a web designer and developer in New York.
+I design and build standards compliant websites that are simple, usable and
+attractive using open source software technologies.

layouts/home.html

@@ -1,3 +0,0 @@
-{{ define "main" }}
-  <h1>Foo</h1>
-{{ end }}

layouts/index.html

@@ -0,0 +1,45 @@
+{{ define "main" }}
+  <section class="home__about outer">
+    <article class="container">
+      {{ .Content }}
+    </article>
+  </section>
+
+  <section class="home__photos outer">
+    <article class="container">
+      <header>
+        <h2>Latest Photos</h2>
+      </header>
+
+      <div class="photos__container">
+        {{ range first 3 (where .Site.RegularPages "Section" "photos") }}
+          <article class="photos__thumb-container">
+            {{ partial "photo_thumb.html" . }}
+          </article>
+        {{ end }}
+      </div>
+
+      <footer class="home__more">
+        <p><a href="/photos">All Photos →</a></p>
+      </footer>
+    </article>
+  </section>
+
+  <section class="home__blog">
+    <article>
+      <header class="outer">
+        <div class="container">
+          <h2>From the Blog</h2>
+        </div>
+      </header>
+
+      {{ range first 3 (where .Site.RegularPages "Section" "blog") }}
+        {{ partial "blog_post_summary.html" . }}
+      {{ end }}
+
+      <footer class="container home__more">
+        <p><a href="/blog">More →</a></p>
+      </footer>
+    </article>
+  </section>
+{{ end }}

layouts/partials/blog_post_summary.html

@@ -0,0 +1,17 @@
+<article class="post outer">
+  <header>
+    <div class="container">
+      <h3 class="post__title"><a href="{{.Permalink}}">{{.Title}}</a></h3>
+
+      <p class="post__date">{{.Date.Format "Jan 2, 2006"}}</p>
+    </div>
+  </header>
+
+  {{ if .Truncated }}
+    {{.Summary}}
+
+    <p class="post__read-more"><a href="{{.Permalink}}">Read on →</a></p>
+  {{ else }}
+    {{.Content}}
+  {{ end }}
+</article>

layouts/partials/header.html

@@ -1,5 +1,5 @@
 <header class="site-header" role="banner">
   <div class="container">
-    <h1>{{.Site.Title}}</h1>
+    <h1><a class="site-header__home-link" href="/">{{.Site.Title}}</a></h1>
   </div>
 </header>

layouts/section/blog.html

@@ -1,21 +1,7 @@
 {{ define "main" }}
   <section class="posts">
     {{ range .Paginator.Pages }}
-    <article class="post">
+      {{ partial "blog_post_summary.html" . }}
-      <header>
-        <h3 class="post__title"><a href="{{.Permalink}}">{{.Title}}</a></h3>
-
-        <p class="post__date">{{.Date.Format "Jan 2, 2006"}}</p>
-      </header>
-
-      {{ if .Truncated }}
-        {{.Summary}}
-
-        <p class="post__read-more"><a href="{{.Permalink}}">Read on →</a></p>
-      {{ else }}
-        {{.Content}}
-      {{ end }}
-    </article>
     {{ end }}
   </section>
 

layouts/section/photos.html

@@ -1,5 +1,5 @@
 {{ define "main" }}
-  <section class="photos">
+  <section class="photos outer">
     <div class="photos__container">
       {{ range (.Paginator 24).Pages }}
         <article class="photos__thumb-container">