From aba0ed25cc0a0ae162ea10fea52cea4719bb8b24 Mon Sep 17 00:00:00 2001
From: Nils Sandmann <git@softcat.org>
Date: Wed, 13 May 2020 22:52:44 +0200
Subject: [PATCH] Added option to add image (e.g. portrait) on front page

---
 assets/scss/_main.scss  | 5 +++++
 exampleSite/config.toml | 4 ++++
 layouts/index.html      | 5 ++++-
 3 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/assets/scss/_main.scss b/assets/scss/_main.scss
index 1a1d91e..f568cc5 100644
--- a/assets/scss/_main.scss
+++ b/assets/scss/_main.scss
@@ -100,6 +100,11 @@ img {
   &.right {
     margin-left: auto;
   }
+  &.circle {
+    border-radius: 50%;
+    max-width: 25%;
+    margin: auto;
+  }
 }
 
 figure {
diff --git a/exampleSite/config.toml b/exampleSite/config.toml
index 0a15da4..2ead911 100644
--- a/exampleSite/config.toml
+++ b/exampleSite/config.toml
@@ -98,6 +98,10 @@ disableHugoGeneratorInject = false
     # Set to a valid CSS time value to change the animation duration, "0s" to disable.
     # logoCursorAnimate  = "2s"
 
+  [params.portrait]
+    path = "/img/image.jpg"
+    alt = "Portrait"
+
   # Social icons
   [[params.social]]
     name = "twitter"
diff --git a/layouts/index.html b/layouts/index.html
index 615051e..052c91a 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,8 +1,11 @@
 {{ define "main" }}
     <main aria-role="main">
         <div>
-            <h1>{{ .Site.Title }}</h1>
+            {{ if .Site.Params.portrait.path }}
+               <img src="{{ .Site.Params.portrait.path }}" class="circle" alt="{{ .Site.Params.portrait.alt }}" />
+            {{ end }}
 
+            <h1>{{ .Site.Title }}</h1>
             {{- with .Site.Params.homeSubtitle }}
                 <p>{{.}}</p>
             {{- end }}