pbarriat
/
learning-markdown


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207
							<!DOCTYPE html>
<html$if(lang)$ lang="$lang$" $endif$>

  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
    <meta name="generator" content="pandoc">

    $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;
      }
    </style>

    $if(quotes)$
    <style type="text/css">
      q {
        quotes: "“""”""‘""’";
      }
    </style>
    $endif$

    $if(highlighting-css)$
    <style type="text/css">
      $highlighting-css$
    </style>
    $endif$

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

    $if(math)$
    $if(mathjax)$
    $-- MathJax is handled specially. We need to add the data-external attribute
    $-- so it doesn't get inlined (and thus broken) by the --self-contained option.
    <script type="text/javascript" id="MathJax-script" async
      src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js">
      </script>
    <script type="text/x-mathjax-config">
      MathJax.Ajax.config.path["mhchem"] = "https://cdnjs.cloudflare.com/ajax/libs/mathjax-mhchem/3.3.2";
      MathJax.Hub.Config({
        TeX: {
          extensions: ["[mhchem]/mhchem.js"]
        }
      });
    </script>
    $else$
    $math$
    $endif$
    $endif$

    $for(header-includes)$
    $header-includes$
    $endfor$

  </head>

  <body>
    <div class="wrapper">

      $if(project)$
      <header>
        <div class="navbar-left">
          <input type="checkbox" id="navbar-check">
          <label for="navbar-check" class="navbar-hamburger">☰</label>
          <div class="navbar-items">
            <h1 class="header">$title$</h1>
            <a class="button" href="manuscript.pdf">Download PDF</a>
            <a class="button" href="manuscript-SI.pdf">Download SI PDF</a>

            $if(toc)$
            <nav id="$idprefix$TOC">
              $toc$
            </nav>
            $endif$

          </div>
        </div>
      </header>
      $endif$

      <div class="container">
        <article typeof="ScholarlyArticle" vocab="http://schema.org/">

          <h1 property="headline">$title$</h1>
          $if(subtitle)$
          <p property="alternativeHeadline" class="subtitle">$subtitle$</p>
          $endif$
          <p class="author-list">
            $for(author)$
            $if(author.last)$ $-- not working!
            and
            $endif$
            <span property="author" typeof="Person">$author.name$</span>
            <sup>
              $if(author.correspondence)$
              $if(author.email)$<a href="mailto:$author.email$">✉</a> $endif$
              $endif$
              $for(author.institute_indices)$
              $author.institute_indices$
              $sep$,
              $endfor$
              $if(author.equal_contributor)$,
              $if(equal_contributor_symbol)$
              $equal_contributor_symbol$
              $else$*
              $endif$
              $endif$
            </sup>$sep$,
            $endfor$
          </p>
          <div class="author-affiliations">
            $for(institute)$
            <div class="affiliation"><sup>$institute.index$</sup>$institute.name$$if(institute.address)$,
              $institute.address$$endif$
            </div>
            $endfor$
          </div>
          <div class="author-info">
            $if(has_equal_contributors)$
            <div class="author-contrib">
              <sup>$if(equal_contributor_symbol)$$equal_contributor_symbol$$else$*$endif$</sup>These authors contributed
              equally to this work
            </div>
            $endif$
            $if(has_correspondence)$
            <div class="author-correspondence">
              Correspondence: $for(author)$$if(author.correspondence)$$if(author.email)$$author.name$ <a
                href="mailto:$author.email$">&lt;$author.email$&gt;</a> $endif$$endif$$endfor$
            </div>
            $endif$
          </div>

          $if(abstract)$
          <span class="abstract" property="description">$abstract$</span>
          $endif$
          $if(doi)$<p><a href="https://doi.org/$doi$">doi: $doi$</a></p>$endif$

          $for(include-before)$
          $include-before$
          $endfor$

          <div property="articleBody" class="article-body">
            $body$
          </div>
        </article>
      </div>
    </div>

  <!--  Image display zoom modal  -->
    <div id="img-modal" class="img-modal" onclick="this.style.display='none'">
      <span class="button">&times;</span>
      <div class="img-modal-content animate-zoom">
        <img id="img-modal-inner" style="width:100%">
      </div>
    </div>

  </body>

  <!--  Small navigation script  -->
  <script>
    window.onhashchange = function () {
      hash = window.location.hash
      let target = document.querySelector(hash)
      target.scrollIntoView({
        behavior: 'smooth',
        block: 'start'
      })
    }
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
      anchor.addEventListener('click', function (e) {
        let hashval = anchor.getAttribute('href')
        let target = document.querySelector(hashval)
        target.scrollIntoView({
          behavior: 'smooth',
          block: 'start'
        })
        history.pushState(null, null, hashval)
        e.preventDefault()
      });
    });
  </script>

  <!--  Image highlight script  -->
  <script>
    function onClickImage(element) {
      document.getElementById("img-modal-inner").src = element.src;
      document.getElementById("img-modal").style.display = "block";
    }
  </script>

  </html>