new_site/_includes/scripts/typograms.liquid

24 lines
997 B
Plaintext

{% if page.typograms %}
<script src="{{ '/assets/js/typograms.js' | relative_url | bust_file_cache }}"></script>
<script>
/* Create typogram as another node and hide the code block, appending the typogram node after it
this is done to enable retrieving the code again when changing theme between light/dark */
document.addEventListener('readystatechange', () => {
if (document.readyState === 'complete') {
document.querySelectorAll('pre>code.language-typograms').forEach((elem) => {
const texData = elem.textContent;
const parent = elem.parentElement.parentElement;
/* create typograms node */
let typogram = document.createElement('pre');
typogram.classList.add('typogram');
const svg = create('\n' + texData, 0.3, false);
typogram.appendChild(svg);
parent.appendChild(typogram);
parent.removeChild(elem.parentElement);
});
}
});
</script>
{% endif %}