kenkeiras/new-codigoparallevar
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add base table-of-contents, don't collapse headlines.

Browse Source
This commit is contained in:
Sergio Martínez Portela 2022-11-29 00:20:31 +01:00
parent 58bb7ccc49
commit e268734a3f
2 changed files with 64 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
scripts/generate.py
View File

@ -620,7 +620,28 @@ def render_as_document(headline, doc, headlineLevel, graph, title):
</html>
"""
else:
return as_document(render(headline, doc, graph=graph, headlineLevel=headlineLevel), title)
return as_document(render(headline, doc, graph=graph, headlineLevel=headlineLevel), title, render_toc(doc))
def render_toc(doc):
acc = ['<ul>']
for headline in doc.getTopHeadlines():
render_toc_headline(headline, acc)
acc.append('</ul>')
return ''.join(acc)
def render_toc_headline(headline, acc):
acc.append('<li>')
acc.append(f'<a href="#{headline.id}">{html.escape(headline.title.get_text())}</a>')
children = list(headline.children)
if children:
acc.append('<ul>')
for child in children:
render_toc_headline(child, acc)
acc.append('</ul>')
acc.append('</li>')
def render_connections(headline_id, content, graph):
if headline_id not in graph['backlinks']:
@ -665,13 +686,13 @@ def render(headline, doc, graph, headlineLevel):
tags = f'<span class="tags">{"".join(tag_list)}</span>'
display_state = 'expanded'
# Update display based on document STARTUP config
visual_level = doc.get_keywords('STARTUP', 'showall')
if visual_level.startswith('show') and visual_level.endswith('levels'):
visual_level_num = int(visual_level[len('show'):-len('levels')]) - 1
# Note that level is 0 indexed inside this loop
if headlineLevel >= visual_level_num:
display_state = 'collapsed'
# # Update display based on document STARTUP config
# visual_level = doc.get_keywords('STARTUP', 'showall')
# if visual_level.startswith('show') and visual_level.endswith('levels'):
# visual_level_num = int(visual_level[len('show'):-len('levels')]) - 1
# # Note that level is 0 indexed inside this loop
# if headlineLevel >= visual_level_num:
# display_state = 'collapsed'
title = render_inline(headline.title, render_tag, headline, graph)
@ -692,7 +713,7 @@ def render(headline, doc, graph, headlineLevel):
"""
def as_document(html, title):
def as_document(html, title, global_toc):
return f"""<!DOCTYPE html>
<html>
<head>
@ -719,6 +740,10 @@ def as_document(html, title):
<h1><a href="./index.html">Código para llevar [Notes]</a></h1>
<input type="text" id="searchbox" disabled="true" placeholder="Search (requires JS)" />
</nav>
<div class="global-table-of-contents">
<h2>Table of contents</h2>
{global_toc}
</div>
{html}
<script src="../static/search-box.js"></script>

43
static/style.css
View File

@ -149,7 +149,8 @@ body nav input {
}
/* Item list */
.node .contents ul {
.node .contents ul,
.global-table-of-contents ul {
--tree-spacing : 1rem;
--tree-radius : 0.75ex;
--tree-line-separation: 0.5rem;
@ -158,12 +159,14 @@ body nav input {
list-style: none;
}
.node .contents ul li {
.node .contents ul li,
.global-table-of-contents ul li{
position: relative;
padding-left: calc(var(--tree-spacing) * 2);
}
.node .contents ul li::after {
.node .contents ul li::after,
.global-table-of-contents ul li::after {
content: '';
display: block;
position: absolute;
@ -175,7 +178,8 @@ body nav input {
background: var(--tree-color);
}
.node .contents ul li::before {
.node .contents ul li::before,
.global-table-of-contents ul li::before {
content: ' ';
width: var(--tree-spacing);
display: inline-block;
@ -186,26 +190,36 @@ body nav input {
}
/* Nested item list */
.node .contents ul ul {
.node .contents ul ul,
.global-table-of-contents ul ul {
padding: 0;
margin-left: calc(var(--tree-spacing));
list-style: none;
}
.node .contents ul ul li {
.node .contents ul > li > ul,
.global-table-of-contents ul > li > ul {
margin-left: calc(0px - var(--tree-spacing));
}
.node .contents ul ul li,
.global-table-of-contents ul ul li {
margin-left: calc(0px - var(--tree-radius) / 2 + 2px);
border-left: 2px solid var(--tree-color);
}
.node .contents ul ul li::marker {
.node .contents ul ul li::marker,
.global-table-of-contents ul ul li::marker {
content: '';
}
.node .contents ul ul li::after {
.node .contents ul ul li::after,
.global-table-of-contents ul ul li::after {
left: calc(var(--tree-spacing) * 2 - 0.5ex);
}
.node .contents ul ul li::before {
.node .contents ul ul li::before,
.global-table-of-contents ul ul li::before {
width: calc(var(--tree-spacing) * 2);
height: calc(var(--tree-spacing) + 5px);
margin-top: -100%;
@ -215,11 +229,13 @@ body nav input {
border-bottom-style: solid;
}
.node .contents ul ul li:last-of-type::before {
.node .contents ul ul li:last-of-type::before,
.global-table-of-contents ul ul li:last-of-type::before {
border-bottom-left-radius: var(--tree-border-radius);
}
.node .contents ul li:last-of-type {
.node .contents ul li:last-of-type,
.global-table-of-contents ul li:last-of-type {
border-color: transparent;
}
@ -533,8 +549,9 @@ tr.__table-separator {
border: 1px solid rgba(255,255,255,0.5);
}
.node .contents ul {
--tree-color: #666;
.node .contents ul,
.global-table-of-contents ul {
--tree-color: #aaa;
}
/* Tables. */