ba53f89965
Google [Typograms](https://github.com/google/typograms/) is a lightweight image format (text/typogram) useful for defining simple diagrams in technical documentation.   --------- Signed-off-by: George Araujo <george.gcac@gmail.com>
24 lines
980 B
Plaintext
24 lines
980 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.onreadystatechange = () => {
|
|
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 %}
|