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

Hopefully fix table on mobile

Browse Source
This commit is contained in:
Akko
2025-11-27 17:49:40 +01:00
parent 17d6399458
commit 65d6a19f44
55 changed files with 1291 additions and 1416 deletions
Download Patch File Download Diff File Expand all files Collapse all files

250
html/source.html
View File

@@ -209,18 +209,18 @@
<a class="navbar-link" href="/sitemap.html">Sitemap</a>
<a class="navbar-link" href="/friends.html">Webring</a>
<span id="looking-for-work">
<a href="/work/looking_for_work.html"><b>Looking for Work</b></a> — software, sysadmin, other — €30/hr — <i>2hr free!</i>
<a href="/work/looking_for_work.html"><b>Looking for Work</b></a> — software, sysadmin, other — <i>2hr free!</i>
</span>
</div>
</div>
<div id="content" class="content">
<div id="outline-container-org554f3ce" class="outline-2">
<h2 id="org554f3ce">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-org554f3ce">
<div id="outline-container-orgfe47489" class="outline-2">
<h2 id="orgfe47489">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-orgfe47489">
</div>
<div id="outline-container-orged7bd8f" class="outline-3">
<h3 id="orged7bd8f">Introduction</h3>
<div class="outline-text-3" id="text-orged7bd8f">
<div id="outline-container-orgd62adb3" class="outline-3">
<h3 id="orgd62adb3">Introduction</h3>
<div class="outline-text-3" id="text-orgd62adb3">
<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>
@@ -228,7 +228,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="org78777cb">
<pre class="example" id="org4a4b7dc">
.
|-- 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/.
@@ -246,14 +246,14 @@ This page is self-contained; the only dependency is <code>ox-publish</code>. The
</div>
</div>
</div>
<div id="outline-container-orgb18e273" class="outline-3">
<h3 id="orgb18e273">Export Commands</h3>
<div class="outline-text-3" id="text-orgb18e273">
<div id="outline-container-org58a9806" class="outline-3">
<h3 id="org58a9806">Export Commands</h3>
<div class="outline-text-3" id="text-org58a9806">
<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="org2ea948f">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org1ae8bad">&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>
@@ -264,22 +264,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="org0f3aa49">&lt;&lt;blog-scaffolding&gt;&gt;
<pre class="src src-emacs-lisp" id="org73d792d">&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-org59ada8c" class="outline-3">
<h3 id="org59ada8c">Elisp</h3>
<div class="outline-text-3" id="text-org59ada8c">
<div id="outline-container-org0b5f3a3" class="outline-3">
<h3 id="org0b5f3a3">Elisp</h3>
<div class="outline-text-3" id="text-org0b5f3a3">
</div>
<div id="outline-container-orgafca541" class="outline-4">
<h4 id="orgafca541">Basic Settings/Scaffolding&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgafca541">
<div id="outline-container-orga92389c" class="outline-4">
<h4 id="orga92389c">Basic Settings/Scaffolding&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orga92389c">
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org015c28f"><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="org92375ab"><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;
@@ -380,18 +380,18 @@ Currently the habit tracker table also gets erronously cached.
</div>
</div>
</div>
<div id="outline-container-orgd336d7c" class="outline-3">
<h3 id="orgd336d7c">Features</h3>
<div class="outline-text-3" id="text-orgd336d7c">
<div id="outline-container-org20bfc1b" class="outline-3">
<h3 id="org20bfc1b">Features</h3>
<div class="outline-text-3" id="text-org20bfc1b">
</div>
<div id="outline-container-orgffdbf85" class="outline-4">
<h4 id="orgffdbf85">Sitemap&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgffdbf85">
<div id="outline-container-org6f1f605" class="outline-4">
<h4 id="org6f1f605">Sitemap&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org6f1f605">
<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="orgd848de5"><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="org1150aa0"><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>
@@ -426,9 +426,9 @@ Files with <code>#+FILETAGS: :no-sitemap:</code> at the top will be excluded fro
</div>
</div>
</div>
<div id="outline-container-org47263d2" class="outline-4">
<h4 id="org47263d2">Tag-based Section Control&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org47263d2">
<div id="outline-container-org95d3de7" class="outline-4">
<h4 id="org95d3de7">Tag-based Section Control&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org95d3de7">
<p>
Org-mode headers support tags:
</p>
@@ -466,9 +466,9 @@ We will hide the tags themselves:
</div>
</div>
</div>
<div id="outline-container-org2d0301d" class="outline-4">
<h4 id="org2d0301d">Header Styling Tags&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org2d0301d">
<div id="outline-container-orgc00796e" class="outline-4">
<h4 id="orgc00796e">Header Styling Tags&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgc00796e">
<p>
Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code> at the top level.
</p>
@@ -488,16 +488,16 @@ Tags for granular styling. This page has <code>:h4left:h5left:h3underline:</code
</div>
</div>
</div>
<div id="outline-container-org7053edb" class="outline-4">
<h4 id="org7053edb">Journal&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org7053edb">
<div id="outline-container-org4bbbc67" class="outline-4">
<h4 id="org4bbbc67">Journal&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org4bbbc67">
<p>
Here&rsquo;s a template for the journal files, as reference for what follows:
</p>
</div>
<div id="outline-container-org4b9163f" class="outline-5">
<h5 id="org4b9163f">Template&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org4b9163f">
<div id="outline-container-org9780526" class="outline-5">
<h5 id="org9780526">Template&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org9780526">
<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>
@@ -548,9 +548,9 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<div id="outline-container-orgd9cb96d" class="outline-5">
<h5 id="orgd9cb96d">Styling</h5>
<div class="outline-text-5" id="text-orgd9cb96d">
<div id="outline-container-org449fbe5" class="outline-5">
<h5 id="org449fbe5">Styling</h5>
<div class="outline-text-5" id="text-org449fbe5">
<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;
@@ -583,18 +583,18 @@ Here&rsquo;s a template for the journal files, as reference for what follows:
</div>
</div>
</div>
<div id="outline-container-org611824e" class="outline-4">
<h4 id="org611824e">Habit Tracker&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org611824e">
<div id="outline-container-orgdd602ed" class="outline-4">
<h4 id="orgdd602ed">Habit Tracker&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgdd602ed">
<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-org1cb00bf" class="outline-5">
<h5 id="org1cb00bf">Elisp&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org1cb00bf">
<div id="outline-container-org2a205bc" class="outline-5">
<h5 id="org2a205bc">Elisp&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org2a205bc">
<div class="org-src-container">
<pre class="src src-emacs-lisp" id="org10ae3de"><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="orge98826c"><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,14 +785,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">21</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">25</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-org162b258" class="outline-5">
<h5 id="org162b258">Expansion Section&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org162b258">
<div id="outline-container-org39a6ba4" class="outline-5">
<h5 id="org39a6ba4">Expansion Section&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org39a6ba4">
<p>
A bit of JS for enabling the expanding of entries.
</p>
@@ -834,9 +834,9 @@ A bit of JS for enabling the expanding of entries.
</div>
</div>
</div>
<div id="outline-container-orgf64180f" class="outline-5">
<h5 id="orgf64180f">CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-orgf64180f">
<div id="outline-container-org0f638b8" class="outline-5">
<h5 id="org0f638b8">CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h5>
<div class="outline-text-5" id="text-org0f638b8">
<p>
Color habit entries based on their completion status:
</p>
@@ -874,7 +874,7 @@ Style the cells, set legible text color, outline clickable:
<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">padding</span>: .2em;
<span class="org-css-property">max-width</span>: 22px;
}
@@ -912,9 +912,9 @@ Style the cells, set legible text color, outline clickable:
</div>
</div>
</div>
<div id="outline-container-org5c1e768" class="outline-4">
<h4 id="org5c1e768">Header Collapsing&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org5c1e768">
<div id="outline-container-orgec80dbd" class="outline-4">
<h4 id="orgec80dbd">Header Collapsing&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgec80dbd">
<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>
@@ -1033,9 +1033,9 @@ Sections can be expanded and collapsed by clicking on their headers; this will a
</div>
</div>
</div>
<div id="outline-container-org689fb7a" class="outline-4">
<h4 id="org689fb7a">Hover Notes&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org689fb7a">
<div id="outline-container-orgf2dd8e8" class="outline-4">
<h4 id="orgf2dd8e8">Hover Notes&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-orgf2dd8e8">
<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>
@@ -1108,17 +1108,17 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orga3ac252" class="outline-3">
<h3 id="orga3ac252">Appearance</h3>
<div class="outline-text-3" id="text-orga3ac252">
<div id="outline-container-org12f27d0" class="outline-3">
<h3 id="org12f27d0">Appearance</h3>
<div class="outline-text-3" id="text-org12f27d0">
</div>
<div id="outline-container-org3bee62a" class="outline-4">
<h4 id="org3bee62a">Global&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org3bee62a">
<div id="outline-container-org520a091" class="outline-4">
<h4 id="org520a091">Global&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org520a091">
</div>
<div id="outline-container-org7219aed" class="outline-5">
<h5 id="org7219aed">Variables</h5>
<div class="outline-text-5" id="text-org7219aed">
<div id="outline-container-orge7c063a" class="outline-5">
<h5 id="orge7c063a">Variables</h5>
<div class="outline-text-5" id="text-orge7c063a">
<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;
@@ -1134,9 +1134,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org56bb95d" class="outline-5">
<h5 id="org56bb95d">Color Variables</h5>
<div class="outline-text-5" id="text-org56bb95d">
<div id="outline-container-org4fc8293" class="outline-5">
<h5 id="org4fc8293">Color Variables</h5>
<div class="outline-text-5" id="text-org4fc8293">
<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>;
@@ -1180,9 +1180,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgf601d46" class="outline-5">
<h5 id="orgf601d46">Background image</h5>
<div class="outline-text-5" id="text-orgf601d46">
<div id="outline-container-org66731c6" class="outline-5">
<h5 id="org66731c6">Background image</h5>
<div class="outline-text-5" id="text-org66731c6">
<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> {
@@ -1217,8 +1217,8 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
<ul class="org-ul">
<li><a id="orga18284a"></a><span class="todo TODO">TODO</span> This is a weird approach and has some issues<br>
<div class="outline-text-6" id="text-orga18284a">
<li><a id="org0be448b"></a><span class="todo TODO">TODO</span> This is a weird approach and has some issues<br>
<div class="outline-text-6" id="text-org0be448b">
<ul class="org-ul">
<li>White line in center in some setups</li>
<li>Crunchy lines depending on DPI</li>
@@ -1227,9 +1227,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</li>
</ul>
</div>
<div id="outline-container-orgcdfad92" class="outline-5">
<h5 id="orgcdfad92">Fonts</h5>
<div class="outline-text-5" id="text-orgcdfad92">
<div id="outline-container-org29803b7" class="outline-5">
<h5 id="org29803b7">Fonts</h5>
<div class="outline-text-5" id="text-org29803b7">
<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>);
@@ -1242,9 +1242,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org5682b05" class="outline-5">
<h5 id="org5682b05">Header/Content/Footer blocks</h5>
<div class="outline-text-5" id="text-org5682b05">
<div id="outline-container-org2715893" class="outline-5">
<h5 id="org2715893">Header/Content/Footer blocks</h5>
<div class="outline-text-5" id="text-org2715893">
<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;
@@ -1307,13 +1307,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org8f4537f" class="outline-4">
<h4 id="org8f4537f">Colors&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org8f4537f">
<div id="outline-container-org991396b" class="outline-4">
<h4 id="org991396b">Colors&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org991396b">
</div>
<div id="outline-container-org1f0e862" class="outline-5">
<h5 id="org1f0e862">Color Assignments</h5>
<div class="outline-text-5" id="text-org1f0e862">
<div id="outline-container-orgac20299" class="outline-5">
<h5 id="orgac20299">Color Assignments</h5>
<div class="outline-text-5" id="text-orgac20299">
<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>);
@@ -1324,9 +1324,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org184444f" class="outline-5">
<h5 id="org184444f">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-org184444f">
<div id="outline-container-org35dddbc" class="outline-5">
<h5 id="org35dddbc">Syntax Highlighting</h5>
<div class="outline-text-5" id="text-org35dddbc">
<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;}
@@ -1366,13 +1366,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org6be48f8" class="outline-4">
<h4 id="org6be48f8">General CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org6be48f8">
<div id="outline-container-org1b49d08" class="outline-4">
<h4 id="org1b49d08">General CSS&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org1b49d08">
</div>
<div id="outline-container-orgfe5ae1b" class="outline-5">
<h5 id="orgfe5ae1b">Et Cetera</h5>
<div class="outline-text-5" id="text-orgfe5ae1b">
<div id="outline-container-org6836285" class="outline-5">
<h5 id="org6836285">Et Cetera</h5>
<div class="outline-text-5" id="text-org6836285">
<div class="org-src-container">
<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>); }
@@ -1425,9 +1425,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orga07248b" class="outline-5">
<h5 id="orga07248b">Utility Classes</h5>
<div class="outline-text-5" id="text-orga07248b">
<div id="outline-container-orgf20ce3c" class="outline-5">
<h5 id="orgf20ce3c">Utility Classes</h5>
<div class="outline-text-5" id="text-orgf20ce3c">
<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;
@@ -1476,13 +1476,13 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org547d137" class="outline-4">
<h4 id="org547d137">Elements&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org547d137">
<div id="outline-container-org46e56d6" class="outline-4">
<h4 id="org46e56d6">Elements&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org46e56d6">
</div>
<div id="outline-container-org31a63f5" class="outline-5">
<h5 id="org31a63f5">Looking for Work</h5>
<div class="outline-text-5" id="text-org31a63f5">
<div id="outline-container-org545300d" class="outline-5">
<h5 id="org545300d">Looking for Work</h5>
<div class="outline-text-5" id="text-org545300d">
<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>);
@@ -1502,9 +1502,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgb0af65b" class="outline-5">
<h5 id="orgb0af65b">Code Blocks</h5>
<div class="outline-text-5" id="text-orgb0af65b">
<div id="outline-container-orgb393005" class="outline-5">
<h5 id="orgb393005">Code Blocks</h5>
<div class="outline-text-5" id="text-orgb393005">
<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;
@@ -1514,9 +1514,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org04c9528" class="outline-5">
<h5 id="org04c9528">Publish/modified Date</h5>
<div class="outline-text-5" id="text-org04c9528">
<div id="outline-container-org3667057" class="outline-5">
<h5 id="org3667057">Publish/modified Date</h5>
<div class="outline-text-5" id="text-org3667057">
<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;
@@ -1525,9 +1525,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-orgefcb551" class="outline-5">
<h5 id="orgefcb551">Table of Contents</h5>
<div class="outline-text-5" id="text-orgefcb551">
<div id="outline-container-org029eb90" class="outline-5">
<h5 id="org029eb90">Table of Contents</h5>
<div class="outline-text-5" id="text-org029eb90">
<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>;
@@ -1578,9 +1578,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org7d06f1a" class="outline-5">
<h5 id="org7d06f1a">To-Dos</h5>
<div class="outline-text-5" id="text-org7d06f1a">
<div id="outline-container-org7e32829" class="outline-5">
<h5 id="org7e32829">To-Dos</h5>
<div class="outline-text-5" id="text-org7e32829">
<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>); }
@@ -1589,9 +1589,9 @@ document.addEventListener(<span class="org-string">'DOMContentLoaded'</span>, en
</div>
</div>
</div>
<div id="outline-container-org9c05c5e" class="outline-4">
<h4 id="org9c05c5e">No unstyled content&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org9c05c5e">
<div id="outline-container-org3bb0253" class="outline-4">
<h4 id="org3bb0253">No unstyled content&#xa0;&#xa0;&#xa0;<span class="tag"><span class="autocollapse">autocollapse</span></span></h4>
<div class="outline-text-4" id="text-org3bb0253">
<div class="org-src-container">
<pre class="src src-css"><span class="org-css-selector">html</span> {
<span class="org-css-property">visibility</span>: visible;