<!DOCTYPE html>
<html lang="{{ DEFAULT_LANG }}">
<head>
    {% block head %}
    <title>{% block title %}{{ SITENAME }}{% endblock title %}</title>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1">

    {% if article %}
    <meta property="og:type" content="article" />
    <meta property="og:url" content="{{ SITEURL }}/{{ article.url }}" />
    <meta property="og:title" content="{{ article.title | replace("\"", "&quot;") }}" />
    <meta property="og:description" content="{{ article.content | striptags | replace("\"", "&quot;") | truncate(196, False, '...') }}" />
    {% elif page %}
    <meta property="og:type" content="website" />
    <meta property="og:url" content="{{ SITEURL }}/{{ page.url }}" />
    <meta property="og:title" content="{{ SITENAME }} - {{ page.title | replace("\"", "&quot;") }}" />
    <meta property="og:description" content="{{ page.content | striptags | replace("\"", "&quot;") | truncate(196, False, '...') }}" />
    {% else %}
    <meta property="og:type" content="website" />
    <meta property="og:url" content="{{ SITEURL }}/{{ output_file }}" />
    <meta property="og:title" content="{{ SITENAME }}" />
    <meta property="og:description" content="A page on Liz Denys's personal site" />
    {% endif %}

    {% if FEED_ALL_ATOM %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Full Atom Feed" />
    {% endif %}
    {% if FEED_ALL_RSS %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ALL_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Full RSS Feed" />
    {% endif %}
    {% if FEED_ATOM %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Atom Feed" />
    {% endif %}
    {% if FEED_RSS %}
    <link href="{{ FEED_DOMAIN }}/{{ FEED_RSS }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} RSS Feed" />
    {% endif %}
    {% if CATEGORY_FEED_ATOM and category %}
    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_ATOM }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Categories Atom Feed" />
    {% endif %}
    {% if CATEGORY_FEED_RSS and category %}
    <link href="{{ FEED_DOMAIN }}/{{ CATEGORY_FEED_RSS|format(category.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Categories RSS Feed" />
    {% endif %}
    {% if TAG_FEED_ATOM and tag %}
    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_ATOM|format(tag.slug) }}" type="application/atom+xml" rel="alternate" title="{{ SITENAME }} Tags Atom Feed" />
    {% endif %}
    {% if TAG_FEED_RSS and tag %}
    <link href="{{ FEED_DOMAIN }}/{{ TAG_FEED_RSS|format(tag.slug) }}" type="application/rss+xml" rel="alternate" title="{{ SITENAME }} Tags RSS Feed" />
    {% endif %}
    {% endblock head %}

    <link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
    <link rel="manifest" href="/site.webmanifest">
    <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
    <meta name="msapplication-TileColor" content="#2b5797">
    <meta name="theme-color" content="#ffffff">

    {% if GOOGLE_ANALYTICS_ID %}
    <script>
    (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
    })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
    ga('create', '{{ GOOGLE_ANALYTICS_ID }}', 'auto');
    ga('send', 'pageview');
    </script>
    {% endif %}


    {% if GOOGLE_TAG_ID %}
    <script async src="https://www.googletagmanager.com/gtag/js?id={{ GOOGLE_TAG_ID }}"></script>
    <script>
      window.dataLayer = window.dataLayer || [];
      function gtag(){dataLayer.push(arguments);}
      gtag('js', new Date());
      gtag('config', '{{ GOOGLE_TAG_ID }}');
    </script>
    {% endif %}

    {% if GOOGLE_ADSENSE_ID %}
    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client={{ GOOGLE_ADSENSE_ID }}"
            crossorigin="anonymous"></script>
    {% endif %}



    <link rel="stylesheet" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/awsm.css" />

    {% assets filters="sass,cssmin", output="css/common.min.css", "css/common.scss" %}
        <link rel="stylesheet" href="{{ SITEURL }}/{{ ASSET_URL }}">
    {% endassets %}

    {% if LOCAL_SCSS %}
    {% assets filters="sass,cssmin", output="css/style.min.css", "css/style.scss" %}
        <link rel="stylesheet" href="{{ SITEURL }}/{{ ASSET_URL }}">
    {% endassets %}
    {% endif %}

    {% block extra_head %}
    {% endblock extra_head %}

</head>

<body>
    <header>
        <h1><a href="{{ SITEURL }}/">{{ SITENAME }}</a></h1>
        <nav>
            <ul>
            {% for title, link in MENUITEMS_START %}
                <li><a href="{{ link }}">{{ title }}</a></li>
            {% endfor %}
            {% if DISPLAY_PAGES_ON_MENU %}
              {% for p in pages %}
                {% if p.menu %}
                <li{% if p == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url }}">{{ p.menu_title or p.title }}</a></li>
                {% endif %}
              {% endfor %}
            {% else %}
              {% if DISPLAY_CATEGORIES_ON_MENU %}
                {% for cat, null in categories %}
                  <li{% if cat == category %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ cat.url }}">{{ cat }}</a></li>
                {% endfor %}
              {% endif %}
            {% endif %}
            {% for title, link in MENUITEMS_END %}
                <li><a href="{{ link }}" target="_blank">{{ title }}</a></li>
            {% endfor %}
            </ul>
        </nav>
    </header>
    {% block precontent %}
    {% endblock %}
	<main>
        {% block content_title %}
        {% endblock %}
        {% block content %}
        {% endblock %}
	</main>

<script type="text/javascript">
const copyButtonLabel = "Copy";

let blocks = document.querySelectorAll("pre");

blocks.forEach((block) => {
  // only add button if browser supports Clipboard API
  if (navigator.clipboard) {
    let button = document.createElement("button");

    button.innerText = copyButtonLabel;
    block.appendChild(button);

    button.addEventListener("click", async () => {
      await copyCode(block, button);
    });
  }
});

async function copyCode(block, button) {
  let code = block.querySelector("code");
  let text = code.innerText;

  await navigator.clipboard.writeText(text);

  // visual feedback that task is completed
  button.innerText = "Copied";

  setTimeout(() => {
    button.innerText = copyButtonLabel;
  }, 2000);
}
</script>
</body>
</html>
