garrick
/
bulma


			
				
					
						
						
							
							<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="$lang$" xml:lang="$lang$"$if(dir)$ dir="$dir$"$endif$>
<head>
  <meta charset="utf-8" />
  <meta name="generator" content="pandoc" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" />
$for(author-meta)$
  <meta name="author" content="$author-meta$" />
$endfor$
$if(date-meta)$
  <meta name="dcterms.date" content="$date-meta$" />
$endif$
$if(keywords)$
  <meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" />
$endif$
  <title>$if(title-prefix)$$title-prefix$ – $endif$$pagetitle$</title>
  <style type="text/css">
      code{white-space: pre-wrap;}
      span.smallcaps{font-variant: small-caps;}
      span.underline{text-decoration: underline;}
      div.column{display: inline-block; vertical-align: top; width: 50%;}
$if(quotes)$
      q { quotes: "“" "”" "‘" "’"; }
$endif$
  </style>
$if(highlighting-css)$
  <style type="text/css">
$highlighting-css$
  </style>
$endif$
<style type="text/css" charset="utf-8">
body {
  font-family: "Fira Sans", "Helvetica Neue", Roboto, sans-serif;
}
pre, code {
  font-family: "Fira Mono", "Roboto Mono", monospace;
}
.content table {
  width: auto;
  margin: auto;
}
.tabs-content li {
  display: none;
  list-style: none;
}
.tabs-content li.is-active {
  display: block;
}
#toc-aside {
  position: sticky;
  top: 2em;
  position: -webkit-sticky;
}
</style>
$for(css)$
  <link rel="stylesheet" href="$css$" />
$endfor$
  <!--
  <script defer src="https://use.fontawesome.com/releases/v5.3.1/js/all.js"></script>
  -->
$for(header-includes)$
  $header-includes$
$endfor$
</head>
<body>
<section class="hero$if(bulma.hero)$$for(bulma.hero)$ is-$bulma.hero$$endfor$$else$ is-primary$endif$">
<div class="hero-body">
<div class="container$if(bulma.hero_body)$$for(bulma.hero_body)$ $bulma.hero_body$$endfor$$endif$">
$if(title)$
<h1 class="title is-1 toc-ignore">$title$</h1>
$endif$
$if(subtitle)$
<h2 class="subtitle is-3 toc-ignore"><em>$subtitle$</em></h2>
$endif$
$if(date)$
<h3 class="subtitle is-5 toc-ignore">$date$</h3>
$endif$
$if(bulma.hero_links)$
<div class="buttons">
$for(bulma.hero_links)$
<a class="button$if(bulma.hero_button)$$for(bulma.hero_button)$ is-$bulma.hero_button$$endfor$$else$is-primary is-inverted is-outlined$endif$" href="$bulma.hero_links.url$">
$if(bulma.hero_links.icon)$
<span class="icon is-small">
  <i class="$bulma.hero_links.icon$"></i>
</span>
$endif$
<span>$bulma.hero_links.name$</span>
</a>
$endfor$
</div>
$endif$ <!-- bulma.hero_links -->
</div>
</div>
</section>

<section class="section">
<div class="container">
  <div class="columns">
    <div class="column $if(toc)$is-three-quarters-desktop is-full-tablet is-full-mobile$else$is-full$endif$">
      <div class="content" id="content-body">
        $if(author)$
        <section class="section" id="authors">
          <div class="content">
            <div class="level">
            $for(author)$
              <div class="level-item has-text-centered">
                <div>
                $if(author.name)$
                  <p class="title is-5">
                    $if(author.url)$
                      <a href="$author.url$">$author.name$</a>
                    $else$
                      $author.name$
                    $endif$
                  </p>
                $endif$
                $if(author.extra)$
                  <p class="subtitle is-6">
                    $for(author.extra)$$author.extra$$sep$<br>$endfor$
                  </p>
                $endif$
                </div>
              </div>
            $endfor$
            </div>
          </div>
        </section>
        $endif$
        $body$
      </div>
    </div>
    <div class="column">
      <aside class="menu" id="toc-aside" data-gumshoe>
        $if(toc)$$table-of-contents$$endif$
      </aside>
    </div>
  </div>
</div>
</section>

$for(include-after)$
$include-after$
$endfor$
<script>
// add bulma table styles to pandoc tables
document.addEventListener("DOMContentLoaded", function(event) {
  var tableClasses = ["table", "is-striped", "is-hoverable"];
  var tables = document.getElementById('content-body').getElementsByTagName("table");
  for (var i = 0; i < tables.length; i++) {
    tables[i].classList.add(...tableClasses);
  }
})
</script>

$if(toc)$
$if(rmarkdown-will-handle-deps)$
$else$
<script src="https://cdnjs.cloudflare.com/ajax/libs/gumshoe/3.5.1/js/gumshoe.min.js"></script>
<script src="https://raw.githubusercontent.com/ederssouza/vanillajs-scrollspy/master/dist/vanillajs-scrollspy.min.js"></script>
$endif$
<script>
gumshoe.init({activeClass: "has-text-weight-semibold"});
const toc = document.querySelector('#toc-aside');
const scrollspy = new VanillaScrollspy(toc, 1000, 'easeInOutQuint');
scrollspy.init();
// Add appropriate TOC classes
document.addEventListener("DOMContentLoaded", function(event) {
  var toc = document.getElementById('toc-aside').getElementsByTagName("ul");
  for (var i = 0; i < toc.length; i++) {
    toc[i].classList.add("menu-list");
  }
})
</script>
$endif$

$if(mathjax-url)$
<!-- dynamically load mathjax for compatibility with self-contained -->
<script>
document.addEventListener("DOMContentLoaded", function(event) {
  var script = document.createElement("script");
  script.type = "text/javascript";
  script.src  = "$mathjax-url$";
  document.getElementsByTagName("head")[0].appendChild(script);
});
</script>
$endif$

</body>
</html>