Add basic TOC code

This commit is contained in:
Florine W. Dekker 2022-09-19 16:18:17 +02:00
parent f488517186
commit c44e97cdbd
Signed by: FWDekker
GPG Key ID: D3DCFAA8A4560BE0
5 changed files with 54 additions and 4 deletions

BIN
package-lock.json generated

Binary file not shown.

View File

@ -1,6 +1,6 @@
{
"name": "@fwdekker/template",
"version": "2.7.2",
"version": "2.7.3",
"description": "The base template for pages on fwdekker.com.",
"author": "Florine W. Dekker",
"license": "MIT",

View File

@ -3,4 +3,5 @@
@import "snippets/colors.css";
@import "snippets/common.css";
@import "snippets/nav.css";
@import "snippets/toc.css";
@import "snippets/overrides.css";

View File

@ -0,0 +1,3 @@
#toc {
position: fixed;
}

View File

@ -37,9 +37,55 @@
<div id="header"></div>
<section class="container">
<div class="row">
<div class="column column-75">
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
<p>These are the page contents.</p>
<p>These are some more contents.</p>
</div>
<div class="column column-25">
<div id="toc">
<p>These are a TOC</p>
</div>
</div>
</div>
</section>
</div>
<div id="footer"></div>