-
Notifications
You must be signed in to change notification settings - Fork 138
Tocbot
beckorz edited this page Apr 23, 2024
·
1 revision
let g:previm_extra_libraries = [
\ {
\ 'name': 'tocbot',
\ 'files': [
\ {
\ 'type': 'css',
\ 'path': '_/css/extra/tocbot.css',
\ 'url': 'https://raw.githubusercontent.com/tscanlin/tocbot/master/dist/tocbot.css',
\ },
\ {
\ 'type': 'css',
\ 'style': [
\ '@media print {',
\ ' #js-toc { display:none; }',
\ '}',
\ '@media (max-width: 767px) {',
\ ' #js-toc {',
\ ' position: relative;',
\ ' width: 100%;',
\ ' margin: 0px 0px 20px 20px;',
\ ' }',
\ '}',
\ '.toc-list {',
\ ' overflow: hidden;',
\ ' position: relative;',
\ '}',
\ 'li.toc-list-item {',
\ ' list-style: none;',
\ '}',
\ '.js-toc {',
\ ' margin-left: 70%;',
\ ' width: 25%;',
\ ' min-width: 250px;',
\ ' right: 20px;',
\ ' max-height: 90%;',
\ ' overflow-y: auto !important;',
\ ' background-color: rgba(255, 255, 255, .5);',
\ ' box-shadow: 0 0 5px #c8c8c8;',
\ ' border: 1px solid #ccc;',
\ ' webkit-border-radius: 6px;',
\ ' moz-border-radius: 6px;',
\ ' border-radius: 6px;',
\ ' position: fixed;',
\ ' display: block;',
\ ' z-index: 1;',
\ ' transform: translateX(0);',
\ '}',
\ 'a.toc-link {',
\ ' text-decoration: none;',
\ '}',
\ ],
\ },
\ {
\ 'type': 'js',
\ 'path': '_/js/extra/tocbot.min.js',
\ 'url': 'https://raw.githubusercontent.com/tscanlin/tocbot/master/dist/tocbot.min.js',
\ 'init': [
\ '// Insert toc',
\ 'if (!document.getElementById(''js-toc'')) {',
\ ' var elm_preview = document.getElementById(''preview'');',
\ ' var toc = ''<nav id="js-toc" class="js-toc"></nav>'';',
\ ' elm_preview.insertAdjacentHTML(''beforebegin'', toc);',
\ ' tocbot.init({',
\ ' // Where to render the table of contents.',
\ ' tocSelector: ''.js-toc'',',
\ ' // Where to grab the headings to build the table of contents.',
\ ' contentSelector: ''#preview'',',
\ ' // Which headings to grab inside of the contentSelector element.',
\ ' headingSelector: ''h2, h3, h4, h5'',',
\ ' // For headings inside relative or absolute positioned containers within content.',
\ ' hasInnerContainers: true,',
\ ' });',
\ '}',
\ ],
\ 'code': [
\ 'tocbot.refresh();',
\ ],
\ },
\ ],
\ },
\]