parameterise colors and fonts

layouts/_default/single.html

@@ -7,7 +7,7 @@
   {{ $section := .Site.GetPage "section" .Section }}
   <article class="flex-l flex-wrap justify-between mw8 center ph3">
     <header class="mt4 w-100">
-      <aside class="instapaper_ignoref b helvetica tracked">
+      <aside class="instapaper_ignoref b tracked {{ $.Param "post_content_classes"  | default "sans-serif"}} {{ $.Param "secondary_text_color" | default "near-black" }}">
           {{/*
           CurrentSection allows us to use the section title instead of inferring from the folder.
           https://gohugo.io/variables/page/#section-variables-and-methods
@@ -15,7 +15,7 @@
         {{with .CurrentSection.Title }}{{. | upper }}{{end}}
       </aside>
       {{ partial "social-share.html" . }}
-      <h1 class="f1 athelas mt3 mb1">
+      <h1 class="f1 mt3 mb1 {{ $.Param "post_content_classes"  | default "serif"}} {{ $.Param "text_color" | default "near-black" }}">
         {{- .Title -}}
       </h1>
       {{ with .Params.author | default .Site.Params.author }}
@@ -31,7 +31,7 @@
       {{ end }}
       {{/* Hugo uses Go's date formatting is set by example. Here are two formats */}}
       {{ if not .Date.IsZero }}
-      <time class="f6 mv4 dib tracked" {{ printf `datetime="%s"` (.Date.Format "2006-01-02T15:04:05Z07:00") | safeHTMLAttr }}>
+      <time class="f6 mv4 dib tracked {{ $.Param "post_content_classes"  | default "serif"}} {{ $.Param "secondary_text_color" | default "near-black" }}" {{ printf `datetime="%s"` (.Date.Format "2006-01-02T15:04:05Z07:00") | safeHTMLAttr }}>
         {{- .Date.Format (default "January 2, 2006" .Site.Params.date_format) -}}
       </time>
       {{end}}

layouts/_default/summary-with-image.html

@@ -12,12 +12,12 @@
         </div>
       {{ end }}
       <div class="blah w-100{{ if $featured_image }} w-60-ns pl3-ns{{ end }}">
-        <h1 class="f3 fw1 athelas mt0 lh-title">
+        <h1 class="f3 fw1 mt0 lh-title {{ $.Param "body_classes"  | default "serif"}} {{ $.Param "text_color" | default "near-black" }}">
           <a href="{{.RelPermalink}}" class="color-inherit dim link">
             {{ .Title }}
             </a>
         </h1>
-        <div class="f6 f5-l lh-copy nested-copy-line-height nested-links">
+        <div class="f6 f5-l lh-copy nested-copy-line-height nested-links {{ $.Param "secondary_text_color" | default "near-black" }}">
           {{ .Summary }}
         </div>
           <a href="{{.RelPermalink}}" class="ba b--moon-gray bg-light-gray br2 color-inherit dib f7 hover-bg-moon-gray link mt2 ph2 pv1">{{ $.Param "read_more_copy" | default (i18n "readMore") }}</a>

layouts/_default/summary.html

@@ -1,7 +1,7 @@
 <div class="relative w-100 mb4 bg-white nested-copy-line-height">
   <div class="bg-white mb3 pa4 gray overflow-hidden">
     <span class="f6 db">{{ humanize .Section }}</span>
-    <h1 class="f3 near-black">
+    <h1 class="f3 {{ $.Param "secondary_text_color" | default "near-black" }}">
       <a href="{{ .RelPermalink }}" class="link black dim">
         {{ .Title }}
       </a>

layouts/index.html

@@ -15,7 +15,7 @@
     <div class="pa3 pa4-ns w-100 w-70-ns center">
       {{/* Use $section_name to get the section title. Use "with" to only show it if it exists */}}
        {{ with .Site.GetPage "section" $section_name }}
-          <h1 class="flex-none">
+          <h1 class="flex-none {{ $.Param "secondary_text_color" | default "near-black" }}">
             {{ $.Param "recent_copy" | default (i18n "recentTitle" .) }}
           </h1>
         {{ end }}