{% extends "base.html" %}

{% block content %}
{% if page.nb_url %}
    <a href="{{ page.nb_url }}" title="Download Notebook" class="md-content__button md-icon">
        {% include ".icons/material/download.svg" %}
    </a>
{% endif %}

{{ super() }}

<style>
.jupyter-wrapper .jp-InputArea-prompt, .jupyter-wrapper .jp-OutputArea-prompt {
    display: none !important;
}
.zeroclipboard-container {
    display: none;
}
</style>

<script>
// Render mkdocs-jupyter code cells like mkdocs-material code cells: to do this,
// we add the md-typeset class to the parent div, and wrap the code in a <code>
// block. We also make some other tweaks to make the styles close to matching.
document.addEventListener('DOMContentLoaded', function() {
    document.querySelectorAll('.jp-InputArea-editor').forEach(function(div) {
        div.classList.add('md-typeset')
    })
    document.querySelectorAll('.jp-InputArea-editor pre').forEach(function(pre) {
        if (!pre.querySelector('code')) {
            pre.innerHTML = '<code>' + pre.innerHTML + '</code>'
            pre.style = "padding: 0; font-size: 1.2em;"
        }
    })
})
</script>

{% endblock content %}
