Use Halfmoon v2 (#655)

Refresh Codeberg documentatation looks by using Halfmoon v2.

Mobile UI also got a overhaul.

Reviewed-on: https://codeberg.org/Codeberg/Documentation/pulls/655
Reviewed-by: Bastian Greshake Tzovaras <gedankenstuecke@noreply.codeberg.org>
Reviewed-by: Otto <otto@codeberg.org>
Co-authored-by: Gusted <postmaster@gusted.xyz>
Co-committed-by: Gusted <postmaster@gusted.xyz>
This commit is contained in:
Gusted 2025-08-12 17:53:32 +02:00 committed by Gusted
parent de0217c6bc
commit f564ca6cd2
11 changed files with 351 additions and 264 deletions

View file

@ -18,6 +18,8 @@
--admonition-icon--question: url('data:image/svg+xml;charset=utf-8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24" height="24"><path d="M10.97 8.265a1.45 1.45 0 0 0-.487.57.75.75 0 0 1-1.341-.67c.2-.402.513-.826.997-1.148C10.627 6.69 11.244 6.5 12 6.5c.658 0 1.369.195 1.934.619a2.45 2.45 0 0 1 1.004 2.006c0 1.033-.513 1.72-1.027 2.215-.19.183-.399.358-.579.508l-.147.123a4.329 4.329 0 0 0-.435.409v1.37a.75.75 0 1 1-1.5 0v-1.473c0-.237.067-.504.247-.736.22-.28.486-.517.718-.714l.183-.153.001-.001c.172-.143.324-.27.47-.412.368-.355.569-.676.569-1.136a.953.953 0 0 0-.404-.806C12.766 8.118 12.384 8 12 8c-.494 0-.814.121-1.03.265ZM13 17a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path><path d="M12 1c6.075 0 11 4.925 11 11s-4.925 11-11 11S1 18.075 1 12 5.925 1 12 1ZM2.5 12a9.5 9.5 0 0 0 9.5 9.5 9.5 9.5 0 0 0 9.5-9.5A9.5 9.5 0 0 0 12 2.5 9.5 9.5 0 0 0 2.5 12Z"></path></svg>');
--admonition-icon-dimension: 20px;
--pagefind-ui-text: var(--bs-link-color) !important;
}
.content :not(img, pre) {
@ -31,8 +33,11 @@
.content blockquote {
margin: 0;
}
.content-title {
margin-top: 20px !important;
margin-top: 20px;
margin-bottom: 20px;
scroll-margin-block-start: 65px;
}
.content pre {
@ -54,11 +59,6 @@
padding-left: 2em;
}
.codeberg-design .card,
.codeberg-design hr {
margin-left: 0;
}
a.header-anchor,
a.header-anchor:visited {
color: var(--lm-base-text-color) !important;
@ -87,14 +87,6 @@ pre:not([class*='language-']) {
border-radius: 0.3em;
}
/* Override sidebar link style */
.codeberg-design .sidebar-title a {
color: var(--sidebar-title-text-color);
}
.codeberg-design .sidebar-title .dark-mode a {
color: var(--dm-sidebar-title-text-color);
}
/* Apply halfmoon style to inline code */
code:not(pre > code) {
font-size: var(--code-font-size);
@ -114,21 +106,6 @@ code:not(pre > code) {
/* Custom Admonition boxes */
.admonition {
background-color: var(--admonition-background-color--info);
border: 0.2rem solid var(--admonition-border-color--info);
border-radius: 0.3rem;
border-left-width: 0.5rem;
padding: 1em 1.5em;
}
.admonition-title {
font-weight: bold;
font-size: 1.2em;
}
.admonition-icon::before {
content: '';
background-color: var(--admonition-border-color--info);
@ -151,23 +128,12 @@ code:not(pre > code) {
width: 1.5em;
}
.admonition.note {
background-color: var(--admonition-background-color--note);
border-color: var(--admonition-border-color--note);
}
.admonition-icon.note::before {
background-color: var(--admonition-border-color--note);
mask-image: var(--admonition-icon--note);
-webkit-mask-image: var(--admonition-icon--note);
}
.admonition.warning {
background-color: var(--admonition-background-color--warning);
border-color: var(--admonition-border-color--warning);
}
.admonition-icon.warning::before {
background-color: var(--admonition-border-color--warning);
@ -175,11 +141,6 @@ code:not(pre > code) {
-webkit-mask-image: var(--admonition-icon--warning);
}
.admonition.tip {
background-color: var(--admonition-background-color--tip);
border-color: var(--admonition-border-color--tip);
}
.admonition-icon.tip::before {
background-color: var(--admonition-border-color--tip);
@ -187,11 +148,6 @@ code:not(pre > code) {
-webkit-mask-image: var(--admonition-icon--tip);
}
.admonition.question {
background-color: var(--admonition-background-color--question);
border-color: var(--admonition-border-color--question);
}
.admonition-icon.question::before {
background-color: var(--admonition-border-color--question);
@ -199,10 +155,6 @@ code:not(pre > code) {
-webkit-mask-image: var(--admonition-icon--question);
}
.admonition-content > *:last-child {
margin-bottom: 0;
}
#search-results {
overflow: hidden;
word-wrap: anywhere;
@ -232,40 +184,11 @@ code:not(pre > code) {
}
#toc ol {
padding: 5px;
margin: 0;
padding-left: 1em;
}
#toc li {
list-style-type: none;
margin-bottom: 0;
}
#toc a {
display: block;
height: auto;
}
#toc-side {
margin-top: 50px;
}
#toc-side span {
font-weight: 500;
font-size: 1.5rem;
margin-bottom: 1rem;
}
#toc-side ol:first-child {
border-left: 1px solid rgba(0, 0, 0, 0.15);
}
.dark-mode #toc-side ol:first-child {
border-left: 1px solid rgba(255, 255, 255, 0.15);
}
#toc-side a {
padding-left: 10px;
}
a.show-on-focus {
@ -285,3 +208,37 @@ a.show-on-focus:focus {
left: 0;
top: 0;
}
.docs-navbar {
background-color: hsla(var(--bs-body-bg-hsl), 0.75);
backdrop-filter: blur(8px);
}
.sidebar .offcanvas-header,
.docs-navbar {
min-height: 55px;
border-bottom: var(--bs-border-width) solid var(--bs-content-border-color);
}
.filter-docs {
background-color: var(--bs-sidebar-bg);
}
.docs-footer {
background-color: var(--bs-secondary-bg);
border-top: var(--bs-border-width) solid var(--bs-content-border-color);
}
.simple-link {
color: hsla(var(--bs-emphasis-color-hsl), 0.75);
text-decoration: none;
}
.simple-link:hover {
color: hsla(var(--bs-emphasis-color-hsl), 0.9);
}
[data-bs-theme='light'] .sidebar-brand img,
[data-bs-theme='light'] .navbar-brand img {
content: url(https://design.codeberg.org/logo-kit/icon.svg);
}

25
assets/js/index.js Normal file
View file

@ -0,0 +1,25 @@
if (localStorage.getItem('theme') === 'light') {
document.documentElement.setAttribute('data-bs-theme', 'light');
}
function toggleDarkMode() {
const rootPreference = document.documentElement.getAttribute('data-bs-theme');
if (rootPreference === 'light') {
document.documentElement.setAttribute('data-bs-theme', 'dark');
localStorage.setItem('theme', 'dark');
} else {
document.documentElement.setAttribute('data-bs-theme', 'light');
localStorage.setItem('theme', 'light');
}
}
function toggleSidebar() {
const sidebarEl = document.querySelector('.sidebar');
if (sidebarEl.classList.contains('show')) {
sidebarEl.classList.remove('show');
sidebarEl.classList.add('hiding');
} else {
sidebarEl.classList.remove('hiding');
sidebarEl.classList.add('show');
}
}

View file

@ -1,16 +1,21 @@
<div class="card" data-pagefind-ignore="all">
<p>Hey there! 👋 Thank you for reading this article!</p>
<p>
Is there something missing, or do you have an idea on how to improve the documentation?
Do you want to write your own article?
</p>
<p>
You're invited to contribute to the Codeberg Documentation at <a href="https://codeberg.org/Codeberg/Documentation">its source code repository</a>,
for example, by <a href="/collaborating/pull-requests-and-git-flow">adding a pull request</a>
or joining in on the discussion in <a href="https://codeberg.org/Codeberg/Documentation/issues">the issue tracker</a>.
</p>
<p>
For an introduction on contributing to Codeberg Documentation, please have a look
at <a href="https://docs.codeberg.org/improving-codeberg/docs-contributor-faq">the Contributor FAQ</a>.
</p>
<div class="card-body">
<h5 class="card-title">Contributing</h5>
<div class="card-text">
<p>Hey there! 👋 Thank you for reading this article!</p>
<p>
Is there something missing, or do you have an idea on how to improve the documentation?
Do you want to write your own article?
</p>
<p>
You're invited to contribute to the Codeberg Documentation at <a href="https://codeberg.org/Codeberg/Documentation">its source code repository</a>
for example, by <a href="/collaborating/pull-requests-and-git-flow">adding a pull request</a>
or joining in on the discussion in <a href="https://codeberg.org/Codeberg/Documentation/issues">the issue tracker</a>.
</p>
<p>
For an introduction on contributing to Codeberg Documentation, please have a look
at <a href="https://docs.codeberg.org/improving-codeberg/docs-contributor-faq">the Contributor FAQ</a>.
</p>
</div>
</div>
</div>

View file

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en" class="codeberg-design">
<html lang="en" data-bs-theme="dark" data-bs-core="modern">
<head>
<title>{% if eleventyNavigation.title %}{{ eleventyNavigation.title }} | {% endif %}Codeberg Documentation</title>
@ -17,14 +17,10 @@
<link rel="icon" href="https://design.codeberg.org/logo-kit/favicon.svg" type="image/svg+xml" />
<link rel="apple-touch-icon" href="https://design.codeberg.org/logo-kit/apple-touch-icon.png" />
<link rel="preload" type="text/css" href="/assets/css/codeberg-docs.css" as="style" />
<link rel="preload" type="text/css" href="https://design.codeberg.org/design-kit/codeberg.css" as="style" />
<link rel="preload" href="https://fonts.codeberg.org/dist/inter/Inter%20Web/inter.css" as="style" />
<link rel="preload" href="https://fonts.codeberg.org/dist/fontawesome6/css/svg-with-js.css" as="style" />
<!-- Details and License: https://codeberg.org/Codeberg/Design/src/design-kit -->
<link rel="stylesheet" href="https://design.codeberg.org/design-kit/codeberg.css" />
<script defer src="https://design.codeberg.org/design-kit/codeberg.js"></script>
<link rel="stylesheet" type="text/css" href="/halfmoon.css">
<link rel="stylesheet" type="text/css" href="/assets/css/codeberg-docs.css" />
<!-- Syntax highlighting -->
@ -73,138 +69,160 @@
// @license-end
</script>
{% endif %}
<script src="/assets/js/index.js"></script>
</head>
<body data-set-preferred-mode-onload="true">
{% include 'license.njk' %}
<div class="with-navbar with-sidebar with-transitions page-wrapper" data-sidebar-type="overlayed-sm-and-down">
<div class="sidebar-overlay" onclick="halfmoon.toggleSidebar()"></div>
<nav class="navbar">
<div class="navbar-content">
<button class="btn btn-primary" type="button" onclick="halfmoon.toggleSidebar()">
{% fas_icon "bars" %}
<span class="sr-only">Toggle sidebar</span>
</button>
</div>
<!-- Navbar brand -->
<a href="/" class="navbar-brand" title="Codeberg Docs">
<img src="https://design.codeberg.org/logo-kit/icon_inverted.svg" eleventy:ignore="" height="22" width="22" alt="Codeberg" />
<body class="position-relative ps-lg-sbwidth">
<nav class="sidebar offcanvas-start offcanvas-lg">
<div class="offcanvas-header position-relative justify-content-start flex-shrink-0 py-0">
<a class="sidebar-brand d-flex align-items-center me-auto" href="/">
<img
src="https://design.codeberg.org/logo-kit/icon_inverted.svg"
eleventy:ignore=""
class="d-block flex-shrink-0 me-1"
height="24"
width="24"
alt="Codeberg"
/>
Docs
</a>
<!-- Navbar nav -->
<ul class="d-md-flex ml-auto d-none navbar-nav">
<button
type="button"
class="btn btn-secondary btn-square d-none d-lg-inline-block"
aria-label="Toggle dark mode"
onclick="toggleDarkMode()"
>
{% fas_icon "moon" %}
</button>
<button type="button" class="btn-close d-lg-none ms-1" aria-label="Close" onclick="toggleSidebar()"></button>
</div>
<div class="offcanvas-body position-relative p-0">
<div class="filter-docs sticky-top p-3">
<input
id="search-input"
type="text"
class="form-control search"
placeholder="Filter docs"
aria-label="Filter docs"
/>
<div class="mt-1">
<small
>Press
<kbd class="text-body" style="font-size: 10px; background-color: hsla(var(--bs-emphasis-color-hsl), 0.1)"
>/</kbd
>
to focus</small
>
</div>
</div>
<div class="p-3 pt-0">
<div id="search-results"></div>
<ul class="sidebar-nav list">
{% for entry in collections.all | eleventyNavigation %} {% set active = entry.url == page.url or entry.key ==
eleventyNavigation.parent %} {% if (not entry.draft) or active %}
<li class="position-relative mt-4 mb-1">
<h5 class="sidebar-header {% if active %} active{% endif %}">
<a class="text-decoration-none link-white" href="{{ entry.url }}" id="{{ entry.key }}"
>{% fas_icon entry.icon | default("caret-right") %} {{ entry.title }}</a
>
</h5>
</li>
{% if entry.children.length > 0 %} {% for child in entry.children %} {% set child_active = child.url ==
page.url %} {% if child_active or not child.draft %}
<li class="nav-item">
<a
href="{{ child.url }}"
class="nav-link {% if child_active %} active{% endif %}"
id="sidebar-{{ child.key }}"
>
<span class="name">{{ child.title }}</span>
</a>
</li>
{% endif %} {% endfor %} {% endif %} {% endif %} {%- endfor %}
</ul>
</div>
</nav>
<nav class="navbar navbar-expand-md docs-navbar sticky-top">
<div class="container-md px-3 px-sm-4 px-xl-5 py-1 justify-content-start">
<div class="btn-group me-3 d-lg-none">
<button type="button" class="btn btn-secondary btn-square" aria-label="Toggle sidebar" onclick="toggleSidebar()">
{% fas_icon "bars" %}
</button>
<button type="button" class="btn btn-secondary btn-square" aria-label="Toggle dark mode" onclick="toggleDarkMode()">
{% fas_icon "moon" %}
</button>
</div>
<a class="navbar-brand d-flex align-items-center d-lg-none ms-auto ms-md-0" href="/">
<img
src="https://design.codeberg.org/logo-kit/icon_inverted.svg"
class="d-block flex-shrink-0 me-1"
eleventy:ignore=""
height="24"
width="24"
alt="Codeberg"
/>
Docs
</a>
<div class="btn-group ms-auto d-md-none">
<a href="{{ urls.commitHistoryMaster }}/{{ page.inputPath }}" class="btn btn-secondary btn-square" target="_blank" rel="noreferrer">
{% fas_icon "history" %}
</a>
<a href="{{ urls.docsSourcesMaster }}/{{ page.inputPath }}" class="btn btn-secondary btn-square" target="_blank" rel="noreferrer">
{% fas_icon "code" %}
</a>
</div>
<div class="collapse navbar-collapse" id="docs-navbar-collapse">
<div class="d-flex align-items-center justify-content-center ms-auto gap-2">
<a
href="{{ urls.commitHistoryMaster }}/{{ page.inputPath }}"
class="nav-link"
class="btn btn-secondary flex-grow-1 d-flex align-items-center flex-nowrap text-start position-relative"
target="_blank"
rel="noreferrer"
>
{% fas_icon "history" %} &nbsp; View History
</a>
</li>
<li class="nav-item">
<a
href="{{ urls.docsSourcesMaster }}/{{ page.inputPath }}"
class="nav-link"
class="btn btn-secondary flex-grow-1 d-flex align-items-center flex-nowrap text-start position-relative"
target="_blank"
rel="noreferrer"
>
{% fas_icon "code" %} &nbsp; View Source
</a>
</li>
{#
<li class="nav-item">
<a href="javascript:;" onclick="document.body.classList.toggle('dark-mode')" class="nav-link">
{% fas_icon "moon" %} &nbsp; Toggle Dark Mode
</a>
</li>
#}
</ul>
<!-- Navbar content (dropdown menu) -->
<div class="ml-auto d-md-none navbar-content">
<div class="with-arrow dropdown">
<button class="btn" data-toggle="dropdown" type="button" id="navbar-dropdown-toggle-btn-1">
Menu {% fas_icon "angle-down" %}
</button>
<div class="dropdown-menu-right w-200 dropdown-menu" aria-labelledby="navbar-dropdown-toggle-btn-1">
<a
href="{{ urls.commitHistoryMaster }}/{{ page.inputPath }}"
class="dropdown-item"
target="_blank"
rel="noreferrer"
>
{% fas_icon "history" %} &nbsp; View History
</a>
<a
href="{{ urls.docsSourcesMaster }}/{{ page.inputPath }}"
class="dropdown-item"
target="_blank"
rel="noreferrer"
>
{% fas_icon "code" %} &nbsp; View Source
</a>
{#
<a href="javascript:;" onclick="document.body.classList.toggle('dark-mode')" class="dropdown-item">
{% fas_icon "moon" %} &nbsp; Toggle Dark Mode
</a>
#}
<div class="mt-5 dropdown-divider"></div>
</div>
</div>
</div>
</nav>
<div class="sidebar">
<div class="sidebar-menu">
<!-- Sidebar content with the search box -->
<div class="sidebar-content">
<input type="text" class="form-control" placeholder="Filter Docs" id="search-input" />
<div class="mt-10 font-size-12">Press <kbd>/</kbd> to focus</div>
<div id="search-results"></div>
</div>
{% for entry in collections.all | eleventyNavigation %} {% set active = entry.url == page.url or entry.key ==
eleventyNavigation.parent %} {% if (not entry.draft) or active %}
<h5 class="sidebar-title {% if active %} active{% endif %}">
<a href="{{ entry.url }}" id="{{ entry.key }}"
>{% fas_icon entry.icon | default("caret-right") %} {{ entry.title }}</a
>
</h5>
<div class="sidebar-divider"></div>
{% if entry.children.length > 0 %} {% for child in entry.children %} {% set child_active = child.url ==
page.url %} {% if child_active or not child.draft %}
<a href="{{ child.url }}" class="sidebar-link{% if child_active %} active{% endif %}" id="{{ child.key }}">
<span class="name">{{ child.title }}</span>
</a>
{% endif %} {% endfor %} {% endif %} {% endif %}
<br />
{%- endfor %}
</div>
</div>
</nav>
<div class="content-wrapper">
<div class="container-fluid">
<div class="row">
<div class="col-xl-8 content" data-pagefind-body>
{% if eleventyNavigation.title %}
<h1 class="content-title font-size-24">{{ eleventyNavigation.title }}</h1>
{% endif %} {% if eleventyNavigation.draft %}
<strong data-pagefind-ignore="all"
>Please note that this article is still a draft and might not have any contents yet.</strong
>
{% endif %} {% include 'toc-collapse.njk' %}
{{ content | safe }}
<hr class="mb-20" />
{% if page.url != '/' %} {% include 'contribution_invitation.njk' %} {% endif %}
<div class="text-right font-size-16" data-pagefind-ignore="all">
<p>&copy; Codeberg Docs Contributors. See <a href="#modal-1" role="button">LICENSE</a></p>
</div>
</div>
{% include 'toc-side.njk' %}
<div class="container-md px-3 px-sm-4 px-xl-5">
<div class="row">
<main class="col-xl-9 py-3 py-sm-4" data-pagefind-body>
{% if eleventyNavigation.title %}
<h1 id="top" class="lh-base mb-1 content-title font-size-24">{{ eleventyNavigation.title }}</h1>
{% endif %} {% if eleventyNavigation.draft %}
<strong data-pagefind-ignore="all"
>Please note that this article is still a draft and might not have any contents yet.</strong
>
{% endif %}
<div class="content">
{% include 'toc-collapse.njk' %}
{{ content | safe }}
</div>
</div>
{% include 'contribution_invitation.njk' %}
</main>
{% include 'toc-side.njk' %}
</div>
</div>
<footer class="docs-footer" data-pagefind-ignore="all">
<div class="container-md px-3 px-sm-4 px-xl-5 py-3">
<p>
&copy; Codeberg Docs Contributors. See
<a href="https://codeberg.org/Codeberg/Documentation/src/branch/main/LICENSE.md">LICENSE</a>
</p>
</div>
</footer>
</body>
</html>

View file

@ -1,36 +0,0 @@
<div class="modal" id="modal-1" tabindex="-1" role="dialog">
<div class="modal-dialog" role="document">
<div class="modal-content">
<h5 class="modal-title">LICENSE</h5>
<p>
The
<span
xmlns:dct="http://purl.org/dc/terms/"
href="http://purl.org/dc/dcmitype/Text"
property="dct:title"
rel="dct:type"
>
Codeberg Documentation website</span
>
is licensed under a
<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"
>Creative Commons Attribution-ShareAlike 4.0 International License</a
>.
</p>
<p>
It bundles third-party font software licensed under a different license. Please look at
<a href="{{ urls.docsSourcesMaster }}/LICENSE.md">the LICENSE file</a> for details.
</p>
<p>
Changes to the original versions of the article as well as its individual authors can be looked up in
<a href="{{ urls.commitHistoryMaster }}/{{ page.inputPath }}" target="_blank" rel="noreferrer"
>this article's commit history</a
>
</p>
<p>Codeberg and the Codeberg Logo are trademarks of Codeberg e.V.</p>
<div class="text-right mt-20">
<a href="#" class="mr-5 btn" role="button">Close</a>
</div>
</div>
</div>
</div>

View file

@ -1,10 +1,11 @@
{% if content | toc %}
<nav class="mb-3 d-xl-none" data-pagefind-ignore="all">
<details class="collapse-panel">
<summary class="d-block d-flex justify-content-between align-items-center py-2 w-full collapse-header">
<summary class="btn btn-secondary d-block w-100 py-2 d-flex align-items-center justify-content-between">
<span class="antialiased">On this page</span>
{% fas_icon "angle-down" %}
</summary>
<div id="toc" class="collapse-content">
<div id="toc" class="border rounded mt-2">
{{ content | toc | safe }}
</div>
</details>

View file

@ -1,8 +1,8 @@
{% if content | toc %}
<nav class="col-xl-3 position-relative d-none d-xl-block" id="toc-side" data-pagefind-ignore="all">
<div class="position-fixed mr-20">
<span>On this page</span>
<div id="toc" class="overflow-y-auto" style="max-height: 43.75rem;">
<div class="position-sticky start-0 py-3 py-sm-4 ps-4" style="top: 63px;">
<span class="h4 lh-base">On this page</span>
<div id="toc" class="overflow-y-auto pe-2" style="max-height: 43.75rem;">
{{ content | toc | safe }}
</div>
</div>

5
content/halfmoon.njk Normal file
View file

@ -0,0 +1,5 @@
---
permalink: halfmoon.css
---
{% include "../node_modules/halfmoon/css/halfmoon.min.css" %}
{% include "../node_modules/halfmoon/css/cores/halfmoon.modern.css" %}

View file

@ -33,11 +33,11 @@ export default function (eleventyConfig) {
});
const mapping = {
h2: 'content-title',
h3: 'content-title',
h4: 'content-title',
h5: 'content-title',
h6: 'content-title',
h2: 'h2 content-title',
h3: 'h3 content-title',
h4: 'h4 content-title',
h5: 'h5 content-title',
h6: 'h6 content-title',
table: 'table',
blockquote: 'alert',
};
@ -64,20 +64,20 @@ export default function (eleventyConfig) {
} else {
titleStr = 'Info';
}
return `<div class="admonition${type ? ` ${type.toLowerCase()}` : ''}">
<div class="admonition-title">
<span class="admonition-icon${type ? ` ${type.toLowerCase()}` : ''}"></span>
${titleStr}
type = type.toLowerCase();
return `<div class="alert alert-${type === 'tip' || type === 'note' ? 'primary' : type === 'question' ? 'success' : type}">
<div class="alert-heading">
<span class="admonition-icon${type ? ` ${type}` : ''}"></span>
${titleStr}</h5>
</div>
<div class="admonition-content">${content}</div>
${content}
</div>`;
});
eleventyConfig.addPlugin(tableOfContentsPlugin, {
tags: ['h2', 'h3'],
wrapper: function (toc) {
toc = toc.replaceAll('<a', "<a class='sidebar-link'");
toc = toc.replaceAll('<a', "<a class='simple-link d-block p-1'");
return `${toc}`;
},
});

View file

@ -15,6 +15,7 @@
"@fortawesome/free-solid-svg-icons": "^6.7.2",
"@toycode/markdown-it-class": "^1.2.4",
"@uncenter/eleventy-plugin-toc": "^1.0.3",
"halfmoon": "^2.0.2",
"markdown-it": "^14.1.0",
"markdown-it-anchor": "^9.2.0",
"pagefind": "^1.3.0"

111
pnpm-lock.yaml generated
View file

@ -32,6 +32,9 @@ importers:
'@uncenter/eleventy-plugin-toc':
specifier: ^1.0.3
version: 1.0.3
halfmoon:
specifier: ^2.0.2
version: 2.0.2
markdown-it:
specifier: ^14.1.0
version: 14.1.0
@ -279,6 +282,10 @@ packages:
engines: {node: '>=0.4.0'}
hasBin: true
ansi-colors@4.1.3:
resolution: {integrity: sha512-/6w/C21Pm1A7aZitlI5Ni/2J6FFQN8i1Cvz3kHABAAbw93v/NlvKdVOqz7CCWz/3iv/JplRSEEZ83XION15ovw==}
engines: {node: '>=6'}
anymatch@3.1.3:
resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==}
engines: {node: '>= 8'}
@ -349,6 +356,10 @@ packages:
resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
engines: {node: '>= 8.10.0'}
clap@3.1.1:
resolution: {integrity: sha512-vp42956Ax06WwaaheYEqEOgXZ3VKJxgccZ0gJL0HpyiupkIS9RVJFo5eDU1BPeQAOqz+cclndZg4DCqG1sJReQ==}
engines: {node: ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
color-convert@2.0.1:
resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
engines: {node: '>=7.0.0'}
@ -377,10 +388,23 @@ packages:
css-select@5.2.2:
resolution: {integrity: sha512-TizTzUddG/xYLA3NXodFM0fSbNizXjOKhqiQQwvhlspadZokn1KDy0NZFS0wuEubIYAV5/c1/lAr0TaaFXEXzw==}
css-tree@2.2.1:
resolution: {integrity: sha512-OA0mILzGc1kCOCSJerOeqDxDQ4HOh+G8NbOJFOTgOCzpw7fCBubk0fEyxp8AgOL/jvLgYA/uV0cMbe43ElF1JA==}
engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
css-what@6.2.2:
resolution: {integrity: sha512-u/O3vwbptzhMs3L1fQE82ZSLHQQfto5gyZzwteVIEyeaY5Fc7R4dapF/BvRoSYFeqfBk4m0V1Vafq5Pjv25wvA==}
engines: {node: '>= 6'}
csso-cli@4.0.2:
resolution: {integrity: sha512-p/VipA45w8EmS8Lv6wGtE+UdsbFlqUBGhL9FCTGKxd5dC07mtg3BbZaMzMh0X+oIl2JUGR/mPx5YzuNnTM2a3w==}
engines: {node: '>=12.20.0'}
hasBin: true
csso@5.0.5:
resolution: {integrity: sha512-0LrrStPOdJj+SPCCrGhzryycLjwcgUSHBtxNA8aIDxf0GLsRh1cKYhB00Gd1lDOS4yGH69+SNn13+TWbVHETFQ==}
engines: {node: ^10 || ^12.20.0 || ^14.13.0 || >=15.0.0, npm: '>=7.0.0'}
debug@2.6.9:
resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
peerDependencies:
@ -462,6 +486,10 @@ packages:
resolution: {integrity: sha512-3zV5mFS1E8/1bPxt/B0xxzI1snsg3uSCIh6Zo1qKg6iMw93hzPANk9oBFzSFBFrwuVoQuE3rLoouAUfwOAj1wQ==}
hasBin: true
escalade@3.2.0:
resolution: {integrity: sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==}
engines: {node: '>=6'}
escape-html@1.0.3:
resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
@ -532,6 +560,9 @@ packages:
resolution: {integrity: sha512-5v6yZd4JK3eMI3FqqCouswVqwugaA9r4dNZB1wwcmrD02QkV5H0y7XBQW8QwQqEaZY1pM9aqORSORhJRdNK44Q==}
engines: {node: '>=6.0'}
halfmoon@2.0.2:
resolution: {integrity: sha512-9IZ+OccqINrD5Eu5RgEgdK0c3CvDRIkL/ePMx+PFXwK1LZB0fI9HniKbd6MrMRsL0j7/OnvS0nGDgoaZvqeGkg==}
htmlparser2@7.2.0:
resolution: {integrity: sha512-H7MImA4MS6cw7nbyURtLPO1Tms7C5H602LRETv95z1MxO/7CP7rDVROehUYeYBUYEON94NXXDEPmZuq+hX4sog==}
@ -642,6 +673,9 @@ packages:
resolution: {integrity: sha512-9ORVtDUFk4u/NFfo0vG/ND/z7UQCVZBL539YW0+U1I7H1BkZwizcPx5foFv7LCPcBnm2U6RjFnQOsIvN4/Vm2A==}
engines: {node: '>=0.10.0'}
mdn-data@2.0.28:
resolution: {integrity: sha512-aylIc7Z9y4yzHYAJNuESG3hfhC+0Ibp/MAMiaOZgNv4pmEdFyfZhhhny4MNiAfWdBQ1RQ2mfDWmM1x8SvGyp8g==}
mdurl@2.0.0:
resolution: {integrity: sha512-Lf+9+2r+Tdp5wXDXC4PcIBjTDtq4UKjCPMQhKIuzpJNW0b96kVqSwW0bT7FhRSfmAiFYgP+SCRvdrDozfh0U5w==}
@ -680,6 +714,11 @@ packages:
ms@2.1.3:
resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==}
nanoid@3.3.11:
resolution: {integrity: sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==}
engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
hasBin: true
node-retrieve-globals@6.0.1:
resolution: {integrity: sha512-j0DeFuZ/Wg3VlklfbxUgZF/mdHMTEiEipBb3q0SpMMbHaV3AVfoUQF8UGxh1s/yjqO0TgRZd4Pi/x2yRqoQ4Eg==}
@ -733,6 +772,9 @@ packages:
resolution: {integrity: sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==}
engines: {node: '>= 0.8'}
picocolors@1.1.1:
resolution: {integrity: sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==}
picomatch@2.3.1:
resolution: {integrity: sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==}
engines: {node: '>=8.6'}
@ -744,6 +786,10 @@ packages:
please-upgrade-node@3.2.0:
resolution: {integrity: sha512-gQR3WpIgNIKwBMVLkpMUeR3e1/E1y42bqDQZfql+kDeXd8COYfM8PQA4X6y7a8u9Ua9FHmsrrmirW2vHs45hWg==}
postcss@8.5.6:
resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==}
engines: {node: ^10 || ^12 || >=14}
posthtml-match-helper@2.0.3:
resolution: {integrity: sha512-p9oJgTdMF2dyd7WE54QI1LvpBIkNkbSiiECKezNnDVYhGhD1AaOnAkw0Uh0y5TW+OHO8iBdSqnd8Wkpb6iUqmw==}
engines: {node: '>=18'}
@ -784,6 +830,11 @@ packages:
resolution: {integrity: sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==}
engines: {node: '>=8.10.0'}
rtlcss@4.3.0:
resolution: {integrity: sha512-FI+pHEn7Wc4NqKXMXFM+VAYKEj/mRIcW4h24YVwVtyjI+EqGrLc2Hx/Ny0lrZ21cBWU2goLy36eqMcNj3AQJig==}
engines: {node: '>=12.0.0'}
hasBin: true
section-matter@1.0.0:
resolution: {integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==}
engines: {node: '>=4'}
@ -818,6 +869,10 @@ packages:
resolution: {integrity: sha512-h+z7HKHYXj6wJU+AnS/+IH8Uh9fdcX1Lrhg1/VMdf9PwoBQXFcXiAdsy2tSK0P6gKwJLXp02r90ahUCqHk9rrw==}
engines: {node: '>=8.0.0'}
source-map-js@1.2.1:
resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
engines: {node: '>=0.10.0'}
sprintf-js@1.0.3:
resolution: {integrity: sha512-D9cPgkvLlV3t3IzL0D0YLvGA9Ahk4PcvVwUbN0dSGr1aP0Nrt4AEnTUbuGvquEC0mA64Gqt1fzirlRs5ibXx8g==}
@ -837,6 +892,10 @@ packages:
resolution: {integrity: sha512-uCC2VHvQRYu+lMh4My/sFNmF2klFymLX1wHJeXnbEJERpV/ZsVuonzerjfrGpIGF7LBVa1O7i9kjiWvJiFck8g==}
engines: {node: '>=0.10.0'}
strip-json-comments@3.1.1:
resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
engines: {node: '>=8'}
tinyglobby@0.2.14:
resolution: {integrity: sha512-tX5e7OM1HnYr2+a2C/4V0htOcSQcoSTH9KgJnVvNm5zm/cyEWKJ7j7YutsH9CxMdtOkkLFy2AHrMci9IM8IPZQ==}
engines: {node: '>=12.0.0'}
@ -1143,6 +1202,8 @@ snapshots:
acorn@8.15.0: {}
ansi-colors@4.1.3: {}
anymatch@3.1.3:
dependencies:
normalize-path: 3.0.0
@ -1229,6 +1290,10 @@ snapshots:
optionalDependencies:
fsevents: 2.3.3
clap@3.1.1:
dependencies:
ansi-colors: 4.1.3
color-convert@2.0.1:
dependencies:
color-name: 1.1.4
@ -1259,8 +1324,24 @@ snapshots:
domutils: 3.2.2
nth-check: 2.1.1
css-tree@2.2.1:
dependencies:
mdn-data: 2.0.28
source-map-js: 1.2.1
css-what@6.2.2: {}
csso-cli@4.0.2:
dependencies:
chokidar: 3.6.0
clap: 3.1.1
csso: 5.0.5
source-map-js: 1.2.1
csso@5.0.5:
dependencies:
css-tree: 2.2.1
debug@2.6.9:
dependencies:
ms: 2.0.0
@ -1327,6 +1408,8 @@ snapshots:
dependencies:
prr: 1.0.1
escalade@3.2.0: {}
escape-html@1.0.3: {}
escape-string-regexp@5.0.0: {}
@ -1387,6 +1470,11 @@ snapshots:
section-matter: 1.0.0
strip-bom-string: 1.0.0
halfmoon@2.0.2:
dependencies:
csso-cli: 4.0.2
rtlcss: 4.3.0
htmlparser2@7.2.0:
dependencies:
domelementtype: 2.3.0
@ -1494,6 +1582,8 @@ snapshots:
arrify: 1.0.1
minimatch: 3.1.2
mdn-data@2.0.28: {}
mdurl@2.0.0: {}
mime-db@1.54.0: {}
@ -1520,6 +1610,8 @@ snapshots:
ms@2.1.3: {}
nanoid@3.3.11: {}
node-retrieve-globals@6.0.1:
dependencies:
acorn: 8.15.0
@ -1576,6 +1668,8 @@ snapshots:
parseurl@1.3.3: {}
picocolors@1.1.1: {}
picomatch@2.3.1: {}
picomatch@4.0.3: {}
@ -1584,6 +1678,12 @@ snapshots:
dependencies:
semver-compare: 1.0.0
postcss@8.5.6:
dependencies:
nanoid: 3.3.11
picocolors: 1.1.1
source-map-js: 1.2.1
posthtml-match-helper@2.0.3(posthtml@0.16.6):
dependencies:
posthtml: 0.16.6
@ -1617,6 +1717,13 @@ snapshots:
dependencies:
picomatch: 2.3.1
rtlcss@4.3.0:
dependencies:
escalade: 3.2.0
picocolors: 1.1.1
postcss: 8.5.6
strip-json-comments: 3.1.1
section-matter@1.0.0:
dependencies:
extend-shallow: 2.0.1
@ -1678,6 +1785,8 @@ snapshots:
slugify@1.6.6: {}
source-map-js@1.2.1: {}
sprintf-js@1.0.3: {}
ssri@11.0.0:
@ -1690,6 +1799,8 @@ snapshots:
strip-bom-string@1.0.0: {}
strip-json-comments@3.1.1: {}
tinyglobby@0.2.14:
dependencies:
fdir: 6.4.6(picomatch@4.0.3)