Add tachyons-style class overrides for layouts

This change adds overrides for text scale, color, alignment, and padding
in all layouts. This can be configured in site or page parameters, and
can target the default for all layouts (mostly useful for scale and
color), or for a specific layout (home, post, list, page, or terms).

The parameters are named in the following way: <type>_<style>:
- default_scale: Defines default scale for content (aka f5)
- default_color: Defines default color for content (aka mid-gray)
- default_padding: Defines default padding for content (aka ph*/pv*)
- default_align: Defines default alignment for content (aka tc/tj)

This can be overridden for "home", "post", "list", "page", or "terms" by
using instead of "default". If a type-specific style is not specified,
then it will fall back on "default", and if default is not specified, it
will fall back on the Ananke theme default.

Of course, theme users may put whatever classes they want in these
settings, but it still is valuable to specify what will be overridden
from the theme.

layouts/_default/list.html

@@ -1,6 +1,10 @@
 {{ define "main" }}
   <article class="pa3 pa4-ns nested-copy-line-height nested-img">
-    <section class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
+    {{ $cpadding := $.Param "list_padding" | default ($.Param "default_padding") | default "ph3 ph5-l pv3 pv4-l" }}  
+    {{ $cscale := $.Param "list_scale" | default ($.Param "default_scale") | default "f4" }}  
+    {{ $calign := $.Param "list_align" | default ($.Param "default_align") | default "tc-l" }}  
+    {{ $ccolor := $.Param "list_color" | default ($.Param "default_color") | default "mid-gray" }}
+    <section class="cf {{ $cpadding }} {{ $cscale }} {{ $calign }} center measure-wide lh-copy {{ $ccolor }}">
       {{- .Content -}}
     </section>
     <section class="flex-ns flex-wrap justify-around mt5">

layouts/_default/single.html

@@ -47,7 +47,12 @@
         <span class="f6 mv4 dib tracked"> - {{ i18n "wordCount" .WordCount }} </span>
       {{ end }}
     </header>
-    <div class="nested-copy-line-height lh-copy {{ $.Param "post_content_classes"  | default "serif"}} f4 nested-links nested-img mid-gray pr4-l w-two-thirds-l">
+    {{ $cclasses := $.Param "post_content_classes"  | default "serif" }}
+    {{ $cpadding := $.Param "post_padding" | default ($.Param "default_padding") }}  
+    {{ $cscale := $.Param "post_scale" | default ($.Param "default_scale") | default "f4" }}  
+    {{ $calign := $.Param "post_align" | default ($.Param "default_align") }}  
+    {{ $ccolor := $.Param "post_color" | default ($.Param "default_color") | default "mid-gray" }}
+    <div class="nested-copy-line-height lh-copy {{ $cclasses }} {{ $cpadding }} {{ $cscale }} {{ $calign }} nested-links nested-img {{ $ccolor }} pr4-l w-two-thirds-l">
       {{- .Content -}}
       {{- partial "tags.html" . -}}
       <div class="mt6 instapaper_ignoref">

layouts/_default/terms.html

@@ -1,7 +1,11 @@
 {{ define "main" }}
     {{ $data := .Data }}
   <article class="cf pa3 pa4-m pa4-l">
-    <div class="measure-wide-l center f4 lh-copy nested-copy-line-height nested-links nested-img mid-gray">
+    {{ $cpadding := $.Param "terms_padding" | default ($.Param "default_padding") }}  
+    {{ $cscale := $.Param "terms_scale" | default ($.Param "default_scale") | default "f4" }}  
+    {{ $calign := $.Param "terms_align" | default ($.Param "default_align") }}  
+    {{ $ccolor := $.Param "terms_color" | default ($.Param "default_color") | default "mid-gray" }}
+    <div class="measure-wide-l center {{ $cpadding }} {{ $cscale }} {{ $calign }} lh-copy nested-copy-line-height nested-links nested-img {{ $ccolor }}">
       {{ .Content }}
     </div>
   </article>

layouts/index.html

@@ -1,6 +1,9 @@
 {{ define "main" }}
-
+  {{ $cpadding := $.Param "home_padding" | default ($.Param "default_padding") | default "ph3 ph5-l pv3 pv4-l" }}  
-  <article class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
+  {{ $cscale := $.Param "home_scale" | default ($.Param "default_scale") | default "f4" }}  
+  {{ $calign := $.Param "home_align" | default ($.Param "default_align") | default "tc-l" }}  
+  {{ $ccolor := $.Param "home_color" | default ($.Param "default_color") | default "mid-gray" }}
+  <article class="cf {{ $cpadding }} {{ $cscale }} {{ $calign }} center measure-wide lh-copy {{ $ccolor }}">
     {{ .Content }}
   </article>
   {{/* Define a section to pull recent posts from. For Hugo 0.20 this will default to the section with the most number of pages. */}}

layouts/page/single.html

@@ -10,7 +10,11 @@
           {{ .Title }}
         </h1>
       </header>
-      <div class="nested-copy-line-height lh-copy f4 nested-links nested-img mid-gray">
+      {{ $cpadding := $.Param "page_padding" | default ($.Param "default_padding") }}  
+      {{ $cscale := $.Param "page_scale" | default ($.Param "default_scale") | default "f4" }}  
+      {{ $calign := $.Param "page_align" | default ($.Param "default_align") }}  
+      {{ $ccolor := $.Param "page_color" | default ($.Param "default_color") | default "mid-gray" }}
+      <div class="nested-copy-line-height lh-copy {{ $cpadding }} {{ $cscale }} {{ $calign }} nested-links nested-img {{ $ccolor }}">
         {{ .Content }}
       </div>
     </article>

layouts/post/list.html

@@ -3,7 +3,11 @@
   This template is the same as the default and is here to demonstrate that if you have a content directory called "post" you can create a layouts directory, just for that section.
    */}}
   <article class="pa3 pa4-ns nested-copy-line-height nested-img">
-    <section class="cf ph3 ph5-l pv3 pv4-l f4 tc-l center measure-wide lh-copy mid-gray">
+    {{ $cpadding := $.Param "list_padding" | default ($.Param "default_padding") | default "ph3 ph5-l pv3 pv4-l" }}  
+    {{ $cscale := $.Param "list_scale" | default ($.Param "default_scale") | default "f4" }}  
+    {{ $calign := $.Param "list_align" | default ($.Param "default_align") | default "tc-l" }}  
+    {{ $ccolor := $.Param "list_color" | default ($.Param "default_color") | default "mid-gray" }}
+    <section class="cf {{ $cpadding }} {{ $cscale }} {{ $calign }} center measure-wide lh-copy {{ $ccolor }}">
       {{ .Content }}
     </section>
     <aside class="flex-ns flex-wrap justify-around mt5">