akko/blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Update journal and habit table

Browse Source
This commit is contained in:
Akko
2025-11-27 13:03:07 +01:00
parent 907232b001
commit 62072c3ceb
55 changed files with 2464 additions and 1477 deletions
Download Patch File Download Diff File Expand all files Collapse all files

295
html/source.html
View File

@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- 2025-11-21 -->
<!-- 2025-11-27 -->
<meta charset="utf-8" />
<meta name="viewport" content="width=100%, initial-scale=0.7" />
<title>Webbieweb.org Sources</title>
@@ -211,13 +211,13 @@
</div>
</div>
<div id="content" class="content">
<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 id="outline-container-org758629b" class="outline-2">
<h2 id="org758629b">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-org758629b">
</div>
<div id="outline-container-org7fbf839" class="outline-3">
<h3 id="org7fbf839">Introduction</h3>
<div class="outline-text-3" id="text-org7fbf839">
<div id="outline-container-org39eb1a4" class="outline-3">
<h3 id="org39eb1a4">Introduction</h3>
<div class="outline-text-3" id="text-org39eb1a4">
<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>
@@ -225,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="orgb6010c8">
<pre class="example" id="org2a0961a">
.
|-- 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/.
@@ -243,14 +243,14 @@ This page is self-contained; the only dependency is <code>ox-publish</code>. The
</div>
</div>
</div>
<div id="outline-container-org3e708a5" class="outline-3">
<h3 id="org3e708a5">Export Commands</h3>
<div class="outline-text-3" id="text-org3e708a5">
<div id="outline-container-orgb238363" class="outline-3">
<h3 id="orgb238363">Export Commands</h3>
<div class="outline-text-3" id="text-orgb238363">
<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="org23363c0">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org2fe0061">&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>
@@ -261,22 +261,22 @@ The one below will ignore caching; necessary in some situations, for instance: c
Currently the habit tracker table also gets erronously cached.
</p>
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org1860e90">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org58fe7db">&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-org9e9d61b" class="outline-3">
<h3 id="org9e9d61b">Elisp</h3>
<div class="outline-text-3" id="text-org9e9d61b">
<div id="outline-container-org7b230fa" class="outline-3">
<h3 id="org7b230fa">Elisp</h3>
<div class="outline-text-3" id="text-org7b230fa">
</div>
<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 id="outline-container-orgd78a86b" class="outline-4">
<h4 id="orgd78a86b">Basic Settings/Scaffolding&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgd78a86b">
<div class="org-src-container">
<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>
<pre class="src src-emacs-lisp" id="orgde97495"><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;
@@ -377,18 +377,18 @@ Currently the habit tracker table also gets erronously cached.
</div>
</div>
</div>
<div id="outline-container-orgb4d38a1" class="outline-3">
<h3 id="orgb4d38a1">Features</h3>
<div class="outline-text-3" id="text-orgb4d38a1">
<div id="outline-container-org086fb82" class="outline-3">
<h3 id="org086fb82">Features</h3>
<div class="outline-text-3" id="text-org086fb82">
</div>
<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">
<div id="outline-container-org74b6268" class="outline-4">
<h4 id="org74b6268">Sitemap&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org74b6268">
<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="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>
<pre class="src src-emacs-lisp" id="org9a537e0"><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>
@@ -423,9 +423,9 @@ Files with <code>#+FILETAGS: :no-sitemap:</code> at the top will be excluded fro
</div>
</div>
</div>
<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">
<div id="outline-container-org2f503c0" class="outline-4">
<h4 id="org2f503c0">Tag-based Section Control&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org2f503c0">
<p>
Org-mode headers support tags:
</p>
@@ -463,9 +463,9 @@ We will hide the tags themselves:
</div>
</div>
</div>
<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">
<div id="outline-container-orge9285d3" class="outline-4">
<h4 id="orge9285d3">Header Styling Tags&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orge9285d3">
<p>
Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code> at the top level.
</p>
@@ -485,34 +485,34 @@ Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code
</div>
</div>
</div>
<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">
<div id="outline-container-org070fe9a" class="outline-4">
<h4 id="org070fe9a">Journal&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org070fe9a">
<p>
Here&rsquo;s a template for the journal files, as reference for what follows:
</p>
</div>
<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 id="outline-container-org11a5c86" class="outline-5">
<h5 id="org11a5c86">Template&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org11a5c86">
<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>
<span class="org-org-document-info-keyword">#+title:</span> <span class="org-org-document-title">Journal Week XX, YYYY</span>
<span class="org-org-document-info-keyword">#+title:</span> <span class="org-org-document-title">Journal Week XX, XXXX</span>
<span class="org-org-block-begin-line">#+BEGIN_CENTER</span>
<span class="org-org-link"><span class="org-warning"><a href="./wXX-YYYY.org">Previous</a></span></span> | <span class="org-org-link"><a href="./index.org">Index</a></span>
<span class="org-org-link"><span class="org-warning"><a href="./wXX-2025.org">Previous</a></span></span> | <span class="org-org-link"><a href="./index.org">Index</a></span>
<span class="org-org-block-end-line">#+END_CENTER</span>
<span class="org-org-level-1"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-1"> Journal Week XX, YYYY</span>
<span class="org-org-hide">*</span><span class="org-org-level-2"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-2"> Monday, ZZth MMMM</span>
<span class="org-org-level-1"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-1"> Journal Week XX, XXXX</span>
<span class="org-org-hide">*</span><span class="org-org-level-2"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-2"> Monday, XXth XXXXXXXX </span><span class="org-org-level-2"><span class="org-org-tag">:journal:</span></span>
<span class="org-org-drawer">:PROPERTIES:</span>
<span class="org-org-special-keyword">:DAILIES-YEAR:</span> <span class="org-org-property-value">YYYY</span>
<span class="org-org-special-keyword">:DAILIES-DAY:</span> <span class="org-org-property-value">DDD</span>
<span class="org-org-special-keyword">:DAILIES-YEAR:</span> <span class="org-org-property-value">2025</span>
<span class="org-org-special-keyword">:DAILIES-DAY:</span> <span class="org-org-property-value">XXX</span>
<span class="org-org-drawer">:END:</span>
<span class="org-org-hide">**</span><span class="org-org-level-3"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-3"> NO Journal</span>
<span class="org-org-hide">**</span><span class="org-org-level-3"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-3"> NO Journal </span><span class="org-org-level-3"><span class="org-org-tag">:jentry:</span></span>
<span class="org-org-drawer">:PROPERTIES:</span>
<span class="org-org-special-keyword">:CUSTOM_ID:</span> <span class="org-org-property-value">dailies-blogging</span>
<span class="org-org-drawer">:END:</span>
<span class="org-org-hide">**</span><span class="org-org-level-3"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-3"> Habits </span><span class="org-org-level-3"><span class="org-org-tag">:autocollapse:</span></span>
<span class="org-org-hide">**</span><span class="org-org-level-3"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-3"> Habits </span><span class="org-org-level-3"><span class="org-org-tag">:autocollapse:habits:</span></span>
<span class="org-org-hide">***</span><span class="org-org-level-4"><span class="org-org-superstar-header-bullet">*</span></span><span class="org-org-level-4"> NO Meditation</span>
<span class="org-org-drawer">:PROPERTIES:</span>
<span class="org-org-special-keyword">:CUSTOM_ID:</span> <span class="org-org-property-value">dailies-meditation</span>
@@ -545,9 +545,9 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<div id="outline-container-org05bfc91" class="outline-5">
<h5 id="org05bfc91">Styling</h5>
<div class="outline-text-5" id="text-org05bfc91">
<div id="outline-container-org8fb6b9b" class="outline-5">
<h5 id="org8fb6b9b">Styling</h5>
<div class="outline-text-5" id="text-org8fb6b9b">
<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;
@@ -580,18 +580,18 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<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">
<div id="outline-container-org7426e2e" class="outline-4">
<h4 id="org7426e2e">Habit Tracker&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org7426e2e">
<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-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 id="outline-container-org5c681d2" class="outline-5">
<h5 id="org5c681d2">Elisp&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org5c681d2">
<div class="org-src-container">
<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>
<pre class="src src-emacs-lisp" id="orge56906b"><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>
@@ -715,7 +715,7 @@ Implements the habit tracking table on the <a href="./index.html">front page</a>
<span class="org-rainbow-delimiters-depth-4">(</span>sorted-habits <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">akk0/sort-habits</span> habit-alist<span class="org-rainbow-delimiters-depth-1">)</span><span class="org-rainbow-delimiters-depth-4">)</span>
<span class="org-rainbow-delimiters-depth-4">(</span>html <span class="org-string">""</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
<span class="org-comment-delimiter">;; </span><span class="org-comment">Start table</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">concat</span> html <span class="org-string">"&lt;table style='margin-left: auto; margin-right:auto; margin-bottom: 0.8rem;'&gt;\n"</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">concat</span> html <span class="org-string">"&lt;table class='</span><span class="org-string"><span class="org-constant">habit-table</span></span><span class="org-string">' style='margin-left: auto; margin-right:auto; margin-bottom: 0.8rem;'&gt;\n"</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
<span class="org-comment-delimiter">;; </span><span class="org-comment">Header row with day numbers</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">concat</span> html <span class="org-string">" &lt;tr&gt;\n &lt;th&gt;&lt;/th&gt;\n"</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
@@ -723,7 +723,7 @@ Implements the habit tracking table on the <a href="./index.html">front page</a>
<span class="org-rainbow-delimiters-depth-4">(</span><span class="org-keyword">let</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-rainbow-delimiters-depth-2">(</span>day <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">+</span> <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">-</span> day-number days-back<span class="org-rainbow-delimiters-depth-4">)</span> i <span class="org-highlight-numbers-number">1</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">concat</span>
html
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">cond</span> <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">=</span> day day-number<span class="org-rainbow-delimiters-depth-1">)</span> <span class="org-string">"&lt;th&gt;&#9679;&lt;/th&gt;"</span><span class="org-rainbow-delimiters-depth-4">)</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">cond</span> <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">=</span> day day-number<span class="org-rainbow-delimiters-depth-1">)</span> <span class="org-string">"&lt;th class='</span><span class="org-string"><span class="org-constant">habit-click-me</span></span><span class="org-string">'&gt;click me &#65516;&lt;/th&gt;"</span><span class="org-rainbow-delimiters-depth-4">)</span>
<span class="org-rainbow-delimiters-depth-4">(</span><span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">=</span> <span class="org-highlight-numbers-number">0</span> <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-variable-name">%</span> <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">-</span> day day-number<span class="org-rainbow-delimiters-depth-3">)</span> <span class="org-highlight-numbers-number">7</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span> <span class="org-string">"&lt;th&gt;&#9675;&lt;/th&gt;"</span><span class="org-rainbow-delimiters-depth-4">)</span>
<span class="org-rainbow-delimiters-depth-4">(</span>t <span class="org-string">"&lt;th /&gt;"</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">concat</span> html <span class="org-string">" &lt;/tr&gt;\n"</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span>
@@ -733,7 +733,7 @@ Implements the habit tracking table on the <a href="./index.html">front page</a>
<span class="org-rainbow-delimiters-depth-3">(</span><span class="org-keyword">dolist</span> <span class="org-rainbow-delimiters-depth-4">(</span>entry sorted-habits<span class="org-rainbow-delimiters-depth-4">)</span>
<span class="org-rainbow-delimiters-depth-4">(</span><span class="org-keyword">let*</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-rainbow-delimiters-depth-2">(</span>custom-id <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">car</span> entry<span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span>
<span class="org-rainbow-delimiters-depth-2">(</span>history <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-function-name">akk0/get-habit-history</span> habit-alist custom-id day-number days-back window-size<span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">concat</span> html <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">format</span> <span class="org-string">" &lt;tr&gt;\n &lt;td style='padding-right: 20px; padding-top: 5px; padding-bottom: 5px;'&gt;&lt;i&gt;%s&lt;/i&gt;&lt;/td&gt;\n"</span> <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">capitalize</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">string-remove-prefix</span> <span class="org-string">"dailies-"</span> custom-id<span class="org-rainbow-delimiters-depth-1">)</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">setq</span> html <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">concat</span> html <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">format</span> <span class="org-string">" &lt;tr&gt;\n &lt;td class='</span><span class="org-string"><span class="org-constant">habit-name</span></span><span class="org-string">' style='padding-right: 20px; padding-top: 5px; padding-bottom: 5px;'&gt;&lt;i&gt;%s&lt;/i&gt;&lt;/td&gt;\n"</span> <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-constant">capitalize</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">string-remove-prefix</span> <span class="org-string">"dailies-"</span> custom-id<span class="org-rainbow-delimiters-depth-1">)</span><span class="org-rainbow-delimiters-depth-4">)</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-comment-delimiter">;; </span><span class="org-comment">Cell for each day</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">dolist</span> <span class="org-rainbow-delimiters-depth-2">(</span>day-data history<span class="org-rainbow-delimiters-depth-2">)</span>
@@ -782,14 +782,14 @@ Implements the habit tracking table on the <a href="./index.html">front page</a>
html<span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">akk0/habits-to-html-table</span> habit-alist <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">string-to-number</span> <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">format-time-string</span> <span class="org-string">"%j"</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span> <span class="org-highlight-numbers-number">30</span> <span class="org-highlight-numbers-number">5</span><span class="org-rainbow-delimiters-depth-1">)</span>
<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-function-name">akk0/habits-to-html-table</span> habit-alist <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">string-to-number</span> <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-constant">format-time-string</span> <span class="org-string">"%j"</span><span class="org-rainbow-delimiters-depth-3">)</span><span class="org-rainbow-delimiters-depth-2">)</span> <span class="org-highlight-numbers-number">21</span> <span class="org-highlight-numbers-number">5</span><span class="org-rainbow-delimiters-depth-1">)</span>
</pre>
</div>
</div>
</div>
<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">
<div id="outline-container-org51765e4" class="outline-5">
<h5 id="org51765e4">Expansion Section&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org51765e4">
<p>
A bit of JS for enabling the expanding of entries.
</p>
@@ -831,9 +831,9 @@ A bit of JS for enabling the expanding of entries.
</div>
</div>
</div>
<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">
<div id="outline-container-org1f9bcc5" class="outline-5">
<h5 id="org1f9bcc5">CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org1f9bcc5">
<p>
Color habit entries based on their completion status:
</p>
@@ -864,13 +864,30 @@ Color habit entries based on their completion status:
Style the cells, set legible text color, outline clickable:
</p>
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">.habit-cell</span> {
<pre class="src src-css"><span class="org-css-selector">.habit-table th, .habit-table td</span> {
<span class="org-css-property">text-align</span>: center;
<span class="org-css-property">vertical-align</span>: middle;
<span class="org-css-property">width</span>: 20px;
<span class="org-css-property">height</span>: 20px;
<span class="org-css-property">cursor</span>: pointer;
<span class="org-css-property">user-select</span>: none;
<span class="org-css-property">padding</span>: 8px;
<span class="org-css-property">max-width</span>: 22px;
}
<span class="org-css-selector">.habit-table th</span> {
<span class="org-css-property">padding</span>: <span class="org-highlight-numbers-number">0</span>;
}
<span class="org-css-selector">.habit-click-me</span> {
<span class="org-css-property">font-weight</span>: normal;
<span class="org-css-property">font-size</span>: calc(var(<span class="org-variable-name">--font-size</span>) * <span class="org-highlight-numbers-number">0.7</span>);
<span class="org-css-property">line-height</span>: calc(var(<span class="org-variable-name">--line-height</span>) * <span class="org-highlight-numbers-number">0.7</span>);
<span class="org-css-property">text-align</span>: center;
}
<span class="org-css-selector">.habit-name</span> {
<span class="org-css-property">max-width</span>: 15rem <span class="org-builtin">!important</span>;
}
<span class="org-css-selector">.habit-cell.habit-brightness-1</span> { <span class="org-css-property">color</span>: var(<span class="org-variable-name">--grey5</span>); <span class="org-css-property">outline-color</span>: var(<span class="org-variable-name">--grey5</span>) <span class="org-builtin">!important</span>; }
@@ -892,9 +909,9 @@ Style the cells, set legible text color, outline clickable:
</div>
</div>
</div>
<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">
<div id="outline-container-orgafd9ef6" class="outline-4">
<h4 id="orgafd9ef6">Header Collapsing&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgafd9ef6">
<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>
@@ -1013,9 +1030,9 @@ Sections can be expanded and collapsed by clicking on their headers; this will a
</div>
</div>
</div>
<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">
<div id="outline-container-org8a7d603" class="outline-4">
<h4 id="org8a7d603">Hover Notes&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org8a7d603">
<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>
@@ -1073,17 +1090,17 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgb8189b5" class="outline-3">
<h3 id="orgb8189b5">Appearance</h3>
<div class="outline-text-3" id="text-orgb8189b5">
<div id="outline-container-org745cfa4" class="outline-3">
<h3 id="org745cfa4">Appearance</h3>
<div class="outline-text-3" id="text-org745cfa4">
</div>
<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 id="outline-container-org9695bbe" class="outline-4">
<h4 id="org9695bbe">Global&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org9695bbe">
</div>
<div id="outline-container-orgb9a68b8" class="outline-5">
<h5 id="orgb9a68b8">Variables</h5>
<div class="outline-text-5" id="text-orgb9a68b8">
<div id="outline-container-orgf35b316" class="outline-5">
<h5 id="orgf35b316">Variables</h5>
<div class="outline-text-5" id="text-orgf35b316">
<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;
@@ -1099,9 +1116,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgae7f236" class="outline-5">
<h5 id="orgae7f236">Color Variables</h5>
<div class="outline-text-5" id="text-orgae7f236">
<div id="outline-container-org64f3d96" class="outline-5">
<h5 id="org64f3d96">Color Variables</h5>
<div class="outline-text-5" id="text-org64f3d96">
<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>;
@@ -1145,9 +1162,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org0a0d070" class="outline-5">
<h5 id="org0a0d070">Background image</h5>
<div class="outline-text-5" id="text-org0a0d070">
<div id="outline-container-orgcd474cc" class="outline-5">
<h5 id="orgcd474cc">Background image</h5>
<div class="outline-text-5" id="text-orgcd474cc">
<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> {
@@ -1182,8 +1199,8 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
<ul class="org-ul">
<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">
<li><a id="org03ecfb0"></a><span class="todo TODO">TODO</span> This is a weird approach and has some issues<br>
<div class="outline-text-6" id="text-org03ecfb0">
<ul class="org-ul">
<li>White line in center in some setups</li>
<li>Crunchy lines depending on DPI</li>
@@ -1192,9 +1209,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</li>
</ul>
</div>
<div id="outline-container-orgea7b11e" class="outline-5">
<h5 id="orgea7b11e">Fonts</h5>
<div class="outline-text-5" id="text-orgea7b11e">
<div id="outline-container-org957f0fb" class="outline-5">
<h5 id="org957f0fb">Fonts</h5>
<div class="outline-text-5" id="text-org957f0fb">
<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>);
@@ -1207,9 +1224,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<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 id="outline-container-org89d5226" class="outline-5">
<h5 id="org89d5226">Header/Content/Footer blocks</h5>
<div class="outline-text-5" id="text-org89d5226">
<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;
@@ -1272,13 +1289,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<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 id="outline-container-orgf729b02" class="outline-4">
<h4 id="orgf729b02">Colors&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgf729b02">
</div>
<div id="outline-container-org68c4f93" class="outline-5">
<h5 id="org68c4f93">Color Assignments</h5>
<div class="outline-text-5" id="text-org68c4f93">
<div id="outline-container-org2474dd1" class="outline-5">
<h5 id="org2474dd1">Color Assignments</h5>
<div class="outline-text-5" id="text-org2474dd1">
<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>);
@@ -1289,9 +1306,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgcd03a5b" class="outline-5">
<h5 id="orgcd03a5b">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-orgcd03a5b">
<div id="outline-container-org760610d" class="outline-5">
<h5 id="org760610d">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-org760610d">
<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;}
@@ -1331,17 +1348,22 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<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 id="outline-container-org6c0bd29" class="outline-4">
<h4 id="org6c0bd29">General CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org6c0bd29">
</div>
<div id="outline-container-org09a78ea" class="outline-5">
<h5 id="org09a78ea">Et Cetera</h5>
<div class="outline-text-5" id="text-org09a78ea">
<div id="outline-container-org55dee7b" class="outline-5">
<h5 id="org55dee7b">Et Cetera</h5>
<div class="outline-text-5" id="text-org55dee7b">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">hr</span> {
<pre class="src src-css"><span class="org-css-selector">tbody</span> { <span class="org-css-property">border-bottom</span>: 1px dotted var(<span class="org-variable-name">--grey1</span>); }
<span class="org-css-selector">thead</span> { <span class="org-css-property">border-bottom</span>: 1px solid var(<span class="org-variable-name">--grey1</span>); }
<span class="org-css-selector">th, td</span> { <span class="org-css-property">padding-right</span>: 4rem; }
<span class="org-css-selector">th.org-left</span> { <span class="org-css-property">text-align</span>: left; }
<span class="org-css-selector">hr</span> {
<span class="org-css-property">border</span>: <span class="org-highlight-numbers-number">0</span>;
<span class="org-css-property">border-top</span>: 2px dotted var(<span class="org-variable-name">--</span><span class="custom"><span class="custom-1">black</span></span>);
<span class="org-css-property">border-top</span>: 2px dotted var(<span class="org-variable-name">--grey1</span>);
}
<span class="org-css-selector">a, a:visited</span> {
@@ -1380,13 +1402,14 @@ 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-org1605872" class="outline-5">
<h5 id="org1605872">Utility Classes</h5>
<div class="outline-text-5" id="text-org1605872">
<div id="outline-container-org172437c" class="outline-5">
<h5 id="org172437c">Utility Classes</h5>
<div class="outline-text-5" id="text-org172437c">
<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;
@@ -1435,13 +1458,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<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 id="outline-container-org7037a5b" class="outline-4">
<h4 id="org7037a5b">Elements&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org7037a5b">
</div>
<div id="outline-container-org201f322" class="outline-5">
<h5 id="org201f322">Looking for Work</h5>
<div class="outline-text-5" id="text-org201f322">
<div id="outline-container-orgd71c9a0" class="outline-5">
<h5 id="orgd71c9a0">Looking for Work</h5>
<div class="outline-text-5" id="text-orgd71c9a0">
<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>);
@@ -1461,9 +1484,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org988d595" class="outline-5">
<h5 id="org988d595">Code Blocks</h5>
<div class="outline-text-5" id="text-org988d595">
<div id="outline-container-org40f74a8" class="outline-5">
<h5 id="org40f74a8">Code Blocks</h5>
<div class="outline-text-5" id="text-org40f74a8">
<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>: monospace;
@@ -1473,9 +1496,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgd411ad4" class="outline-5">
<h5 id="orgd411ad4">Publish/modified Date</h5>
<div class="outline-text-5" id="text-orgd411ad4">
<div id="outline-container-org99d9f1d" class="outline-5">
<h5 id="org99d9f1d">Publish/modified Date</h5>
<div class="outline-text-5" id="text-org99d9f1d">
<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;
@@ -1484,9 +1507,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgf4949d5" class="outline-5">
<h5 id="orgf4949d5">Table of Contents</h5>
<div class="outline-text-5" id="text-orgf4949d5">
<div id="outline-container-org62e295a" class="outline-5">
<h5 id="org62e295a">Table of Contents</h5>
<div class="outline-text-5" id="text-org62e295a">
<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>;
@@ -1537,9 +1560,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org7cb938d" class="outline-5">
<h5 id="org7cb938d">To-Dos</h5>
<div class="outline-text-5" id="text-org7cb938d">
<div id="outline-container-orgca69abe" class="outline-5">
<h5 id="orgca69abe">To-Dos</h5>
<div class="outline-text-5" id="text-orgca69abe">
<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>); }
@@ -1560,7 +1583,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-21</div><hr>
<div id='footer'><div id='modified-date'>Last modified: 2025-11-27</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>