Skip to content

Commit 07d0220

Browse files
committed
Upgrade to Tocbot 4.35.3 and simplify setup
Previously, the "On this page" table of contents would contain a server-side rendered table of contents generated by the Jekyll AsciiDoc plugin but this was always set to be hidden (even to screen readers). We would then replace this element with the client-side rendered table of contents generated by Tocbot. The latter is only visible on screens wider than 1460px so there is no need for us to have logic to refresh the Tocbot whenever the window is resized under 768px (as it will be hidden anyway). We override the default throttle timeout of 50ms to be 500ms which will make the currently focussed section slightly slower to update but will reduce the number of times the table of contents is refreshed when scrolling.
1 parent 59a0905 commit 07d0220

File tree

7 files changed

+13
-1255
lines changed

7 files changed

+13
-1255
lines changed

jekyll-assets/_includes/head.html

-2
Original file line numberDiff line numberDiff line change
@@ -21,8 +21,6 @@
2121
<link rel="stylesheet" href="{{ site.baseurl }}/css/asciidoctor-tabs.css?ver={{ site.time | date: '%s' }}">
2222
<link rel="stylesheet" href="{{ site.baseurl }}/css/syntax-highlighting.css?ver={{ site.time | date: '%s' }}">
2323
<link rel="stylesheet" href="{{ site.baseurl }}/css/tocbot.css?ver={{ site.time | date: '%s' }}">
24-
<script type="text/javascript" src="{{ site.baseurl }}/scripts/tocbot.js?ver={{ site.time | date: '%s' }}"></script>
25-
<script type="text/javascript" src="{{ site.baseurl }}/scripts/toc.js?ver={{ site.time | date: '%s' }}"></script>
2624
<script async src="https://www.googletagmanager.com/gtag/js?id=G-V8TFXM3BKJ"></script>
2725
<script>
2826
window.dataLayer = window.dataLayer || [];

jekyll-assets/_layouts/boxes.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
{% include head.html %}
55
</head>
6-
<body onload="makeToc()">
6+
<body>
77
{% include header.html %}
88

99
<div class="toptitle">

jekyll-assets/_layouts/docs.html

+11-6
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
{% include head.html %}
55
</head>
6-
<body onload="makeToc()">
6+
<body>
77
<input type="checkbox" id="mobile-toggle" />
88
{% include header.html %}
99
<div id="docs-content">
@@ -162,11 +162,7 @@ <h1>{{ page.sub_title | markdownify | remove: '<p>' | remove: '</p>'}}</h1>
162162
<div id="on-this-page">
163163
<div id="on-this-page-inner">
164164
<h5>On this page</h5>
165-
<div id="toc">
166-
{{ page.document | tocify_asciidoc: 3 }}
167-
</div>
168-
<div id="tocbot">
169-
</div>
165+
<div id="tocbot" class="js-toc"></div>
170166
</div>
171167
</div>
172168
</div>
@@ -178,6 +174,15 @@ <h5>On this page</h5>
178174
<script async type="text/javascript" src="{{ site.baseurl }}/scripts/asciidoctor-tabs.js?ver={{ site.time | date: '%s' }}"></script>
179175
<script async type="text/javascript" src="{{ site.baseurl }}/scripts/clipboard.min.js?ver={{ site.time | date: '%s' }}"></script>
180176
<script async type="text/javascript" src="{{ site.baseurl }}/scripts/copy-to-clipboard.js?ver={{ site.time | date: '%s' }}"></script>
177+
<script type="text/javascript" src="{{ site.baseurl }}/scripts/tocbot.min.js?ver={{ site.time | date: '%s' }}"></script>
178+
<script>
179+
tocbot.init({
180+
contentSelector: '#content',
181+
headingSelector: 'h1, h2, h3, h4',
182+
includeHtml: true,
183+
throttleTimeout: 500
184+
});
185+
</script>
181186

182187
{% include search.html %}
183188
</div>

jekyll-assets/css/style.css

-5
Original file line numberDiff line numberDiff line change
@@ -368,11 +368,6 @@ input:checked + li span label div .toc-item::before {
368368
margin-bottom: 6px;
369369
}
370370

371-
/* hide the non-tocbot non-interactive toctree from view -- just needed to generate tocbot version */
372-
#on-this-page-inner #toc {
373-
display: none;
374-
}
375-
376371
.sectlevel1 {
377372
flex-grow: 0;
378373
margin-right: 10px;

jekyll-assets/scripts/toc.js

-36
This file was deleted.

0 commit comments

Comments
 (0)