Reworked auto-tocs. :)
This commit is contained in:
parent
5a3e465a31
commit
d831242767
|
@ -28,6 +28,7 @@ I can *promise* you that there is no malicious code or dependency in this projec
|
||||||
The project depends on the following packages (installed when you ran `npm i`):
|
The project depends on the following packages (installed when you ran `npm i`):
|
||||||
* express (a web server framework)
|
* express (a web server framework)
|
||||||
* nunjucks (a templating engine)
|
* nunjucks (a templating engine)
|
||||||
|
* nunjucks-append (an extension that adds more functionality to nunjucks)
|
||||||
* chokidar (reload templates if they change on disk)
|
* chokidar (reload templates if they change on disk)
|
||||||
* fs (used for filesystem operations)
|
* fs (used for filesystem operations)
|
||||||
|
|
||||||
|
|
|
@ -1,19 +1,9 @@
|
||||||
{% macro header(size, text, tocList) %}
|
{% macro header(size, text) %}
|
||||||
{% set tocList = (tocList.push([size, text]), tocList) %}
|
{% append "toc" %}
|
||||||
<a name="{{ text | replace(" ", "-") }}"></a>
|
<a name="{{ text | replace(" ", "-") }}" class="toc-{{ size }}">{{ text }}</a>
|
||||||
|
{% endappend %}
|
||||||
|
|
||||||
<{{ size }}>
|
<{{ size }}>
|
||||||
{{ text }}
|
{{ text }}
|
||||||
</{{ size }}>
|
</{{ size }}>
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
|
||||||
{% macro generate(tocList) %}
|
|
||||||
<div class="toc-container">
|
|
||||||
<div class="toc">
|
|
||||||
<p class="toc-title">Table of Contents</p>
|
|
||||||
|
|
||||||
{% for size, text in tocList %}
|
|
||||||
<a href="#{{ text | replace(" ", "-") }}" class="toc-{{ size }}">{{ text }}</a>
|
|
||||||
{% endfor %}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
{% endmacro %}
|
|
|
@ -5,8 +5,13 @@
|
||||||
How to - Article template
|
How to - Article template
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block toc %}
|
||||||
|
{% output "toc" %}{% endoutput %}
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
{% block body %}
|
{% block body %}
|
||||||
<div class="content">
|
<div class="content">
|
||||||
|
|
||||||
{{ toc.header("h1", "Introduction", tocList) }}
|
{{ toc.header("h1", "Introduction", tocList) }}
|
||||||
<p>
|
<p>
|
||||||
I want to start off by saying that this article template (as of now) is really fricking shit.
|
I want to start off by saying that this article template (as of now) is really fricking shit.
|
||||||
|
@ -98,5 +103,4 @@
|
||||||
</code>
|
</code>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{{ toc.generate(tocList) }}
|
|
||||||
{% endblock %}
|
{% endblock %}
|
|
@ -8,13 +8,18 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
{% set tocList = [] %}
|
|
||||||
|
|
||||||
<article>
|
<article>
|
||||||
<header>
|
<header>
|
||||||
{% block header %}{% endblock %}
|
{% block header %}{% endblock %}
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
|
<div class="toc-container">
|
||||||
|
<div class="toc">
|
||||||
|
<p class="toc-title">Table of Contents</p>
|
||||||
|
{% block toc %}{% endblock %}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
{% block body %}{% endblock %}
|
{% block body %}{% endblock %}
|
||||||
</article>
|
</article>
|
||||||
</body>
|
</body>
|
||||||
|
|
6
index.js
6
index.js
|
@ -1,5 +1,6 @@
|
||||||
import express from 'express'
|
import express from 'express'
|
||||||
import njk from 'nunjucks'
|
import njk from 'nunjucks'
|
||||||
|
import njkAppend from 'nunjucks-append'
|
||||||
import fs from 'fs'
|
import fs from 'fs'
|
||||||
|
|
||||||
|
|
||||||
|
@ -13,10 +14,10 @@ const Server = express()
|
||||||
|
|
||||||
Server.use('/assets', express.static(Config.assetsDir))
|
Server.use('/assets', express.static(Config.assetsDir))
|
||||||
|
|
||||||
njk.configure(
|
const njkEnv = njk.configure(
|
||||||
Config.contentDir,
|
Config.contentDir,
|
||||||
{
|
{
|
||||||
autoescape: true,
|
autoescape: false,
|
||||||
watch: true,
|
watch: true,
|
||||||
trimBlocks: true,
|
trimBlocks: true,
|
||||||
lstripBlocks: true,
|
lstripBlocks: true,
|
||||||
|
@ -24,6 +25,7 @@ njk.configure(
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
|
njkAppend.initialise(njkEnv)
|
||||||
|
|
||||||
|
|
||||||
Server.get(
|
Server.get(
|
||||||
|
|
|
@ -19,6 +19,7 @@
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"chokidar": "^3.5.2",
|
"chokidar": "^3.5.2",
|
||||||
"express": "^4.17.1",
|
"express": "^4.17.1",
|
||||||
"nunjucks": "^3.2.3"
|
"nunjucks": "^3.2.3",
|
||||||
|
"nunjucks-append": "^0.0.3"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user