A more generic tag/value component

Write styles and templates for a more generic tag/value component. Use this component
for the taxonomy lists, draft tag, and page dates in the summary template.

layouts/_default/page_summary.html

@@ -7,7 +7,10 @@
       <div class="page-summary__content">{{ . | markdownify }}</div>
     {{ end }}
   {{- end }}
-  {{ with .Date }}
-    <time class="page-summary__date" datetime="{{ . | time.Format "2006-01-02" }}">{{ . | time.Format ":date_medium" }}</time>
-  {{ end }}
+  {{- if ne hugo.Environment "production" -}}
+    {{ partial "page/taxonomy_draft.html" (dict "page" . "class" "page-summary__draft") }}
+  {{- end -}}
+  {{- if .Date -}}
+    {{- partial "page/date.html" (dict "page" . "class" "page-summary__date") -}}
+  {{- end }}
 </article>

layouts/blog/list.html

@@ -9,9 +9,11 @@
     {{ end -}}
 
     <div class="main--list__page-list">
-      {{ range .Pages.ByDate.Reverse }}
-        {{ .Render "page_summary" }}
-      {{ end }}
+      {{ range .Pages.ByDate.Reverse -}}
+        {{ if or (not .Draft) hugo.IsDevelopment }}
+          {{ .Render "page_summary" }}
+        {{ end }}
+      {{- end }}
     </div>
   </main>
 {{ end }}

layouts/partials/page/date.html

@@ -0,0 +1,25 @@
+{{/*
+
+  Outputs a date tag for a page.
+
+  @context {Page} .page  The current page
+  @context {String} .date  The date, one of "published", or "updated".
+  @context {String} .class  Additional classes to apply to the rendered content.
+
+*/}}
+
+{{- $page := .page -}}
+{{- $dateName := .date -}}
+
+{{- $name := "" -}}
+{{- $date := $page.Date -}}
+
+{{- if or (not $dateName) (eq $dateName "date") }}
+  {{- $name = T "datePublishedName" -}}
+{{- else -}}
+{{ end -}}
+
+<div class="{{ with .class }}{{ . }}  {{ end }}tag">
+  <span class="tag__name">{{ $name }}</span>
+  <span class="tag__value">{{ $date | time.Format "2006-01-02" }}</span>
+</div>

layouts/partials/page/footer.html

@@ -1,2 +1,5 @@
+{{ if or hugo.IsDevelopment .Draft }}
+  {{ partial "page/taxonomy_draft.html" (dict "page" .) }}
+{{ end }}
 {{ partial "page/taxonomy_list.html" (dict "page" . "taxonomy" "categories") }}
 {{ partial "page/taxonomy_list.html" (dict "page" . "taxonomy" "tags") }}

layouts/partials/page/taxonomy_draft.html

@@ -0,0 +1,13 @@
+{{- /*
+  Outputs a DRAFT tag for the page.
+
+  @context {Page} .page  The current page
+  @context {String} .class  A list of additional classes to apply to the top-level element
+
+*/ -}}
+
+{{- $page := .page -}}
+<div class="{{ with .class }}{{ . }}  {{ end }}tag  tag--draft" data-name="draft">
+  <span class="tag__name">{{ T "draft" }}</span>
+  <span class="tag__value">{{ T (cond $page.Draft "draftYes" "draftNo") }}</li>
+</div>

layouts/partials/page/taxonomy_list.html

@@ -13,10 +13,10 @@
   {{- with T $taxonomy (len .) }}
     {{ $name = . }}
   {{ end -}}
-  <div class="taxonomy-list">
-    <span class="taxonomy-list__name">{{ $name }}</span>
-    <ul class="taxonomy-list__terms" data-name="{{ $name }}">
-      {{ range . }}<li><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>{{ end }}
+  <div class="tag">
+    <span class="tag__name">{{ $name }}</span>
+    <ul class="tag__value--list" data-name="{{ $name }}">
+      {{ range . }}<li class="tag__value__list-item"><a href="{{ .RelPermalink }}">{{ .Title }}</a></li>{{ end }}
     </ul>
   </div>
 {{ end }}