Update journal and favicon

This commit is contained in:
2025-11-22 10:59:33 +01:00
parent d56c60c514
commit 907232b001
53 changed files with 1338 additions and 1189 deletions

View File

@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 2025-11-20 -->
<!-- 2025-11-21 -->
<meta charset="utf-8" />
<meta name="viewport" content="width=100%, initial-scale=0.7" />
<title>Webbieweb.org Sources</title>
@@ -192,6 +192,7 @@
</style>
<link rel="stylesheet" href="/static/fonts.css" type="text/css"/>
<link rel="stylesheet" href="/static/style.css" type="text/css"/>
<link rel="icon" type="image/png" href="/static/favicon_96.png" sizes="96x96" />
<script type="text/javascript" src="/static/hide.js"></script>
<script type="text/javascript" src="/static/footnote.js"></script>
@@ -210,13 +211,13 @@
</div>
</div>
<div id="content" class="content">
<div id="outline-container-org8e6e659" class="outline-2">
<h2 id="org8e6e659">Webbieweb.org Literate Sources&#xa0;&#xa0;&#xa0;<span class="tag"><span class="h4left">h4left</span>&#xa0;<span class="h5left">h5left</span>&#xa0;<span class="h3underline">h3underline</span></span></h2>
<div class="outline-text-2" id="text-org8e6e659">
<div id="outline-container-orgee52a08" class="outline-2">
<h2 id="orgee52a08">Webbieweb.org Literate Sources&#xa0;&#xa0;&#xa0;<span class="tag"><span class="h4left">h4left</span>&#xa0;<span class="h5left">h5left</span>&#xa0;<span class="h3underline">h3underline</span></span></h2>
<div class="outline-text-2" id="text-orgee52a08">
</div>
<div id="outline-container-org97d5ceb" class="outline-3">
<h3 id="org97d5ceb">Introduction</h3>
<div class="outline-text-3" id="text-org97d5ceb">
<div id="outline-container-org7fbf839" class="outline-3">
<h3 id="org7fbf839">Introduction</h3>
<div class="outline-text-3" id="text-org7fbf839">
<p>
These are the <a href="https://en.wikipedia.org/wiki/Literate_programming">literate</a> sources of <i>webbieweb.org</i>. The code blocks here constitute the actual sources; therefore, this document is guaranteed to be up to date.
</p>
@@ -224,7 +225,7 @@ These are the <a href="https://en.wikipedia.org/wiki/Literate_programming">liter
<p>
This page is self-contained; the only dependency is <code>ox-publish</code>. The following directory structure is expected:
</p>
<pre class="example" id="orgd53556b">
<pre class="example" id="orgb6010c8">
.
|-- html ;; Export destination; you can copy this dir to any static file host and host the website that way.
|-- org ;; Org-mode sources; these will get compiled and the output copied to html/.
@@ -242,14 +243,14 @@ This page is self-contained; the only dependency is <code>ox-publish</code>. The
</div>
</div>
</div>
<div id="outline-container-orge19349c" class="outline-3">
<h3 id="orge19349c">Export Commands</h3>
<div class="outline-text-3" id="text-orge19349c">
<div id="outline-container-org3e708a5" class="outline-3">
<h3 id="org3e708a5">Export Commands</h3>
<div class="outline-text-3" id="text-org3e708a5">
<p>
Load this file up in Emacs and hit C-c C-c on the code block below to export changes to HTML.
</p>
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="orgf815fd1">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org23363c0">&lt;&lt;blog-scaffolding&gt;&gt;
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">blog/publish</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">org-babel-tangle</span><span class="org-rainbow-delimiters-depth-1">)</span>
</pre>
@@ -257,24 +258,25 @@ Load this file up in Emacs and hit C-c C-c on the code block below to export cha
<p>
The one below will ignore caching; necessary in some situations, for instance: changes under <code>util/</code>.
Currently the habit tracker table also gets erronously cached.
</p>
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org269586b">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org1860e90">&lt;&lt;blog-scaffolding&gt;&gt;
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">blog/force-publish</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">org-babel-tangle</span><span class="org-rainbow-delimiters-depth-1">)</span>
</pre>
</div>
</div>
</div>
<div id="outline-container-org001fb87" class="outline-3">
<h3 id="org001fb87">Elisp</h3>
<div class="outline-text-3" id="text-org001fb87">
<div id="outline-container-org9e9d61b" class="outline-3">
<h3 id="org9e9d61b">Elisp</h3>
<div class="outline-text-3" id="text-org9e9d61b">
</div>
<div id="outline-container-orgaac9ef1" class="outline-4">
<h4 id="orgaac9ef1">Basic Settings/Scaffolding&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgaac9ef1">
<div id="outline-container-org53a6ed6" class="outline-4">
<h4 id="org53a6ed6">Basic Settings/Scaffolding&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org53a6ed6">
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="orgcca8bcc"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">require</span> <span class="org-highlight-quoted-quote">'</span><span class="org-constant">ox-publish</span><span class="org-rainbow-delimiters-depth-1">)</span>
<pre class="src src-emacs-lisp" id="org7977f6c"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">require</span> <span class="org-highlight-quoted-quote">'</span><span class="org-constant">ox-publish</span><span class="org-rainbow-delimiters-depth-1">)</span>
&lt;&lt;no-sitemap&gt;&gt;
@@ -375,18 +377,18 @@ The one below will ignore caching; necessary in some situations, for instance: c
</div>
</div>
</div>
<div id="outline-container-orga2edba8" class="outline-3">
<h3 id="orga2edba8">Features</h3>
<div class="outline-text-3" id="text-orga2edba8">
<div id="outline-container-orgb4d38a1" class="outline-3">
<h3 id="orgb4d38a1">Features</h3>
<div class="outline-text-3" id="text-orgb4d38a1">
</div>
<div id="outline-container-org500050d" class="outline-4">
<h4 id="org500050d">Sitemap&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org500050d">
<div id="outline-container-org2e57e37" class="outline-4">
<h4 id="org2e57e37">Sitemap&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org2e57e37">
<p>
Files with <code>#+FILETAGS: :no-sitemap:</code> at the top will be excluded from <a href="./sitemap.html">the sitemap</a>. Every directory <code>dir/</code> will link to <code>dir/index.org</code>, with <code>index.org</code> being removed as a child entry.
</p>
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org3670aed"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">defun</span> <span class="org-function-name">blog/sitemap-format-entry</span>
<pre class="src src-emacs-lisp" id="org7602eb3"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">defun</span> <span class="org-function-name">blog/sitemap-format-entry</span>
<span class="org-rainbow-delimiters-depth-2">(</span>entry style project<span class="org-rainbow-delimiters-depth-2">)</span>
<span class="org-comment-delimiter">;; </span><span class="org-comment">Blank out entries with :no_sitemap:</span>
<span class="org-rainbow-delimiters-depth-2">(</span><span class="org-keyword">let*</span> <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-rainbow-delimiters-depth-4">(</span>tags <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">org-publish-find-property</span> entry <span class="org-builtin">:filetags</span> project<span class="org-rainbow-delimiters-depth-1">)</span><span class="org-rainbow-delimiters-depth-4">)</span>
@@ -421,9 +423,9 @@ Files with <code>#+FILETAGS: :no-sitemap:</code> at the top will be excluded fro
</div>
</div>
</div>
<div id="outline-container-orge35d054" class="outline-4">
<h4 id="orge35d054">Tag-based Section Control&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orge35d054">
<div id="outline-container-org3764afc" class="outline-4">
<h4 id="org3764afc">Tag-based Section Control&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org3764afc">
<p>
Org-mode headers support tags:
</p>
@@ -461,9 +463,9 @@ We will hide the tags themselves:
</div>
</div>
</div>
<div id="outline-container-org7a87543" class="outline-4">
<h4 id="org7a87543">Header Styling Tags&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org7a87543">
<div id="outline-container-orgef66f51" class="outline-4">
<h4 id="orgef66f51">Header Styling Tags&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgef66f51">
<p>
Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code> at the top level.
</p>
@@ -483,16 +485,16 @@ Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code
</div>
</div>
</div>
<div id="outline-container-org4499e50" class="outline-4">
<h4 id="org4499e50">Journal&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org4499e50">
<div id="outline-container-orgb2fd278" class="outline-4">
<h4 id="orgb2fd278">Journal&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgb2fd278">
<p>
Here&rsquo;s a template for the journal files, as reference for what follows:
</p>
</div>
<div id="outline-container-org82d4814" class="outline-5">
<h5 id="org82d4814">Template&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org82d4814">
<div id="outline-container-org9ef1ed9" class="outline-5">
<h5 id="org9ef1ed9">Template&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org9ef1ed9">
<div class="org-src-container">
<pre class="src src-org"><span class="org-org-meta-line">#+FILETAGS: :no_sitemap:</span>
<span class="org-org-meta-line">#+TODO: NO(n) | YES(y) EXCELLENT(e) FREED(f)</span>
@@ -543,9 +545,9 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<div id="outline-container-orgbe2d965" class="outline-5">
<h5 id="orgbe2d965">Styling</h5>
<div class="outline-text-5" id="text-orgbe2d965">
<div id="outline-container-org05bfc91" class="outline-5">
<h5 id="org05bfc91">Styling</h5>
<div class="outline-text-5" id="text-org05bfc91">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-property">div</span>:has(h3 .tag .journal) {
<span class="org-css-property">border</span>: none;
@@ -578,18 +580,18 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<div id="outline-container-orgfd3e168" class="outline-4">
<h4 id="orgfd3e168">Habit Tracker&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgfd3e168">
<div id="outline-container-org02bf504" class="outline-4">
<h4 id="org02bf504">Habit Tracker&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org02bf504">
<p>
Implements the habit tracking table on the <a href="./index.html">front page</a>. Habits are extracted from journal entries and rendered into a table, including a &ldquo;streak&rdquo; heatmap and the ability to click cells to see the corresponding entry.
</p>
</div>
<div id="outline-container-org3bf2dae" class="outline-5">
<h5 id="org3bf2dae">Elisp&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org3bf2dae">
<div id="outline-container-org37c782a" class="outline-5">
<h5 id="org37c782a">Elisp&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org37c782a">
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org9ab9b29"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">defun</span> <span class="org-function-name">akk0/org-to-html</span> <span class="org-rainbow-delimiters-depth-2">(</span>org-string<span class="org-rainbow-delimiters-depth-2">)</span>
<pre class="src src-emacs-lisp" id="org9d25e01"><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">defun</span> <span class="org-function-name">akk0/org-to-html</span> <span class="org-rainbow-delimiters-depth-2">(</span>org-string<span class="org-rainbow-delimiters-depth-2">)</span>
<span class="org-doc">"Convert ORG-STRING to HTML."</span>
<span class="org-rainbow-delimiters-depth-2">(</span><span class="org-keyword">with-temp-buffer</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">insert</span> org-string<span class="org-rainbow-delimiters-depth-3">)</span>
@@ -785,9 +787,9 @@ Implements the habit tracking table on the <a href="./index.html">front page</a>
</div>
</div>
</div>
<div id="outline-container-orgaa7918c" class="outline-5">
<h5 id="orgaa7918c">Expansion Section&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-orgaa7918c">
<div id="outline-container-org8c1d4b5" class="outline-5">
<h5 id="org8c1d4b5">Expansion Section&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org8c1d4b5">
<p>
A bit of JS for enabling the expanding of entries.
</p>
@@ -829,9 +831,9 @@ A bit of JS for enabling the expanding of entries.
</div>
</div>
</div>
<div id="outline-container-org48af85d" class="outline-5">
<h5 id="org48af85d">CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org48af85d">
<div id="outline-container-org01e5aed" class="outline-5">
<h5 id="org01e5aed">CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org01e5aed">
<p>
Color habit entries based on their completion status:
</p>
@@ -890,9 +892,9 @@ Style the cells, set legible text color, outline clickable:
</div>
</div>
</div>
<div id="outline-container-org7cf6b19" class="outline-4">
<h4 id="org7cf6b19">Header Collapsing&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org7cf6b19">
<div id="outline-container-org95305b7" class="outline-4">
<h4 id="org95305b7">Header Collapsing&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org95305b7">
<p>
Sections can be expanded and collapsed by clicking on their headers; this will assign <code>.orgjq-expanded</code> and <code>.orgjq-contracted</code> CSS classes as appropriate. Headers with the <code>:autocollapse:</code> tag will be collapsed by default (like this section).
</p>
@@ -1011,9 +1013,9 @@ Sections can be expanded and collapsed by clicking on their headers; this will a
</div>
</div>
</div>
<div id="outline-container-orgf8cad55" class="outline-4">
<h4 id="orgf8cad55">Hover Notes&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgf8cad55">
<div id="outline-container-org28d2ff4" class="outline-4">
<h4 id="org28d2ff4">Hover Notes&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org28d2ff4">
<p>
Turns org-mode footnotes (<code>[fn::Like this]</code>) into hover-notes<sup><a id="fnr.1" class="footref" href="#fn.1" role="doc-backlink">1</a></sup>.
</p>
@@ -1071,17 +1073,17 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org87a1a58" class="outline-3">
<h3 id="org87a1a58">Appearance</h3>
<div class="outline-text-3" id="text-org87a1a58">
<div id="outline-container-orgb8189b5" class="outline-3">
<h3 id="orgb8189b5">Appearance</h3>
<div class="outline-text-3" id="text-orgb8189b5">
</div>
<div id="outline-container-org28a2b8e" class="outline-4">
<h4 id="org28a2b8e">Global&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org28a2b8e">
<div id="outline-container-orgf40fec2" class="outline-4">
<h4 id="orgf40fec2">Global&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgf40fec2">
</div>
<div id="outline-container-org6badab6" class="outline-5">
<h5 id="org6badab6">Variables</h5>
<div class="outline-text-5" id="text-org6badab6">
<div id="outline-container-orgb9a68b8" class="outline-5">
<h5 id="orgb9a68b8">Variables</h5>
<div class="outline-text-5" id="text-orgb9a68b8">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">:root</span> {
<span class="org-variable-name">--site-width</span>: 1000px;
@@ -1097,9 +1099,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org05a7ac1" class="outline-5">
<h5 id="org05a7ac1">Color Variables</h5>
<div class="outline-text-5" id="text-org05a7ac1">
<div id="outline-container-orgae7f236" class="outline-5">
<h5 id="orgae7f236">Color Variables</h5>
<div class="outline-text-5" id="text-orgae7f236">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">:root</span> {
<span class="org-variable-name">--green1</span>: <span class="custom-28">#123218</span>;
@@ -1143,9 +1145,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org62a1636" class="outline-5">
<h5 id="org62a1636">Background image</h5>
<div class="outline-text-5" id="text-org62a1636">
<div id="outline-container-org0a0d070" class="outline-5">
<h5 id="org0a0d070">Background image</h5>
<div class="outline-text-5" id="text-org0a0d070">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">body::before,</span>
<span class="org-css-selector">body::after</span> {
@@ -1180,8 +1182,8 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
<ul class="org-ul">
<li><a id="org5ee170d"></a><span class="todo TODO">TODO</span> This is a weird approach and has some issues<br>
<div class="outline-text-6" id="text-org5ee170d">
<li><a id="orgf764626"></a><span class="todo TODO">TODO</span> This is a weird approach and has some issues<br>
<div class="outline-text-6" id="text-orgf764626">
<ul class="org-ul">
<li>White line in center in some setups</li>
<li>Crunchy lines depending on DPI</li>
@@ -1190,9 +1192,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</li>
</ul>
</div>
<div id="outline-container-org34a30bc" class="outline-5">
<h5 id="org34a30bc">Fonts</h5>
<div class="outline-text-5" id="text-org34a30bc">
<div id="outline-container-orgea7b11e" class="outline-5">
<h5 id="orgea7b11e">Fonts</h5>
<div class="outline-text-5" id="text-orgea7b11e">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">body</span> {
<span class="org-css-property">font-family</span>: var(<span class="org-variable-name">--font-family</span>);
@@ -1205,9 +1207,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org813c977" class="outline-5">
<h5 id="org813c977">Header/Content/Footer blocks</h5>
<div class="outline-text-5" id="text-org813c977">
<div id="outline-container-org62c1864" class="outline-5">
<h5 id="org62c1864">Header/Content/Footer blocks</h5>
<div class="outline-text-5" id="text-org62c1864">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">#content, #header, #footer</span> {
<span class="org-css-property">min-width</span>: 500px;
@@ -1270,13 +1272,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org8fc1cd5" class="outline-4">
<h4 id="org8fc1cd5">Colors&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org8fc1cd5">
<div id="outline-container-org3125e51" class="outline-4">
<h4 id="org3125e51">Colors&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org3125e51">
</div>
<div id="outline-container-org65e9b27" class="outline-5">
<h5 id="org65e9b27">Color Assignments</h5>
<div class="outline-text-5" id="text-org65e9b27">
<div id="outline-container-org68c4f93" class="outline-5">
<h5 id="org68c4f93">Color Assignments</h5>
<div class="outline-text-5" id="text-org68c4f93">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">body</span> {
<span class="org-css-property">color</span>: var(<span class="org-variable-name">--</span><span class="custom"><span class="custom-1">black</span></span>);
@@ -1287,9 +1289,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgc6e8d18" class="outline-5">
<h5 id="orgc6e8d18">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-orgc6e8d18">
<div id="outline-container-orgcd03a5b" class="outline-5">
<h5 id="orgcd03a5b">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-orgcd03a5b">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">pre</span> {<span class="org-css-property">background-color</span>:var(<span class="org-variable-name">--grey1</span>); <span class="org-css-property">color</span>:var(<span class="org-variable-name">--grey5</span>);}
<span class="org-css-selector">pre span.org-builtin</span> {<span class="org-css-property">color</span>:var(<span class="org-variable-name">--blue4</span>);<span class="org-css-property">font-weight</span>:bold;}
@@ -1329,13 +1331,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org9eb6820" class="outline-4">
<h4 id="org9eb6820">General CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org9eb6820">
<div id="outline-container-org9c11970" class="outline-4">
<h4 id="org9c11970">General CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org9c11970">
</div>
<div id="outline-container-orgd2125c6" class="outline-5">
<h5 id="orgd2125c6">Et Cetera</h5>
<div class="outline-text-5" id="text-orgd2125c6">
<div id="outline-container-org09a78ea" class="outline-5">
<h5 id="org09a78ea">Et Cetera</h5>
<div class="outline-text-5" id="text-org09a78ea">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">hr</span> {
<span class="org-css-property">border</span>: <span class="org-highlight-numbers-number">0</span>;
@@ -1376,13 +1378,15 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
}
<span class="org-css-selector">.section-number-1, .section-number-2, .section-number-3, .section-number-4</span> { <span class="org-css-property">display</span>: none; }
<span class="org-css-selector">ul</span> { <span class="org-css-property">margin-top</span>: <span class="org-highlight-numbers-number">0</span>; }
</pre>
</div>
</div>
</div>
<div id="outline-container-org24fc97d" class="outline-5">
<h5 id="org24fc97d">Utility Classes</h5>
<div class="outline-text-5" id="text-org24fc97d">
<div id="outline-container-org1605872" class="outline-5">
<h5 id="org1605872">Utility Classes</h5>
<div class="outline-text-5" id="text-org1605872">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">.center</span> {
<span class="org-css-property">display</span>: block;
@@ -1431,13 +1435,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgbc0aa4a" class="outline-4">
<h4 id="orgbc0aa4a">Elements&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgbc0aa4a">
<div id="outline-container-org5ef459e" class="outline-4">
<h4 id="org5ef459e">Elements&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org5ef459e">
</div>
<div id="outline-container-orgc4187dd" class="outline-5">
<h5 id="orgc4187dd">Looking for Work</h5>
<div class="outline-text-5" id="text-orgc4187dd">
<div id="outline-container-org201f322" class="outline-5">
<h5 id="org201f322">Looking for Work</h5>
<div class="outline-text-5" id="text-org201f322">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">#looking-for-work</span> {
<span class="org-css-property">background-color</span>: var(<span class="org-variable-name">--red2</span>);
@@ -1457,21 +1461,21 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgf22d959" class="outline-5">
<h5 id="orgf22d959">Code Blocks</h5>
<div class="outline-text-5" id="text-orgf22d959">
<div id="outline-container-org988d595" class="outline-5">
<h5 id="org988d595">Code Blocks</h5>
<div class="outline-text-5" id="text-org988d595">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">.src, .example</span> {
<span class="org-css-property">font-family</span>: <span class="org-string">"monospace"</span>;
<span class="org-css-property">font-family</span>: monospace;
<span class="org-css-property">font-size</span>: 1rem;
}
</pre>
</div>
</div>
</div>
<div id="outline-container-orgaaf18a1" class="outline-5">
<h5 id="orgaaf18a1">Publish/modified Date</h5>
<div class="outline-text-5" id="text-orgaaf18a1">
<div id="outline-container-orgd411ad4" class="outline-5">
<h5 id="orgd411ad4">Publish/modified Date</h5>
<div class="outline-text-5" id="text-orgd411ad4">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">#publish-date, #modified-date</span> {
<span class="org-css-property">font-style</span>: italic;
@@ -1480,9 +1484,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org5f62ac2" class="outline-5">
<h5 id="org5f62ac2">Table of Contents</h5>
<div class="outline-text-5" id="text-org5f62ac2">
<div id="outline-container-orgf4949d5" class="outline-5">
<h5 id="orgf4949d5">Table of Contents</h5>
<div class="outline-text-5" id="text-orgf4949d5">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">#table-of-contents</span> {
<span class="org-css-property">z-index</span>: <span class="org-highlight-numbers-number">1</span>;
@@ -1533,9 +1537,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orga63faf6" class="outline-5">
<h5 id="orga63faf6">To-Dos</h5>
<div class="outline-text-5" id="text-orga63faf6">
<div id="outline-container-org7cb938d" class="outline-5">
<h5 id="org7cb938d">To-Dos</h5>
<div class="outline-text-5" id="text-org7cb938d">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">.TODO</span> { <span class="org-css-property">color</span>: var(<span class="org-variable-name">--red3</span>); }
<span class="org-css-selector">.DONE</span> { <span class="org-css-property">color</span>: var(<span class="org-variable-name">--green3</span>); }
@@ -1556,7 +1560,7 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div></div>
<div id="postamble" class="status">
<div id='footer'><div id='modified-date'>Last modified: 2025-11-20</div><hr>
<div id='footer'><div id='modified-date'>Last modified: 2025-11-21</div><hr>
If you have any comments about this page, you can email me at: <br>
<b>akk0</b> <i>{at}</i> <b>webbieweb</b> <i>{dot}</i> <b>org</b><br>
Proudly built using <a href="/source.html">org-mode</a>. <br>