mirror of https://github.com/status-im/codimd.git
ToC: Some HTML improvements and style fixes
The ToC generated broken HTML with unclosed `<li>` tags. This got fixed as well as some minor optimisation and adding list elements for the subentries so the elements appear in the ToC while scrolling. Signed-off-by: Sheogorath <sheogorath@shivering-isles.com>
This commit is contained in:
parent
cf934a4e51
commit
df05bff82a
|
@ -93,6 +93,10 @@
|
|||
color: #777;
|
||||
}
|
||||
|
||||
.toc .invisable-node {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
.ui-toc {
|
||||
position: fixed;
|
||||
bottom: 20px;
|
||||
|
|
|
@ -52,18 +52,17 @@
|
|||
titleNames = this._elTitlesNames
|
||||
ulClass = this.ulClass
|
||||
}
|
||||
var titleElementsLen = titleElements.length
|
||||
// No need to do anything for an empty ToC
|
||||
if (!titleElementsLen) return
|
||||
if (!titleElements.length) return
|
||||
|
||||
this.tocContent = ''
|
||||
var content = '<ul'
|
||||
if (ulClass) {
|
||||
content += ' class="' + ulClass + '"'
|
||||
}
|
||||
content += '>'
|
||||
content += '>\n'
|
||||
var iterTag = titleNames[level]
|
||||
var recurse = false
|
||||
var openTag = false
|
||||
|
||||
for (var element; element = titleElements.shift();) {
|
||||
var elementTag = element.tagName.toLowerCase()
|
||||
|
@ -80,13 +79,21 @@
|
|||
} else {
|
||||
id = '#' + id
|
||||
}
|
||||
if (openTag) {
|
||||
content += '</li>\n'
|
||||
openTag = false
|
||||
}
|
||||
content += '<li><a href="' + id + '" title="'+ elementTitle +'">' + elementText + '</a>'
|
||||
// Reset recursion. We need it for the next subsections
|
||||
recurse = false
|
||||
|
||||
openTag = true
|
||||
// Check if the current element has a lower level than ours, if so, we have to go down the rabbithole!
|
||||
} else if (!recurse && titleNames.indexOf(elementTag.toLowerCase()) > level) {
|
||||
recurse = true
|
||||
if (!openTag) {
|
||||
content += '<li class="invisable-node">'
|
||||
openTag = true
|
||||
}
|
||||
// This element is for the lower lever, we have to re-add it before we send the list down there.
|
||||
titleElements.unshift(element)
|
||||
// Let's call ourself and get to the next level
|
||||
|
@ -99,7 +106,10 @@
|
|||
}
|
||||
}
|
||||
|
||||
content += '</ul>'
|
||||
if (openTag) {
|
||||
content += '</li>\n'
|
||||
}
|
||||
content += '</ul>\n'
|
||||
|
||||
// Set ToC content of the level 0 everything else pass things to the upper level!
|
||||
if (level === 0) {
|
||||
|
|
Loading…
Reference in New Issue