KEYCLOAK-11799 Add collapse toc

This commit is contained in:
stianst 2019-10-23 15:17:38 +02:00 committed by Stian Thorgersen
parent 230a5aacec
commit c65bb712d9
9 changed files with 81 additions and 16 deletions

View file

@ -1,4 +1,31 @@
<style>
#tocbot a.toc-link.node-name--H1{ font-style: italic }
@media screen{
#tocbot > ul.toc-list{ margin-bottom: 0.5em; margin-left: 0.125em }
#tocbot ul.sectlevel0, #tocbot a.toc-link.node-name--H1 + ul{
padding-left: 0 }
#tocbot a.toc-link{ height:100% }
.is-collapsible{ max-height:3000px; overflow:hidden; }
.is-collapsed{ max-height:0 }
.is-active-link{ font-weight:700 }
}
@media print{
#tocbot a.toc-link.node-name--H4{ display:none }
}
/* Fix scroll to anchor hides title */
h1::before, h2::before, h3::before, h4::before, h5::before, h6::before {
display: block;
content: " ";
height: 70px;
margin-top: -70px;
}
h1 {
border-bottom: none !important
}
/* Global Navbar */
ul#globalnav {
@ -79,9 +106,7 @@ body.toc2 {
}
}
</style>
<style>
/* General Changes */
h1, h2, h3, #toctitle, .sidebarblock>.content>.title, h4, h5, h6 {
@ -154,3 +179,4 @@ span.image img {
padding: 5px;
}
</style>

View file

@ -8,3 +8,41 @@
<li><a href="../upgrading/{masterFile}.html">Upgrading</a></li>
<li><a href="../release_notes/{masterFile}.html">Release Notes</a></li>
</ul>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tocbot/4.4.2/tocbot.js"></script>
<script>
var oldtoc = document.getElementById('toctitle').nextElementSibling;
var newtoc = document.createElement('div');
newtoc.setAttribute('id', 'tocbot');
newtoc.setAttribute('class', 'js-toc');
oldtoc.parentNode.replaceChild(newtoc, oldtoc);
tocbot.init({ contentSelector: '#content',
headingSelector: 'h2, h3, h4',
smoothScroll: false
});
var handleTocOnResize = function() {
var width = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
if (width < 768) {
tocbot.refresh({
contentSelector: '#content',
headingSelector: 'h2, h3, h4',
collapseDepth: 6,
activeLinkClass: 'ignoreactive',
throttleTimeout: 1000,
smoothScroll: false
});
}
else {
tocbot.refresh({
contentSelector: '#content',
headingSelector: 'h2, h3, h4',
smoothScroll: false
});
}
};
window.addEventListener('resize', handleTocOnResize);
handleTocOnResize();
</script>

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,5 +1,6 @@
:toc:
:toclevels: 0
:toc: left
:toclevels: 3
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]

View file

@ -1,6 +1,6 @@
:toc:
:toc: left
:toclevels: 3
:numbered:
:sectanchors:
:linkattrs:
include::topics/templates/document-attributes-community.adoc[]