Rework index page layout to include projects

6 files changed, 103 insertions, 83 deletions

diff --git a/layouts/404.html b/layouts/404.html
deleted file mode 100644
index b73be72..0000000
--- a/layouts/404.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{{ partial "header.html" . }}
-
-	<main role="main">
-            <h1>Oops!</h1>
-            <h2>This page does not exist.</h2>
-	</main>
-
-{{ partial "footer.html" . }}
diff --git a/layouts/_default/list.html b/layouts/_default/list.html
index 0cf0d1f..a33b3af 100644
--- a/layouts/_default/list.html
+++ b/layouts/_default/list.html
@@ -1,16 +1,20 @@
 {{ partial "header.html" . }}
 
-	<main role="main">
-		<h1 class="list-title">{{ .Title }}</h1>
-{{ range .Data.Pages }}
-		<article itemscope itemtype="http://schema.org/Blog">
-			<h2 class="entry-title" itemprop="headline"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
-			<span class="entry-meta"><time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time></span>
-                        <div>
-                            {{ .Summary }}
-                        </div>
-		</article>
-{{ end }}
-	</main>
+  <main role="main">
+    <h1 class="list-title">{{ .Title }}</h1>
+    {{ range .Data.Pages }}
+    <article itemscope itemtype="http://schema.org/Blog">
+      <h2 class="entry-title" itemprop="headline">
+        <a href="{{ .RelPermalink }}">{{ .Title }}</a>
+      </h2>
+      <span class="entry-meta">
+        <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
+      </span>
+      <div>
+        {{ .Summary }}
+      </div>
+    </article>
+    {{ end }}
+  </main>
 
 {{ partial "footer.html" . }}
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 431e193..e5ed960 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,13 +1,15 @@
 {{ partial "header.html" . }}
 
-	<main role="main">
-		<article itemscope itemtype="http://schema.org/BlogPosting">
-			<h1 class="entry-title" itemprop="headline">{{ .Title }}</h1>
-			<span class="entry-meta"><time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time></span>
-			<section itemprop="entry-text">
-				{{ .Content }}
-			</section>
-		</article>
-	</main>
+  <main role="main">
+    <article itemscope itemtype="http://schema.org/BlogPosting">
+      <h1 class="entry-title" itemprop="headline">{{ .Title }}</h1>
+      <span class="entry-meta">
+        <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
+      </span>
+      <section itemprop="entry-text">
+        {{ .Content }}
+      </section>
+    </article>
+  </main>
 
 {{ partial "footer.html" . }}
diff --git a/layouts/index.html b/layouts/index.html
index 032e71f..703e5a5 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,16 +1,35 @@
 {{ partial "header.html" . }}
 
-	<main role="main">
-		<h1 class="list-title">Tech</h1>
-{{ range (where .Data.Pages ".Section" "==" "tech") }}
-		<article itemscope itemtype="http://schema.org/Blog">
-			<h2 class="entry-title" itemprop="headline"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
-			<span class="entry-meta"><time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time></span>
-                        <div>
-                            {{ .Summary }}
-                        </div>
-		</article>
-{{ end }}
-	</main>
+  <main role="main">
+		<h2 class="list-title">Projects</h2>
+		<div class="card-grid">
+			{{ range where .Site.RegularPages "Section" "projects" }}
+			<div class="card-wrapper">
+				<article itemscope itemtype="http://schema.org/Blog" class="card">
+					<img src="{{ .Params.image }}" class="card-image">
+					<div class="card-content">
+						<h3 class="card-title" itemprop="headline">
+							{{ .Title }}</a>
+						</h3>
+						<div class="card-text">
+							{{ .Summary }}
+						</div>
+						<div>
+							{{ if .Truncated }}
+							<a href="{{ .RelPermalink }}" class="card-link">Read Article</a>
+							{{ end }}
+							{{ if ne .Params.link nil }}
+							<a href="{{ .Params.link }}" class="card-link">Visit Project Website</a>
+							{{ end }}
+							<span class="card-date">
+								<time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02" }}">{{ .Date.Format "2006-01-02" }}</time>
+							</span>
+						</div>
+					</div>
+				</article>
+			</div>
+			{{ end }}
+		</div>
+  </main>
 
 {{ partial "footer.html" . }}
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index d53f13e..197af75 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -1,28 +1,28 @@
-            </div> <!-- .barba-container -->
-        </div> <!-- #barba-wrapper -->
-	<footer role="contentinfo">
-		<div class="hr"></div>
-		<div class="footer-link">
-                        <!-- SVGs: GitHub octicons, MIT license -->
-                        {{ if not .IsHome }}
-                        <a target="_blank" href="{{ .Site.RSSLink }}"><svg height="16" width="10"><path d="M2 13H0V11c1.11 0 2 0.89 2 2zM0 3v1c4.97 0 9 4.03 9 9h1c0-5.52-4.48-10-10-10z m0 4v1c2.75 0 5 2.25 5 5h1c0-3.31-2.69-6-6-6z" /></svg> RSS</a>
-                        &mdash;
-                        {{ end }}
-                        {{ if .IsNode }}
-                        <a target="_blank" class="no-barba" href="{{ .RSSLink }}"><svg height="15" width="10"><path d="M2 13H0V11c1.11 0 2 0.89 2 2zM0 3v1c4.97 0 9 4.03 9 9h1c0-5.52-4.48-10-10-10z m0 4v1c2.75 0 5 2.25 5 5h1c0-3.31-2.69-6-6-6z" /></svg> RSS{{ if not .IsHome}} ({{ .Title }}){{ end }}</a>
-                        &mdash;
-                        {{ end }}
-                        <a target="_blank" href="http://rctd57w5hc6vpb6v.onion"><svg width="14" height="16"><path d="M7 0L0 2v6.02C0 12.69 5.31 16 7 16c1.69 0 7-3.31 7-7.98V2L7 0zM5 11l1.14-2.8a.568.568 0 0 0-.25-.59C5.33 7.25 5 6.66 5 6c0-1.09.89-2 1.98-2C8.06 4 9 4.91 9 6c0 .66-.33 1.25-.89 1.61-.19.13-.3.36-.25.59L9 11H5z"></path></svg> Onion</a>
-                        &mdash;
-			{{ with .Site.Params.email }}<a href="mailto:{{ . }}" target="_blank"><svg height="16" width="14"><path d="M0 4v8c0 0.55 0.45 1 1 1h12c0.55 0 1-0.45 1-1V4c0-0.55-0.45-1-1-1H1c-0.55 0-1 0.45-1 1z m13 0L7 9 1 4h12zM1 5.5l4 3L1 11.5V5.5z m1 6.5l3.5-3 1.5 1.5 1.5-1.5 3.5 3H2z m11-0.5L9 8.5l4-3v6z" /></svg> Mail</a>{{ end }}
-                        &mdash;
-                        <a target="_blank" class="no-barba" href="/schneefux.pubkey.txt"><svg height="16" width="12"><path d="M4 13H3v-1h1v1zm8-6v7c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V7c0-.55.45-1 1-1h1V4c0-2.2 1.8-4 4-4s4 1.8 4 4v2h1c.55 0 1 .45 1 1zM3.8 6h4.41V4c0-1.22-.98-2.2-2.2-2.2-1.22 0-2.2.98-2.2 2.2v2H3.8zM11 7H2v7h9V7zM4 8H3v1h1V8zm0 2H3v1h1v-1z"></path></svg> PGP</a>
-                        &mdash;
-                        <a target="_blank" href="https://keybase.io/schneefux"><svg height="16" width="16"><path d="M12.83 2.17C12.08 1.42 11.14 1.03 10 1c-1.13.03-2.08.42-2.83 1.17S6.04 3.86 6.01 5c0 .3.03.59.09.89L0 12v1l1 1h2l1-1v-1h1v-1h1v-1h2l1.09-1.11c.3.08.59.11.91.11 1.14-.03 2.08-.42 2.83-1.17S13.97 6.14 14 5c-.03-1.14-.42-2.08-1.17-2.83zM11 5.38c-.77 0-1.38-.61-1.38-1.38 0-.77.61-1.38 1.38-1.38.77 0 1.38.61 1.38 1.38 0 .77-.61 1.38-1.38 1.38z"></path></svg> Keybase</a>
-                        &mdash;
-                        <a target="_blank" href="https://git.schneefux.xyz/"><svg height="16" width="10"><path d="M10 5c0-1.11-0.89-2-2-2s-2 0.89-2 2c0 0.73 0.41 1.38 1 1.72v0.3c-0.02 0.52-0.23 0.98-0.63 1.38s-0.86 0.61-1.38 0.63c-0.83 0.02-1.48 0.16-2 0.45V4.72c0.59-0.34 1-0.98 1-1.72 0-1.11-0.89-2-2-2S0 1.89 0 3c0 0.73 0.41 1.38 1 1.72v6.56C0.41 11.63 0 12.27 0 13c0 1.11 0.89 2 2 2s2-0.89 2-2c0-0.53-0.2-1-0.53-1.36 0.09-0.06 0.48-0.41 0.59-0.47 0.25-0.11 0.56-0.17 0.94-0.17 1.05-0.05 1.95-0.45 2.75-1.25s1.2-1.98 1.25-3.02h-0.02c0.61-0.36 1.02-1 1.02-1.73zM2 1.8c0.66 0 1.2 0.55 1.2 1.2s-0.55 1.2-1.2 1.2-1.2-0.55-1.2-1.2 0.55-1.2 1.2-1.2z m0 12.41c-0.66 0-1.2-0.55-1.2-1.2s0.55-1.2 1.2-1.2 1.2 0.55 1.2 1.2-0.55 1.2-1.2 1.2z m6-8c-0.66 0-1.2-0.55-1.2-1.2s0.55-1.2 1.2-1.2 1.2 0.55 1.2 1.2-0.55 1.2-1.2 1.2z" /></svg> Git</a>
-		</div>
-	</footer>
+    </div> <!-- .barba-container -->
+  </div> <!-- #barba-wrapper -->
+  <footer role="contentinfo">
+    <div class="hr"></div>
+    <div class="footer-link">
+      <!-- SVGs: GitHub octicons, MIT license -->
+      {{ if not .IsHome }}
+      <a target="_blank" href="{{ .Site.RSSLink }}"><svg height="16" width="10"><path d="M2 13H0V11c1.11 0 2 0.89 2 2zM0 3v1c4.97 0 9 4.03 9 9h1c0-5.52-4.48-10-10-10z m0 4v1c2.75 0 5 2.25 5 5h1c0-3.31-2.69-6-6-6z" /></svg> RSS</a>
+      &mdash;
+      {{ end }}
+      {{ if .IsNode }}
+      <a target="_blank" class="no-barba" href="{{ .RSSLink }}"><svg height="15" width="10"><path d="M2 13H0V11c1.11 0 2 0.89 2 2zM0 3v1c4.97 0 9 4.03 9 9h1c0-5.52-4.48-10-10-10z m0 4v1c2.75 0 5 2.25 5 5h1c0-3.31-2.69-6-6-6z" /></svg> RSS{{ if not .IsHome}} ({{ .Title }}){{ end }}</a>
+      &mdash;
+      {{ end }}
+      <a target="_blank" href="http://rctd57w5hc6vpb6v.onion"><svg width="14" height="16"><path d="M7 0L0 2v6.02C0 12.69 5.31 16 7 16c1.69 0 7-3.31 7-7.98V2L7 0zM5 11l1.14-2.8a.568.568 0 0 0-.25-.59C5.33 7.25 5 6.66 5 6c0-1.09.89-2 1.98-2C8.06 4 9 4.91 9 6c0 .66-.33 1.25-.89 1.61-.19.13-.3.36-.25.59L9 11H5z"></path></svg> Onion</a>
+      &mdash;
+      {{ with .Site.Params.email }}<a href="mailto:{{ . }}" target="_blank"><svg height="16" width="14"><path d="M0 4v8c0 0.55 0.45 1 1 1h12c0.55 0 1-0.45 1-1V4c0-0.55-0.45-1-1-1H1c-0.55 0-1 0.45-1 1z m13 0L7 9 1 4h12zM1 5.5l4 3L1 11.5V5.5z m1 6.5l3.5-3 1.5 1.5 1.5-1.5 3.5 3H2z m11-0.5L9 8.5l4-3v6z" /></svg> Mail</a>{{ end }}
+      &mdash;
+      <a target="_blank" class="no-barba" href="/schneefux.pubkey.txt"><svg height="16" width="12"><path d="M4 13H3v-1h1v1zm8-6v7c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V7c0-.55.45-1 1-1h1V4c0-2.2 1.8-4 4-4s4 1.8 4 4v2h1c.55 0 1 .45 1 1zM3.8 6h4.41V4c0-1.22-.98-2.2-2.2-2.2-1.22 0-2.2.98-2.2 2.2v2H3.8zM11 7H2v7h9V7zM4 8H3v1h1V8zm0 2H3v1h1v-1z"></path></svg> PGP</a>
+      &mdash;
+      <a target="_blank" href="https://keybase.io/schneefux"><svg height="16" width="16"><path d="M12.83 2.17C12.08 1.42 11.14 1.03 10 1c-1.13.03-2.08.42-2.83 1.17S6.04 3.86 6.01 5c0 .3.03.59.09.89L0 12v1l1 1h2l1-1v-1h1v-1h1v-1h2l1.09-1.11c.3.08.59.11.91.11 1.14-.03 2.08-.42 2.83-1.17S13.97 6.14 14 5c-.03-1.14-.42-2.08-1.17-2.83zM11 5.38c-.77 0-1.38-.61-1.38-1.38 0-.77.61-1.38 1.38-1.38.77 0 1.38.61 1.38 1.38 0 .77-.61 1.38-1.38 1.38z"></path></svg> Keybase</a>
+      &mdash;
+      <a target="_blank" href="https://git.schneefux.xyz/"><svg height="16" width="10"><path d="M10 5c0-1.11-0.89-2-2-2s-2 0.89-2 2c0 0.73 0.41 1.38 1 1.72v0.3c-0.02 0.52-0.23 0.98-0.63 1.38s-0.86 0.61-1.38 0.63c-0.83 0.02-1.48 0.16-2 0.45V4.72c0.59-0.34 1-0.98 1-1.72 0-1.11-0.89-2-2-2S0 1.89 0 3c0 0.73 0.41 1.38 1 1.72v6.56C0.41 11.63 0 12.27 0 13c0 1.11 0.89 2 2 2s2-0.89 2-2c0-0.53-0.2-1-0.53-1.36 0.09-0.06 0.48-0.41 0.59-0.47 0.25-0.11 0.56-0.17 0.94-0.17 1.05-0.05 1.95-0.45 2.75-1.25s1.2-1.98 1.25-3.02h-0.02c0.61-0.36 1.02-1 1.02-1.73zM2 1.8c0.66 0 1.2 0.55 1.2 1.2s-0.55 1.2-1.2 1.2-1.2-0.55-1.2-1.2 0.55-1.2 1.2-1.2z m0 12.41c-0.66 0-1.2-0.55-1.2-1.2s0.55-1.2 1.2-1.2 1.2 0.55 1.2 1.2-0.55 1.2-1.2 1.2z m6-8c-0.66 0-1.2-0.55-1.2-1.2s0.55-1.2 1.2-1.2 1.2 0.55 1.2 1.2-0.55 1.2-1.2 1.2z" /></svg> Git</a>
+    </div>
+  </footer>
 </div>
 </body>
 </html>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 4a6756e..67ab370 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -6,26 +6,29 @@
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <link rel="shortcut icon" type="image/png" href="/favicon.png">
 <link rel="stylesheet" type="text/css" href="/css/min.css">
+<link rel="stylesheet" type="text/css" href="/css/custom.css">
 <link rel="alternate" href="/index.xml" type="application/rss+xml" title="{{ .Site.Title }}">
 <title>{{ .Title }}{{ if not .IsHome }} - {{ .Site.Title }}{{ end }}</title>
 </head>
 <body>
 <script async type="text/javascript" src="/js/min.js"></script>
 <div class="container">
-	<header role="banner">
-		<div class="header-logo">
-                    <a href="/"><img width="128" height="128" alt="" src="/logo.svg"></img></a>
-		</div>
-		<h1 class="site-title">{{ .Site.Title }}</h1>
-	</header>
-        <div class="container">
-            <div class="row">
-                {{ range .Site.Menus.main }}
-                <div class="one-half column">
-                    <a class="button" href="{{ .URL }}">{{ .Name }}</a>
-                </div>
-                {{ end }}
-            </div>
-        </div>
-        <div id="barba-wrapper">
-            <div class="barba-container">
+  <header role="banner">
+    <div class="header-logo">
+      <a href="/"><img width="128" height="128" alt="" src="/logo.svg"></img></a>
+    </div>
+    <h1 class="site-title">{{ .Site.Title }}</h1>
+  </header>
+  <div class="container">
+    <div class="row">
+      {{ range .Site.Menus.main }}
+      {{ if ne .Name "Projects" }}
+      <div class="one-half column menu-container">
+        <a class="button" href="{{ .URL }}">{{ .Name }}</a>
+      </div>
+      {{ end }}
+      {{ end }}
+    </div>
+  </div>
+  <div id="barba-wrapper">
+    <div class="barba-container">