blob: ccd21a69e4e1176f909410a9ce35d5e129f4b6ed (
plain) (
blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
|
{% extends "base.html" %}
{% block title %}{{ page.title }} - {{ config.title }}{% endblock title %}
{% block content -%}
<div class="note-container">
<main role="main" class="note-content">
<h1>{{ page.title }}</h1>
{% if page.toc %}
<div class="toc-container mobile-toc">
<div class="toc-header" id="mobile-toc-toggle">
<span class="toc-arrow">▸</span> Table of Contents
</div>
<div id="mobile-toc" class="toc">
<ul>
{% for h1 in page.toc %}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{% if h1.children %}
<ul>
{% for h2 in h1.children %}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
</div>
{% endif %}
{{ page.content | safe }}
<p class="date">{{ page.date | date(format="%B %d, %Y") }}</p>
</main>
{% if page.toc %}
<aside class="toc-container desktop-toc">
<div class="toc-header">Table of Contents</div>
<div class="toc">
<ul>
{% for h1 in page.toc %}
<li>
<a href="{{ h1.permalink | safe }}">{{ h1.title }}</a>
{% if h1.children %}
<ul>
{% for h2 in h1.children %}
<li>
<a href="{{ h2.permalink | safe }}">{{ h2.title }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
</div>
</aside>
{% endif %}
</div>
<script>
document.getElementById('mobile-toc-toggle').addEventListener('click', function() {
var toc = document.getElementById('mobile-toc');
var arrow = this.querySelector('.toc-arrow');
if (toc.style.display === 'none' || toc.style.display === '') {
toc.style.display = 'block';
arrow.innerHTML = '▾'; // Down-pointing triangle
} else {
toc.style.display = 'none';
arrow.innerHTML = '▸'; // Right-pointing triangle
}
});
</script>
{%- endblock content %}
|