$-- head.html
$-- This file should go directly inside and existing `head` element
$--------------------------------------------------------------------
$-- charset (utf-8 please)
$-- must be defined early in the document (within first 1024 bytes)
$-- https://www.w3.org/TR/2012/CR-html5-20121217/document-metadata.html#charset
<meta charset="utf-8" />

$-- generator
$-- credit to John MacFarlane's wonderful software
$-- and of course GNU make
<!--
  This html file is generated using a template adaptation after pandoc-markdown-css-theme
  https://github.com/jez/pandoc-markdown-css-theme
-->
<!-- pandoc - https://pandoc.org -->
<!-- gnu make - https://www.gnu.org/software/make/ -->
<!-- pandoc-markdown-css-theme - https://github.com/jez/pandoc-markdown-css-theme -->
<meta name="generator" content="pandoc, GNU make, pandoc-markdown-css-theme" />

$-- viewport
$-- https://developer.mozilla.org/fr/docs/Web/HTML/Viewport_meta_tag
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />

$--------------------------------------------------------------------
$-- Metadata
$-- For `title`, `author` and `description`, pandoc automatically 
$-- sets the matching variables suffixed with `-meta`.
$-- https://pandoc.org/MANUAL.html#metadata-variables
$--------------------------------------------------------------------
$-- page title
$--------------------------------------------------------------------
<title>${if(title-prefix)}${title-prefix} – ${endif}${pagetitle}</title>

$-- author
$-- this site is designed to accomodate for a *single* author
$-- and expects an object (`author.first`, `author.last`, ...)
$--------------------------------------------------------------------
${if(author)}
<meta name="author" content="${author.full}" />
${endif}

$-- description
$--------------------------------------------------------------------
${if(description-meta)}
<meta name="description" content="${description-meta}" />
${endif}

$-- date
$--------------------------------------------------------------------
${if(date-meta)}
<meta name="dcterms.date" content="${date-meta}" />
${elseif(date)}
<meta name="dcterms.date" content="${date}" />
${endif}

$-- keywords
$-- (note that keywords listed here have little if no impact on SEO)
$--------------------------------------------------------------------
${if(keywords)}
<meta name="keywords" content="${for(keywords)}${keywords}${sep}, ${endfor}" />
${endif}

<!-- Styles -->
$-- additional stylesheets may be defined through the `css` prop
$-- in theme.yml
$--------------------------------------------------------------------
$-- @todo : mettre dans component et CSS BEM
<style>
  div.sitenav { display: flex; flex-direction: row; flex-wrap: wrap; }
  span.navlink { flex: 1; }
  span.navlink-right { margin-left: auto; }
  span.navlink-label { display: inline-block; min-width: 4em; }
</style>

${for(css)}
<link rel="stylesheet" href="${css}" />
${endfor}

$-- scripts
$-- additional scripts may be defined through the `js` prop
$-- in theme.yml
<!-- Scripts -->
${for(js)}
<script src="${js}"></script>
${endfor}
<!-- Hypothesis tool bar -->
<script src="https://hypothes.is/embed.js" async></script>

$-- favicon
$-- If the favicon is set, reference it; otherwise, resort to a small
$-- transparent Gif, which avoids a useless request to the server
$-- (and therefore avoids such error in the console).
$--------------------------------------------------------------------
${if(favicon)}
<link rel="icon" href="${favicon}">
${else}
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
${endif}

$-- math
$--------------------------------------------------------------------
${if(math)}
${if(mathjax)}
$-- beware, this script is loaded externally (through a CDN)
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
${endif}
${math}
${endif}