From 1dca4b0d58de336f61ca60d8084307f1f367459b Mon Sep 17 00:00:00 2001
From: Akko <akko@nakadashi.lol>
Date: Mon, 21 Mar 2022 21:37:39 +0100
Subject: [PATCH] Experiments~

---
 html/about.html             |  13 +-
 html/blogroll.html          | 222 ++++++++++++++++++++++++++++++++++
 html/experiments.html       | 223 ++++++++++++++++++++++++++++++++++
 html/index.html             |  41 ++++---
 html/posts/elog-1-blog.html |  44 +++----
 html/posts/framework.html   | 177 +++++++++++++++------------
 html/posts/resources.html   |  13 +-
 html/posts/test.html        | 232 +++++++++++++++++++++++++++++++++++
 html/sitemap.html           |  18 ++-
 html/snippets.html          | 234 ++++++++++++++++++++++++++++++++++++
 html/static/style.css       |  14 ++-
 html/todo.html              | 223 ++++++++++++++++++++++++++++++++++
 org/blogroll.org            |   4 +
 org/experiments.org         |   5 +
 org/posts/elog-1-blog.org   |  19 ++-
 org/posts/framework.org     |  11 +-
 org/posts/test.org          |   7 ++
 org/sitemap.org             |   5 +
 org/snippets.org            |   7 ++
 org/todo.org                |   3 +
 static/style.css            |  14 ++-
 util/postamble.html         |   4 +-
 util/preamble.html          |   7 +-
 23 files changed, 1379 insertions(+), 161 deletions(-)
 create mode 100644 html/blogroll.html
 create mode 100644 html/experiments.html
 create mode 100644 html/posts/test.html
 create mode 100644 html/snippets.html
 create mode 100644 html/todo.html
 create mode 100644 org/blogroll.org
 create mode 100644 org/experiments.org
 create mode 100644 org/posts/test.org
 create mode 100644 org/snippets.org
 create mode 100644 org/todo.org
diff --git a/html/about.html b/html/about.html
index 58c1779..33c1c4f 100644
--- a/html/about.html
+++ b/html/about.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 19:57 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>About</title>
@@ -195,9 +195,10 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
@@ -211,7 +212,9 @@ dfdfd
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/blogroll.html b/html/blogroll.html
new file mode 100644
index 0000000..a84f73a
--- /dev/null
+++ b/html/blogroll.html
@@ -0,0 +1,222 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- 2022-03-21 Mon 21:17 -->
+<meta charset="utf-8" />
+<meta name="viewport" content="width=100%, initial-scale=0.7" />
+<title>Blogroll</title>
+<meta name="generator" content="Org Mode" />
+<style>
+  #content { max-width: 60em; margin: auto; }
+  .title  { text-align: center;
+             margin-bottom: .2em; }
+  .subtitle { text-align: center;
+              font-size: medium;
+              font-weight: bold;
+              margin-top:0; }
+  .todo   { font-family: monospace; color: red; }
+  .done   { font-family: monospace; color: green; }
+  .priority { font-family: monospace; color: orange; }
+  .tag    { background-color: #eee; font-family: monospace;
+            padding: 2px; font-size: 80%; font-weight: normal; }
+  .timestamp { color: #bebebe; }
+  .timestamp-kwd { color: #5f9ea0; }
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
+  .underline { text-decoration: underline; }
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
+  p.verse { margin-left: 3%; }
+  pre {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    background-color: #f2f2f2;
+    padding: 8pt;
+    font-family: monospace;
+    overflow: auto;
+    margin: 1.2em;
+  }
+  pre.src {
+    position: relative;
+    overflow: auto;
+  }
+  pre.src:before {
+    display: none;
+    position: absolute;
+    top: -8px;
+    right: 12px;
+    padding: 3px;
+    color: #555;
+    background-color: #f2f2f299;
+  }
+  pre.src:hover:before { display: inline; margin-top: 14px;}
+  /* Languages per Org manual */
+  pre.src-asymptote:before { content: 'Asymptote'; }
+  pre.src-awk:before { content: 'Awk'; }
+  pre.src-authinfo::before { content: 'Authinfo'; }
+  pre.src-C:before { content: 'C'; }
+  /* pre.src-C++ doesn't work in CSS */
+  pre.src-clojure:before { content: 'Clojure'; }
+  pre.src-css:before { content: 'CSS'; }
+  pre.src-D:before { content: 'D'; }
+  pre.src-ditaa:before { content: 'ditaa'; }
+  pre.src-dot:before { content: 'Graphviz'; }
+  pre.src-calc:before { content: 'Emacs Calc'; }
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
+  pre.src-fortran:before { content: 'Fortran'; }
+  pre.src-gnuplot:before { content: 'gnuplot'; }
+  pre.src-haskell:before { content: 'Haskell'; }
+  pre.src-hledger:before { content: 'hledger'; }
+  pre.src-java:before { content: 'Java'; }
+  pre.src-js:before { content: 'Javascript'; }
+  pre.src-latex:before { content: 'LaTeX'; }
+  pre.src-ledger:before { content: 'Ledger'; }
+  pre.src-lisp:before { content: 'Lisp'; }
+  pre.src-lilypond:before { content: 'Lilypond'; }
+  pre.src-lua:before { content: 'Lua'; }
+  pre.src-matlab:before { content: 'MATLAB'; }
+  pre.src-mscgen:before { content: 'Mscgen'; }
+  pre.src-ocaml:before { content: 'Objective Caml'; }
+  pre.src-octave:before { content: 'Octave'; }
+  pre.src-org:before { content: 'Org mode'; }
+  pre.src-oz:before { content: 'OZ'; }
+  pre.src-plantuml:before { content: 'Plantuml'; }
+  pre.src-processing:before { content: 'Processing.js'; }
+  pre.src-python:before { content: 'Python'; }
+  pre.src-R:before { content: 'R'; }
+  pre.src-ruby:before { content: 'Ruby'; }
+  pre.src-sass:before { content: 'Sass'; }
+  pre.src-scheme:before { content: 'Scheme'; }
+  pre.src-screen:before { content: 'Gnu Screen'; }
+  pre.src-sed:before { content: 'Sed'; }
+  pre.src-sh:before { content: 'shell'; }
+  pre.src-sql:before { content: 'SQL'; }
+  pre.src-sqlite:before { content: 'SQLite'; }
+  /* additional languages in org.el's org-babel-load-languages alist */
+  pre.src-forth:before { content: 'Forth'; }
+  pre.src-io:before { content: 'IO'; }
+  pre.src-J:before { content: 'J'; }
+  pre.src-makefile:before { content: 'Makefile'; }
+  pre.src-maxima:before { content: 'Maxima'; }
+  pre.src-perl:before { content: 'Perl'; }
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
+  pre.src-scala:before { content: 'Scala'; }
+  pre.src-shell:before { content: 'Shell Script'; }
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
+  /* additional language identifiers per "defun org-babel-execute"
+       in ob-*.el */
+  pre.src-cpp:before  { content: 'C++'; }
+  pre.src-abc:before  { content: 'ABC'; }
+  pre.src-coq:before  { content: 'Coq'; }
+  pre.src-groovy:before  { content: 'Groovy'; }
+  /* additional language identifiers from org-babel-shell-names in
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
+     the execution function name together. */
+  pre.src-bash:before  { content: 'bash'; }
+  pre.src-csh:before  { content: 'csh'; }
+  pre.src-ash:before  { content: 'ash'; }
+  pre.src-dash:before  { content: 'dash'; }
+  pre.src-ksh:before  { content: 'ksh'; }
+  pre.src-mksh:before  { content: 'mksh'; }
+  pre.src-posh:before  { content: 'posh'; }
+  /* Additional Emacs modes also supported by the LaTeX listings package */
+  pre.src-ada:before { content: 'Ada'; }
+  pre.src-asm:before { content: 'Assembler'; }
+  pre.src-caml:before { content: 'Caml'; }
+  pre.src-delphi:before { content: 'Delphi'; }
+  pre.src-html:before { content: 'HTML'; }
+  pre.src-idl:before { content: 'IDL'; }
+  pre.src-mercury:before { content: 'Mercury'; }
+  pre.src-metapost:before { content: 'MetaPost'; }
+  pre.src-modula-2:before { content: 'Modula-2'; }
+  pre.src-pascal:before { content: 'Pascal'; }
+  pre.src-ps:before { content: 'PostScript'; }
+  pre.src-prolog:before { content: 'Prolog'; }
+  pre.src-simula:before { content: 'Simula'; }
+  pre.src-tcl:before { content: 'tcl'; }
+  pre.src-tex:before { content: 'TeX'; }
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
+  pre.src-verilog:before { content: 'Verilog'; }
+  pre.src-vhdl:before { content: 'VHDL'; }
+  pre.src-xml:before { content: 'XML'; }
+  pre.src-nxml:before { content: 'XML'; }
+  /* add a generic configuration mode; LaTeX export needs an additional
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
+  pre.src-conf:before { content: 'Configuration File'; }
+
+  table { border-collapse:collapse; }
+  caption.t-above { caption-side: top; }
+  caption.t-bottom { caption-side: bottom; }
+  td, th { vertical-align:top;  }
+  th.org-right  { text-align: center;  }
+  th.org-left   { text-align: center;   }
+  th.org-center { text-align: center; }
+  td.org-right  { text-align: right;  }
+  td.org-left   { text-align: left;   }
+  td.org-center { text-align: center; }
+  dt { font-weight: bold; }
+  .footpara { display: inline; }
+  .footdef  { margin-bottom: 1em; }
+  .figure { padding: 1em; }
+  .figure p { text-align: center; }
+  .equation-container {
+    display: table;
+    text-align: center;
+    width: 100%;
+  }
+  .equation {
+    vertical-align: middle;
+  }
+  .equation-label {
+    display: table-cell;
+    text-align: right;
+    vertical-align: middle;
+  }
+  .inlinetask {
+    padding: 10px;
+    border: 2px solid gray;
+    margin: 10px;
+    background: #ffffcc;
+  }
+  #org-div-home-and-up
+   { text-align: right; font-size: 70%; white-space: nowrap; }
+  textarea { overflow-x: auto; }
+  .linenr { font-size: smaller }
+  .code-highlighted { background-color: #ffff00; }
+  .org-info-js_info-navigation { border-style: none; }
+  #org-info-js_console-label
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
+  .org-info-js_search-highlight
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
+  .org-svg { width: 90%; }
+</style>
+<link rel="stylesheet" href="/static/style.css" type="text/css"/>
+</head>
+<body>
+<div id="preamble" class="status">
+<div id="header">
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
+</div>
+</div>
+<div id="content" class="content">
+<p>
+last modified: 2022-03-21
+</p>
+</div>
+<div id="postamble" class="status">
+<div id="footer">
+  <hr>
+  If you have any comments about this page, you can email me at: <br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
+
+  All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
+  Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
+</div>
+</div>
+</body>
+</html>
diff --git a/html/experiments.html b/html/experiments.html
new file mode 100644
index 0000000..04417de
--- /dev/null
+++ b/html/experiments.html
@@ -0,0 +1,223 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- 2022-03-21 Mon 20:31 -->
+<meta charset="utf-8" />
+<meta name="viewport" content="width=100%, initial-scale=0.7" />
+<title>Experiments</title>
+<meta name="generator" content="Org Mode" />
+<style>
+  #content { max-width: 60em; margin: auto; }
+  .title  { text-align: center;
+             margin-bottom: .2em; }
+  .subtitle { text-align: center;
+              font-size: medium;
+              font-weight: bold;
+              margin-top:0; }
+  .todo   { font-family: monospace; color: red; }
+  .done   { font-family: monospace; color: green; }
+  .priority { font-family: monospace; color: orange; }
+  .tag    { background-color: #eee; font-family: monospace;
+            padding: 2px; font-size: 80%; font-weight: normal; }
+  .timestamp { color: #bebebe; }
+  .timestamp-kwd { color: #5f9ea0; }
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
+  .underline { text-decoration: underline; }
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
+  p.verse { margin-left: 3%; }
+  pre {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    background-color: #f2f2f2;
+    padding: 8pt;
+    font-family: monospace;
+    overflow: auto;
+    margin: 1.2em;
+  }
+  pre.src {
+    position: relative;
+    overflow: auto;
+  }
+  pre.src:before {
+    display: none;
+    position: absolute;
+    top: -8px;
+    right: 12px;
+    padding: 3px;
+    color: #555;
+    background-color: #f2f2f299;
+  }
+  pre.src:hover:before { display: inline; margin-top: 14px;}
+  /* Languages per Org manual */
+  pre.src-asymptote:before { content: 'Asymptote'; }
+  pre.src-awk:before { content: 'Awk'; }
+  pre.src-authinfo::before { content: 'Authinfo'; }
+  pre.src-C:before { content: 'C'; }
+  /* pre.src-C++ doesn't work in CSS */
+  pre.src-clojure:before { content: 'Clojure'; }
+  pre.src-css:before { content: 'CSS'; }
+  pre.src-D:before { content: 'D'; }
+  pre.src-ditaa:before { content: 'ditaa'; }
+  pre.src-dot:before { content: 'Graphviz'; }
+  pre.src-calc:before { content: 'Emacs Calc'; }
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
+  pre.src-fortran:before { content: 'Fortran'; }
+  pre.src-gnuplot:before { content: 'gnuplot'; }
+  pre.src-haskell:before { content: 'Haskell'; }
+  pre.src-hledger:before { content: 'hledger'; }
+  pre.src-java:before { content: 'Java'; }
+  pre.src-js:before { content: 'Javascript'; }
+  pre.src-latex:before { content: 'LaTeX'; }
+  pre.src-ledger:before { content: 'Ledger'; }
+  pre.src-lisp:before { content: 'Lisp'; }
+  pre.src-lilypond:before { content: 'Lilypond'; }
+  pre.src-lua:before { content: 'Lua'; }
+  pre.src-matlab:before { content: 'MATLAB'; }
+  pre.src-mscgen:before { content: 'Mscgen'; }
+  pre.src-ocaml:before { content: 'Objective Caml'; }
+  pre.src-octave:before { content: 'Octave'; }
+  pre.src-org:before { content: 'Org mode'; }
+  pre.src-oz:before { content: 'OZ'; }
+  pre.src-plantuml:before { content: 'Plantuml'; }
+  pre.src-processing:before { content: 'Processing.js'; }
+  pre.src-python:before { content: 'Python'; }
+  pre.src-R:before { content: 'R'; }
+  pre.src-ruby:before { content: 'Ruby'; }
+  pre.src-sass:before { content: 'Sass'; }
+  pre.src-scheme:before { content: 'Scheme'; }
+  pre.src-screen:before { content: 'Gnu Screen'; }
+  pre.src-sed:before { content: 'Sed'; }
+  pre.src-sh:before { content: 'shell'; }
+  pre.src-sql:before { content: 'SQL'; }
+  pre.src-sqlite:before { content: 'SQLite'; }
+  /* additional languages in org.el's org-babel-load-languages alist */
+  pre.src-forth:before { content: 'Forth'; }
+  pre.src-io:before { content: 'IO'; }
+  pre.src-J:before { content: 'J'; }
+  pre.src-makefile:before { content: 'Makefile'; }
+  pre.src-maxima:before { content: 'Maxima'; }
+  pre.src-perl:before { content: 'Perl'; }
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
+  pre.src-scala:before { content: 'Scala'; }
+  pre.src-shell:before { content: 'Shell Script'; }
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
+  /* additional language identifiers per "defun org-babel-execute"
+       in ob-*.el */
+  pre.src-cpp:before  { content: 'C++'; }
+  pre.src-abc:before  { content: 'ABC'; }
+  pre.src-coq:before  { content: 'Coq'; }
+  pre.src-groovy:before  { content: 'Groovy'; }
+  /* additional language identifiers from org-babel-shell-names in
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
+     the execution function name together. */
+  pre.src-bash:before  { content: 'bash'; }
+  pre.src-csh:before  { content: 'csh'; }
+  pre.src-ash:before  { content: 'ash'; }
+  pre.src-dash:before  { content: 'dash'; }
+  pre.src-ksh:before  { content: 'ksh'; }
+  pre.src-mksh:before  { content: 'mksh'; }
+  pre.src-posh:before  { content: 'posh'; }
+  /* Additional Emacs modes also supported by the LaTeX listings package */
+  pre.src-ada:before { content: 'Ada'; }
+  pre.src-asm:before { content: 'Assembler'; }
+  pre.src-caml:before { content: 'Caml'; }
+  pre.src-delphi:before { content: 'Delphi'; }
+  pre.src-html:before { content: 'HTML'; }
+  pre.src-idl:before { content: 'IDL'; }
+  pre.src-mercury:before { content: 'Mercury'; }
+  pre.src-metapost:before { content: 'MetaPost'; }
+  pre.src-modula-2:before { content: 'Modula-2'; }
+  pre.src-pascal:before { content: 'Pascal'; }
+  pre.src-ps:before { content: 'PostScript'; }
+  pre.src-prolog:before { content: 'Prolog'; }
+  pre.src-simula:before { content: 'Simula'; }
+  pre.src-tcl:before { content: 'tcl'; }
+  pre.src-tex:before { content: 'TeX'; }
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
+  pre.src-verilog:before { content: 'Verilog'; }
+  pre.src-vhdl:before { content: 'VHDL'; }
+  pre.src-xml:before { content: 'XML'; }
+  pre.src-nxml:before { content: 'XML'; }
+  /* add a generic configuration mode; LaTeX export needs an additional
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
+  pre.src-conf:before { content: 'Configuration File'; }
+
+  table { border-collapse:collapse; }
+  caption.t-above { caption-side: top; }
+  caption.t-bottom { caption-side: bottom; }
+  td, th { vertical-align:top;  }
+  th.org-right  { text-align: center;  }
+  th.org-left   { text-align: center;   }
+  th.org-center { text-align: center; }
+  td.org-right  { text-align: right;  }
+  td.org-left   { text-align: left;   }
+  td.org-center { text-align: center; }
+  dt { font-weight: bold; }
+  .footpara { display: inline; }
+  .footdef  { margin-bottom: 1em; }
+  .figure { padding: 1em; }
+  .figure p { text-align: center; }
+  .equation-container {
+    display: table;
+    text-align: center;
+    width: 100%;
+  }
+  .equation {
+    vertical-align: middle;
+  }
+  .equation-label {
+    display: table-cell;
+    text-align: right;
+    vertical-align: middle;
+  }
+  .inlinetask {
+    padding: 10px;
+    border: 2px solid gray;
+    margin: 10px;
+    background: #ffffcc;
+  }
+  #org-div-home-and-up
+   { text-align: right; font-size: 70%; white-space: nowrap; }
+  textarea { overflow-x: auto; }
+  .linenr { font-size: smaller }
+  .code-highlighted { background-color: #ffff00; }
+  .org-info-js_info-navigation { border-style: none; }
+  #org-info-js_console-label
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
+  .org-info-js_search-highlight
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
+  .org-svg { width: 90%; }
+</style>
+<link rel="stylesheet" href="/static/style.css" type="text/css"/>
+</head>
+<body>
+<div id="preamble" class="status">
+<div id="header">
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
+</div>
+</div>
+<div id="content" class="content">
+<div class="org-src-container">
+<pre class="src src-bash"><span class="org-type">echo</span> $<span class="org-highlight-numbers-number">0</span>
+</pre>
+</div>
+</div>
+<div id="postamble" class="status">
+<div id="footer">
+  <hr>
+  If you have any comments about this page, you can email me at: <br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
+
+  All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
+  Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
+</div>
+</div>
+</body>
+</html>
diff --git a/html/index.html b/html/index.html
index 39e3b59..8f48847 100644
--- a/html/index.html
+++ b/html/index.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 19:57 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>Index</title>
@@ -195,9 +195,10 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
@@ -208,9 +209,9 @@ cute blog <br>
 !
 </p>
 
-<div id="outline-container-org9556a34" class="outline-2">
-<h2 id="org9556a34">Here&rsquo;s some headers</h2>
-<div class="outline-text-2" id="text-org9556a34">
+<div id="outline-container-org479a427" class="outline-2">
+<h2 id="org479a427">Here&rsquo;s some headers</h2>
+<div class="outline-text-2" id="text-org479a427">
 <ol class="org-ol">
 <li>chuu</li>
 <li><p>
@@ -238,9 +239,9 @@ daisuki
 **</b>
 </p>
 </div>
-<div id="outline-container-orgf77ab46" class="outline-5">
-<h5 id="orgf77ab46">meme</h5>
-<div class="outline-text-5" id="text-orgf77ab46">
+<div id="outline-container-org5c2954f" class="outline-5">
+<h5 id="org5c2954f">meme</h5>
+<div class="outline-text-5" id="text-org5c2954f">
 <table>
 
 
@@ -276,16 +277,16 @@ daisuki
 </div>
 </div>
 
-<div id="outline-container-org1e7d48b" class="outline-2">
-<h2 id="org1e7d48b">memes</h2>
-<div class="outline-text-2" id="text-org1e7d48b">
+<div id="outline-container-orge21141f" class="outline-2">
+<h2 id="orge21141f">memes</h2>
+<div class="outline-text-2" id="text-orge21141f">
 </div>
-<div id="outline-container-orge42f176" class="outline-3">
-<h3 id="orge42f176"><span class="done DONE">DONE</span> chuu bf</h3>
+<div id="outline-container-org844df0b" class="outline-3">
+<h3 id="org844df0b"><span class="done DONE">DONE</span> chuu bf</h3>
 </div>
-<div id="outline-container-orgcad7216" class="outline-3">
-<h3 id="orgcad7216"><span class="todo TODO">TODO</span> awawahehehej~~~</h3>
-<div class="outline-text-3" id="text-orgcad7216">
+<div id="outline-container-org517069a" class="outline-3">
+<h3 id="org517069a"><span class="todo TODO">TODO</span> awawahehehej~~~</h3>
+<div class="outline-text-3" id="text-org517069a">
 <p>
 ~
 </p>
@@ -307,7 +308,9 @@ things done:
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/posts/elog-1-blog.html b/html/posts/elog-1-blog.html
index cf18c6e..f4da1ba 100644
--- a/html/posts/elog-1-blog.html
+++ b/html/posts/elog-1-blog.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 19:57 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>Emacs Log 1: This Blog</title>
@@ -195,29 +195,30 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
 
-<div id="outline-container-org06e856f" class="outline-2">
-<h2 id="org06e856f">Emacs Log 1: This Blog</h2>
-<div class="outline-text-2" id="text-org06e856f">
+<div id="outline-container-org2176c62" class="outline-2">
+<h2 id="org2176c62">Emacs Log 1: This Blog</h2>
+<div class="outline-text-2" id="text-org2176c62">
 <p>
 <span class="underline"><i><b>WARNING:</b></i></span> This blog post is still under construction!
 </p>
 
 <p>
-This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabilities.
+This blog is built on top of <code>org-mode</code>!
 </p>
 </div>
 </div>
 
-<div id="outline-container-orgd844055" class="outline-2">
-<h2 id="orgd844055">Appendix A: config.el snippet</h2>
-<div class="outline-text-2" id="text-orgd844055">
+<div id="outline-container-org7847899" class="outline-2">
+<h2 id="org7847899">Appendix A: config.el snippet</h2>
+<div class="outline-text-2" id="text-org7847899">
 <div class="org-src-container">
 <pre class="src src-emacs-lisp"><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>
 
@@ -243,6 +244,12 @@ This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabiliti
        <span class="org-builtin">:html-doctype</span> <span class="org-string">"html5"</span>
        <span class="org-builtin">:html-html5-fancy</span> t
 
+       <span class="org-builtin">:html-viewport</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-rainbow-delimiters-depth-2">(</span>width <span class="org-string">"100%"</span><span class="org-rainbow-delimiters-depth-2">)</span>
+                       <span class="org-rainbow-delimiters-depth-2">(</span>initial-scale <span class="org-string">"0.7"</span><span class="org-rainbow-delimiters-depth-2">)</span>
+                       <span class="org-rainbow-delimiters-depth-2">(</span>minimum-scale <span class="org-string">""</span><span class="org-rainbow-delimiters-depth-2">)</span>
+                       <span class="org-rainbow-delimiters-depth-2">(</span>maximum-scale <span class="org-string">""</span><span class="org-rainbow-delimiters-depth-2">)</span>
+                       <span class="org-rainbow-delimiters-depth-2">(</span>user-scalable <span class="org-string">""</span><span class="org-rainbow-delimiters-depth-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
+
        <span class="org-builtin">:language</span> <span class="org-string">"en"</span>
        <span class="org-builtin">:section-numbers</span> nil
 
@@ -262,7 +269,7 @@ This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabiliti
                  entry
                  <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">org-publish-find-title</span> entry project<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-rainbow-delimiters-depth-4">(</span><span class="org-constant">eq</span> style <span class="org-highlight-quoted-quote">'</span><span class="org-highlight-quoted-symbol">tree</span><span class="org-rainbow-delimiters-depth-4">)</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-constant">file-name-nondirectory</span> <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">directory-file-name</span> entry<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-4">(</span><span class="org-constant">capitalize</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-constant">file-name-nondirectory</span> <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">directory-file-name</span> entry<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>t entry<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-builtin">:headline-levels</span> <span class="org-highlight-numbers-number">4</span>
@@ -280,7 +287,7 @@ This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabiliti
 
       <span class="org-rainbow-delimiters-depth-4">(</span><span class="org-string">"blog"</span> <span class="org-builtin">:components</span> <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-string">"pages"</span> <span class="org-string">"static"</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-2">)</span><span class="org-rainbow-delimiters-depth-1">)</span>
 
-  <span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">setq</span> <span class="org-variable-name">org-publish-project-alist</span> <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-function-name">akko/blog-spec</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> <span class="org-variable-name">org-publish-project-alist</span> <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-function-name">akko/blog-spec</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">defun</span> <span class="org-function-name">akko/publish-blog</span> <span class="org-rainbow-delimiters-depth-2">()</span>
   <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-keyword">interactive</span><span class="org-rainbow-delimiters-depth-2">)</span>
@@ -293,13 +300,6 @@ This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabiliti
   <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">org-publish-remove-all-timestamps</span><span class="org-rainbow-delimiters-depth-2">)</span>
   <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-constant">org-publish-all</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">map!</span> <span class="org-builtin">:leader</span>
-      <span class="org-rainbow-delimiters-depth-2">(</span><span class="org-builtin">:prefix</span> <span class="org-rainbow-delimiters-depth-3">(</span><span class="org-string">"a"</span> . <span class="org-string">"akko"</span><span class="org-rainbow-delimiters-depth-3">)</span>
-       <span class="org-builtin">:desc</span> <span class="org-string">"Publish Blog"</span>
-       <span class="org-string">"b"</span> <span class="org-highlight-quoted-quote">#'</span><span class="org-highlight-quoted-symbol">akko/publish-blog</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> <span class="org-variable-name">org-html-htmlize-output-type</span> <span class="org-highlight-quoted-quote">'</span><span class="org-highlight-quoted-symbol">css</span><span class="org-rainbow-delimiters-depth-1">)</span>
-<span class="org-rainbow-delimiters-depth-1">(</span><span class="org-keyword">setq</span> <span class="org-variable-name">org-html-htmlize-font-prefix</span> <span class="org-string">"org-"</span><span class="org-rainbow-delimiters-depth-1">)</span>
 </pre>
 </div>
 </div>
@@ -309,7 +309,9 @@ This blog is built on top of <code>org-mode</code>&rsquo;s publishing capabiliti
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/posts/framework.html b/html/posts/framework.html
index 03e92e7..c7f3230 100644
--- a/html/posts/framework.html
+++ b/html/posts/framework.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 21:33 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>Framework Laptop Review</title>
@@ -195,20 +195,21 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
 
-<div id="outline-container-orgd2e60e4" class="outline-2">
-<h2 id="orgd2e60e4">My Experience with the Framework Laptop</h2>
-<div class="outline-text-2" id="text-orgd2e60e4">
+<div id="outline-container-orgd06c8c3" class="outline-2">
+<h2 id="orgd06c8c3">My Experience with the Framework Laptop</h2>
+<div class="outline-text-2" id="text-orgd06c8c3">
 </div>
-<div id="outline-container-org81cd437" class="outline-3">
-<h3 id="org81cd437">Ordering</h3>
-<div class="outline-text-3" id="text-org81cd437">
+<div id="outline-container-orge056d5c" class="outline-3">
+<h3 id="orge056d5c">Ordering</h3>
+<div class="outline-text-3" id="text-orge056d5c">
 <p>
 I&rsquo;d been eyeing the <a href="https:frame.work">Framework laptop</a> since somewhere in October 2021, but the EU release got delayed and they were very hesitant to give time estimates. I only managed to get my hands on it in late February, and I ended up having to have it delivered to France. I understand the difficulty of setting up logistics especially these days, but I broke my previous laptop and being stuck in limbo like this was not fun.
 </p>
@@ -220,13 +221,13 @@ I asked their customer service to make a small change to the delivery address, b
 </div>
 </div>
 
-<div id="outline-container-org04dc2d9" class="outline-3">
-<h3 id="org04dc2d9">Set-up</h3>
-<div class="outline-text-3" id="text-org04dc2d9">
+<div id="outline-container-org624a9f5" class="outline-3">
+<h3 id="org624a9f5">Set-up</h3>
+<div class="outline-text-3" id="text-org624a9f5">
 </div>
-<div id="outline-container-org39fd835" class="outline-4">
-<h4 id="org39fd835">Hardware</h4>
-<div class="outline-text-4" id="text-org39fd835">
+<div id="outline-container-orgebbeaa3" class="outline-4">
+<h4 id="orgebbeaa3">Hardware</h4>
+<div class="outline-text-4" id="text-orgebbeaa3">
 <p>
 I got the DIY edition with the (lowest-end) i5-1135G7 CPU, 2x16GB RAM. I brought my own 1TB SSD. The higher spec CPUs didn&rsquo;t seem worth the money to me. The RAM is probably overkill.
 </p>
@@ -254,9 +255,9 @@ The more you look at it, the nicer it gets!
 </div>
 </div>
 
-<div id="outline-container-orge74c8bc" class="outline-4">
-<h4 id="orge74c8bc">Software</h4>
-<div class="outline-text-4" id="text-orge74c8bc">
+<div id="outline-container-orge919784" class="outline-4">
+<h4 id="orge919784">Software</h4>
+<div class="outline-text-4" id="text-orge919784">
 <p>
 I installed Gentoo GNU+Linux on the laptop, just like I have on my desktop. I used an Ubuntu live CD as the install medium together with the Gentoo stage3 tarball, and it worked well. I didn&rsquo;t really have to jump through any laptop-specific hoops, it was a very nice experience. I did use the dist-kernel rather than configuring my own.
 </p>
@@ -266,9 +267,9 @@ The laptop held up well during compiling. It&rsquo;s not as fast as a desktop of
 </p>
 </div>
 
-<div id="outline-container-orgc00ff77" class="outline-5">
-<h5 id="orgc00ff77">Display scaling</h5>
-<div class="outline-text-5" id="text-orgc00ff77">
+<div id="outline-container-org0090b99" class="outline-5">
+<h5 id="org0090b99">Display scaling</h5>
+<div class="outline-text-5" id="text-org0090b99">
 <p>
 Simply setting <code>Xft.dpi: 192</code> in .Xresources was enough for the vast majority of applications to use 2x scaling, which looks very good on this display. This is on X11 obviously; I don&rsquo;t use Wayland.
 </p>
@@ -278,36 +279,36 @@ The odd application requires its own scaling setting. Rofi requires setting <cod
 </p>
 </div>
 </div>
-<div id="outline-container-org091161e" class="outline-5">
-<h5 id="org091161e">Display manager</h5>
-<div class="outline-text-5" id="text-org091161e">
+<div id="outline-container-orgd56fddc" class="outline-5">
+<h5 id="orgd56fddc">Display manager</h5>
+<div class="outline-text-5" id="text-orgd56fddc">
 <p>
 I used SDDM which works very well. I wanted to go for something a bit fancier looking, and this delivers. I don&rsquo;t usually use things in the whole QT ecosystem, so it&rsquo;s refreshing.
 </p>
 </div>
 </div>
 
-<div id="outline-container-org52896e4" class="outline-5">
-<h5 id="org52896e4">Hibernate/suspend-to-disk</h5>
-<div class="outline-text-5" id="text-org52896e4">
+<div id="outline-container-orgd350c5d" class="outline-5">
+<h5 id="orgd350c5d">Hibernate/suspend-to-disk</h5>
+<div class="outline-text-5" id="text-orgd350c5d">
 <p>
 This required setting up a swap file and setting a kernel command line parameter to refer to it, but it was easy to do. It works well. I&rsquo;ve observed the laptop auto-hibernating when the battery runs out, but it doesn&rsquo;t do this reliably, so I should probably configure it myself.
 </p>
 </div>
 </div>
 
-<div id="outline-container-org6a88538" class="outline-5">
-<h5 id="org6a88538"><a href="http://guake-project.org/">Guake</a>-like transient terminal</h5>
-<div class="outline-text-5" id="text-org6a88538">
+<div id="outline-container-org9345999" class="outline-5">
+<h5 id="org9345999"><a href="http://guake-project.org/">Guake</a>-like transient terminal</h5>
+<div class="outline-text-5" id="text-org9345999">
 <p>
-Using some <code>fish</code> scripts, <code>bspwm</code>, <code>picom</code> and <code>xst</code> I rigged up a transient, transparent terminal to use for quick shell jobs. I used the scripts and config file in <a href="#org5ffe10c">Appendix A</a> to do this. The implementation is a bit hacky, and it&rsquo;s not impossible to break, but it serves my purposes well (and more important, it was fun to make)!
+Using some <code>fish</code> scripts, <code>bspwm</code>, <code>picom</code> and <code>xst</code> I rigged up a transient, transparent terminal to use for quick shell jobs. I used the scripts and config file in <a href="#org53f9855">Appendix A</a> to do this. The implementation is a bit hacky, and it&rsquo;s not impossible to break, but it serves my purposes well (and more important, it was fun to make)!
 </p>
 </div>
 </div>
 
-<div id="outline-container-org7290878" class="outline-5">
-<h5 id="org7290878">Wallpaper-setting script</h5>
-<div class="outline-text-5" id="text-org7290878">
+<div id="outline-container-orga6cbd4d" class="outline-5">
+<h5 id="orga6cbd4d">Wallpaper-setting script</h5>
+<div class="outline-text-5" id="text-orga6cbd4d">
 <p>
 I wrote a script to set a random wallpaper.
 </p>
@@ -334,11 +335,11 @@ I wrote a script to set a random wallpaper.
 </div>
 </div>
 
-<div id="outline-container-org68f0872" class="outline-5">
-<h5 id="org68f0872">Lockscreen</h5>
-<div class="outline-text-5" id="text-org68f0872">
+<div id="outline-container-org51e6729" class="outline-5">
+<h5 id="org51e6729">Lockscreen</h5>
+<div class="outline-text-5" id="text-org51e6729">
 <p>
-I hacked together some <a href="#org338a315">pretty crappy code</a> to lock the screen using <code>i3lock</code>, with my wallpaper composed with a little lock icon as the background. Very overengineered.
+I hacked together some <a href="#org5d50302">pretty crappy code</a> to lock the screen using <code>i3lock</code>, with my wallpaper composed with a little lock icon as the background. Very overengineered.
 </p>
 
 <p width="60%" class="center">
@@ -352,34 +353,34 @@ Is there a better lockscreen out there that will let me set my own image as the
 </div>
 </div>
 
-<div id="outline-container-org53ced5e" class="outline-5">
-<h5 id="org53ced5e">TODO</h5>
-<div class="outline-text-5" id="text-org53ced5e">
+<div id="outline-container-orgd0f0a6b" class="outline-5">
+<h5 id="orgd0f0a6b">TODO</h5>
+<div class="outline-text-5" id="text-orgd0f0a6b">
 </div>
 <ul class="org-ul">
-<li><a id="org5e14e8f"></a>Battery level notifications<br></li>
-<li><a id="org00d136e"></a>sleep-then-hibernate<br></li>
-<li><a id="orgaee1839"></a>Battery tuning<br></li>
+<li><a id="orgadc33d6"></a>Battery level notifications<br></li>
+<li><a id="orgd732f57"></a>sleep-then-hibernate<br></li>
+<li><a id="org0e93573"></a>Battery tuning<br></li>
 </ul>
 </div>
 </div>
 </div>
-<div id="outline-container-org306e125" class="outline-3">
-<h3 id="org306e125">Impressions</h3>
-<div class="outline-text-3" id="text-org306e125">
+<div id="outline-container-orge4f28ea" class="outline-3">
+<h3 id="orge4f28ea">Impressions</h3>
+<div class="outline-text-3" id="text-orge4f28ea">
 </div>
-<div id="outline-container-org7a2946e" class="outline-5">
-<h5 id="org7a2946e">Build Quality</h5>
-<div class="outline-text-5" id="text-org7a2946e">
+<div id="outline-container-orga3b9087" class="outline-5">
+<h5 id="orga3b9087">Build Quality</h5>
+<div class="outline-text-5" id="text-orga3b9087">
 <p>
 The laptop is made of aluminium and feels solid but light. The screen does seem pretty flimsy, though. I probably wouldn&rsquo;t want to drop this thing. It looks sleek and elegant, but pretty muted.
 </p>
 </div>
 </div>
 
-<div id="outline-container-org04474a9" class="outline-5">
-<h5 id="org04474a9">Screen</h5>
-<div class="outline-text-5" id="text-org04474a9">
+<div id="outline-container-org08d78a9" class="outline-5">
+<h5 id="org08d78a9">Screen</h5>
+<div class="outline-text-5" id="text-org08d78a9">
 <p>
 This is my first time ever using a high-DPI screen, and I&rsquo;m very impressed by it. Text looks unbelievably crisp and pleasant to read. I was somewhat worried about the linux high DPI situation, but I am having no issues whatsoever.
 </p>
@@ -394,27 +395,27 @@ The brightness goes up quite high, but colours feel somewhat washed out at high
 </div>
 </div>
 
-<div id="outline-container-org19258dc" class="outline-5">
-<h5 id="org19258dc">Keyboard</h5>
-<div class="outline-text-5" id="text-org19258dc">
+<div id="outline-container-org2c92f32" class="outline-5">
+<h5 id="org2c92f32">Keyboard</h5>
+<div class="outline-text-5" id="text-org2c92f32">
 <p>
 Framework seems to advertise their keyboard as having particularly deep travel, but it mostly just feels like any chiclet keyboard to me. Not a bad chiclet keyboard, but not that great, either. The layout is fine, but it makes me miss the thinkpad.
 </p>
 </div>
 </div>
 
-<div id="outline-container-org16cf29b" class="outline-5">
-<h5 id="org16cf29b">Touchpad</h5>
-<div class="outline-text-5" id="text-org16cf29b">
+<div id="outline-container-orgb34d3a9" class="outline-5">
+<h5 id="orgb34d3a9">Touchpad</h5>
+<div class="outline-text-5" id="text-orgb34d3a9">
 <p>
 I&rsquo;ve never had a decent touchpad before, so I was pleasantly surprised. I expected to miss the trackpoint on the thinkpad a lot, but this is fine, though it&rsquo;s still a step down. Pinch to zoom doesn&rsquo;t work very well, but I don&rsquo;t use that functionality a lot. I miss having dedicated mouse buttons; the clicking functionality on this touchpad works fine for me, but it&rsquo;s hard not to mess up left/middle/right click. That&rsquo;s a good incentive for me to practice relying on the mouse less, though. There&rsquo;s plenty of <a href="https://linuxtouchpad.org/">work being done</a> on the Linux touchpad experience software-side, too. It&rsquo;s a nice time to be a linux laptop user!
 </p>
 </div>
 </div>
 
-<div id="outline-container-org14dbe9e" class="outline-5">
-<h5 id="org14dbe9e">Battery</h5>
-<div class="outline-text-5" id="text-org14dbe9e">
+<div id="outline-container-org0815a7f" class="outline-5">
+<h5 id="org0815a7f">Battery</h5>
+<div class="outline-text-5" id="text-org0815a7f">
 <p>
 With the disclaimer that I haven&rsquo;t tested very intensely and I haven&rsquo;t tuned power settings very much. <br>
 I seem to get about 6.5 hours of real-world use time when using Emacs and doing light web browsing. I don&rsquo;t have a good benchmark for more intensive tasks, but compiling does hit the battery pretty hard. All in all I&rsquo;m very happy with it, getting decent battery life on Linux is hard. It might be worth eventually buying a power bank for it though, for travel~
@@ -422,18 +423,18 @@ I seem to get about 6.5 hours of real-world use time when using Emacs and doing
 </div>
 </div>
 
-<div id="outline-container-orgb0eef41" class="outline-5">
-<h5 id="orgb0eef41">Expansion cards/ports</h5>
-<div class="outline-text-5" id="text-orgb0eef41">
+<div id="outline-container-org9b0b9cb" class="outline-5">
+<h5 id="org9b0b9cb">Expansion cards/ports</h5>
+<div class="outline-text-5" id="text-org9b0b9cb">
 <p>
 The little expansion cards are one of Framework&rsquo;s big marketing things. I think they&rsquo;re pretty neat, though I don&rsquo;t always quite understand the way people talk about them, as &ldquo;dongle killers&rdquo;. I would find hotswapping these about equally obnoxious as carrying dongles. The idea of aftermarket expansion cards is interesting, though - these are low level, high bandwidth ports, with I think similar capabilities to the ExpressCard ports on old business laptops, but more modern with a USB-C port. I&rsquo;m looking forward to the USB4 era!
 </p>
 </div>
 </div>
 
-<div id="outline-container-org48dd1fc" class="outline-5">
-<h5 id="org48dd1fc">Performance</h5>
-<div class="outline-text-5" id="text-org48dd1fc">
+<div id="outline-container-org860fe14" class="outline-5">
+<h5 id="org860fe14">Performance</h5>
+<div class="outline-text-5" id="text-org860fe14">
 <p>
 So far I haven&rsquo;t felt limited by performance at all, the experience has been really snappy. I haven&rsquo;t thrown particularly difficult things at it, though, but that&rsquo;s fine - most of what I do on a laptop is reading, web browsing, and text editing. I played some Factorio on it and that seemed fine, but using the touchpad felt limiting so I didn&rsquo;t play very much.
 </p>
@@ -441,9 +442,9 @@ So far I haven&rsquo;t felt limited by performance at all, the experience has be
 </div>
 </div>
 
-<div id="outline-container-org136df04" class="outline-3">
-<h3 id="org136df04">Closing words</h3>
-<div class="outline-text-3" id="text-org136df04">
+<div id="outline-container-orgd823508" class="outline-3">
+<h3 id="orgd823508">Closing words</h3>
+<div class="outline-text-3" id="text-orgd823508">
 <p>
 Getting this laptop set up has been really fun! It&rsquo;s a good opportunity to take stock of where we&rsquo;re at. On the hardware side, I am very impressed that it&rsquo;s now possible to make a laptop that&rsquo;s this user-servicable, this well-specced and still not <i>that</i> expensive. It&rsquo;s a reminder of how much better things could be.
 </p>
@@ -453,7 +454,7 @@ On the software side, I feel like the GNU/Linux end-user ecosystem has come a lo
 </p>
 
 <p>
-Personally, I&rsquo;m getting a rare chance to critically examine all the little config files, scripts, programs, plugins and worklfows I have. It&rsquo;s fun to re-ignite the spark of join in configuring software and figuring out fluent, comfortable ways of doing things. I look forward to once more exploring and documenting the joy of computers&#x2026;! &lt;3
+Personally, I&rsquo;m getting a rare chance to critically examine all the little config files, scripts, programs, plugins and workflows I have. It&rsquo;s fun to re-ignite the spark of join in configuring software and figuring out fluent, comfortable ways of doing things. I look forward to once more exploring and documenting the joy of computers&#x2026;! &lt;3
 </p>
 </div>
 </div>
@@ -461,9 +462,9 @@ Personally, I&rsquo;m getting a rare chance to critically examine all the little
 
 
 
-<div id="outline-container-org5ffe10c" class="outline-2">
-<h2 id="org5ffe10c">Appendix A: Transient Terminal Sources</h2>
-<div class="outline-text-2" id="text-org5ffe10c">
+<div id="outline-container-org53f9855" class="outline-2">
+<h2 id="org53f9855">Appendix A: Transient Terminal Sources</h2>
+<div class="outline-text-2" id="text-org53f9855">
 <p>
 <code>togglescratch</code>
 </p>
@@ -528,9 +529,9 @@ opacity-rule=["90:name = 'scratchterminal'"];
 </div>
 </div>
 
-<div id="outline-container-org338a315" class="outline-2">
-<h2 id="org338a315">Appendix B: lock.py</h2>
-<div class="outline-text-2" id="text-org338a315">
+<div id="outline-container-org5d50302" class="outline-2">
+<h2 id="org5d50302">Appendix B: lock.py</h2>
+<div class="outline-text-2" id="text-org5d50302">
 <div class="org-src-container">
 <pre class="src src-python"><span class="org-comment-delimiter">#</span><span class="org-comment">!/usr/bin/python3</span>
 <span class="org-keyword">import</span> os
@@ -555,12 +556,28 @@ opacity-rule=["90:name = 'scratchterminal'"];
 </div>
 </div>
 </div>
+
+<div id="outline-container-org6eaec95" class="outline-2">
+<h2 id="org6eaec95">TODO</h2>
+<div class="outline-text-2" id="text-org6eaec95">
+<p>
+remark on modularity of charger
+remark on finish of modules
+</p>
+
+<p>
+<i>last modified: 2022-03-21</i>
+</p>
+</div>
+</div>
 </div>
 <div id="postamble" class="status">
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/posts/resources.html b/html/posts/resources.html
index 3aee641..31f5d0d 100644
--- a/html/posts/resources.html
+++ b/html/posts/resources.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 19:57 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>Resources</title>
@@ -195,9 +195,10 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
@@ -209,7 +210,9 @@
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/posts/test.html b/html/posts/test.html
new file mode 100644
index 0000000..260bcd8
--- /dev/null
+++ b/html/posts/test.html
@@ -0,0 +1,232 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- 2022-03-21 Mon 21:34 -->
+<meta charset="utf-8" />
+<meta name="viewport" content="width=100%, initial-scale=0.7" />
+<title>eheheawawawawa</title>
+<meta name="generator" content="Org Mode" />
+<style>
+  #content { max-width: 60em; margin: auto; }
+  .title  { text-align: center;
+             margin-bottom: .2em; }
+  .subtitle { text-align: center;
+              font-size: medium;
+              font-weight: bold;
+              margin-top:0; }
+  .todo   { font-family: monospace; color: red; }
+  .done   { font-family: monospace; color: green; }
+  .priority { font-family: monospace; color: orange; }
+  .tag    { background-color: #eee; font-family: monospace;
+            padding: 2px; font-size: 80%; font-weight: normal; }
+  .timestamp { color: #bebebe; }
+  .timestamp-kwd { color: #5f9ea0; }
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
+  .underline { text-decoration: underline; }
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
+  p.verse { margin-left: 3%; }
+  pre {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    background-color: #f2f2f2;
+    padding: 8pt;
+    font-family: monospace;
+    overflow: auto;
+    margin: 1.2em;
+  }
+  pre.src {
+    position: relative;
+    overflow: auto;
+  }
+  pre.src:before {
+    display: none;
+    position: absolute;
+    top: -8px;
+    right: 12px;
+    padding: 3px;
+    color: #555;
+    background-color: #f2f2f299;
+  }
+  pre.src:hover:before { display: inline; margin-top: 14px;}
+  /* Languages per Org manual */
+  pre.src-asymptote:before { content: 'Asymptote'; }
+  pre.src-awk:before { content: 'Awk'; }
+  pre.src-authinfo::before { content: 'Authinfo'; }
+  pre.src-C:before { content: 'C'; }
+  /* pre.src-C++ doesn't work in CSS */
+  pre.src-clojure:before { content: 'Clojure'; }
+  pre.src-css:before { content: 'CSS'; }
+  pre.src-D:before { content: 'D'; }
+  pre.src-ditaa:before { content: 'ditaa'; }
+  pre.src-dot:before { content: 'Graphviz'; }
+  pre.src-calc:before { content: 'Emacs Calc'; }
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
+  pre.src-fortran:before { content: 'Fortran'; }
+  pre.src-gnuplot:before { content: 'gnuplot'; }
+  pre.src-haskell:before { content: 'Haskell'; }
+  pre.src-hledger:before { content: 'hledger'; }
+  pre.src-java:before { content: 'Java'; }
+  pre.src-js:before { content: 'Javascript'; }
+  pre.src-latex:before { content: 'LaTeX'; }
+  pre.src-ledger:before { content: 'Ledger'; }
+  pre.src-lisp:before { content: 'Lisp'; }
+  pre.src-lilypond:before { content: 'Lilypond'; }
+  pre.src-lua:before { content: 'Lua'; }
+  pre.src-matlab:before { content: 'MATLAB'; }
+  pre.src-mscgen:before { content: 'Mscgen'; }
+  pre.src-ocaml:before { content: 'Objective Caml'; }
+  pre.src-octave:before { content: 'Octave'; }
+  pre.src-org:before { content: 'Org mode'; }
+  pre.src-oz:before { content: 'OZ'; }
+  pre.src-plantuml:before { content: 'Plantuml'; }
+  pre.src-processing:before { content: 'Processing.js'; }
+  pre.src-python:before { content: 'Python'; }
+  pre.src-R:before { content: 'R'; }
+  pre.src-ruby:before { content: 'Ruby'; }
+  pre.src-sass:before { content: 'Sass'; }
+  pre.src-scheme:before { content: 'Scheme'; }
+  pre.src-screen:before { content: 'Gnu Screen'; }
+  pre.src-sed:before { content: 'Sed'; }
+  pre.src-sh:before { content: 'shell'; }
+  pre.src-sql:before { content: 'SQL'; }
+  pre.src-sqlite:before { content: 'SQLite'; }
+  /* additional languages in org.el's org-babel-load-languages alist */
+  pre.src-forth:before { content: 'Forth'; }
+  pre.src-io:before { content: 'IO'; }
+  pre.src-J:before { content: 'J'; }
+  pre.src-makefile:before { content: 'Makefile'; }
+  pre.src-maxima:before { content: 'Maxima'; }
+  pre.src-perl:before { content: 'Perl'; }
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
+  pre.src-scala:before { content: 'Scala'; }
+  pre.src-shell:before { content: 'Shell Script'; }
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
+  /* additional language identifiers per "defun org-babel-execute"
+       in ob-*.el */
+  pre.src-cpp:before  { content: 'C++'; }
+  pre.src-abc:before  { content: 'ABC'; }
+  pre.src-coq:before  { content: 'Coq'; }
+  pre.src-groovy:before  { content: 'Groovy'; }
+  /* additional language identifiers from org-babel-shell-names in
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
+     the execution function name together. */
+  pre.src-bash:before  { content: 'bash'; }
+  pre.src-csh:before  { content: 'csh'; }
+  pre.src-ash:before  { content: 'ash'; }
+  pre.src-dash:before  { content: 'dash'; }
+  pre.src-ksh:before  { content: 'ksh'; }
+  pre.src-mksh:before  { content: 'mksh'; }
+  pre.src-posh:before  { content: 'posh'; }
+  /* Additional Emacs modes also supported by the LaTeX listings package */
+  pre.src-ada:before { content: 'Ada'; }
+  pre.src-asm:before { content: 'Assembler'; }
+  pre.src-caml:before { content: 'Caml'; }
+  pre.src-delphi:before { content: 'Delphi'; }
+  pre.src-html:before { content: 'HTML'; }
+  pre.src-idl:before { content: 'IDL'; }
+  pre.src-mercury:before { content: 'Mercury'; }
+  pre.src-metapost:before { content: 'MetaPost'; }
+  pre.src-modula-2:before { content: 'Modula-2'; }
+  pre.src-pascal:before { content: 'Pascal'; }
+  pre.src-ps:before { content: 'PostScript'; }
+  pre.src-prolog:before { content: 'Prolog'; }
+  pre.src-simula:before { content: 'Simula'; }
+  pre.src-tcl:before { content: 'tcl'; }
+  pre.src-tex:before { content: 'TeX'; }
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
+  pre.src-verilog:before { content: 'Verilog'; }
+  pre.src-vhdl:before { content: 'VHDL'; }
+  pre.src-xml:before { content: 'XML'; }
+  pre.src-nxml:before { content: 'XML'; }
+  /* add a generic configuration mode; LaTeX export needs an additional
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
+  pre.src-conf:before { content: 'Configuration File'; }
+
+  table { border-collapse:collapse; }
+  caption.t-above { caption-side: top; }
+  caption.t-bottom { caption-side: bottom; }
+  td, th { vertical-align:top;  }
+  th.org-right  { text-align: center;  }
+  th.org-left   { text-align: center;   }
+  th.org-center { text-align: center; }
+  td.org-right  { text-align: right;  }
+  td.org-left   { text-align: left;   }
+  td.org-center { text-align: center; }
+  dt { font-weight: bold; }
+  .footpara { display: inline; }
+  .footdef  { margin-bottom: 1em; }
+  .figure { padding: 1em; }
+  .figure p { text-align: center; }
+  .equation-container {
+    display: table;
+    text-align: center;
+    width: 100%;
+  }
+  .equation {
+    vertical-align: middle;
+  }
+  .equation-label {
+    display: table-cell;
+    text-align: right;
+    vertical-align: middle;
+  }
+  .inlinetask {
+    padding: 10px;
+    border: 2px solid gray;
+    margin: 10px;
+    background: #ffffcc;
+  }
+  #org-div-home-and-up
+   { text-align: right; font-size: 70%; white-space: nowrap; }
+  textarea { overflow-x: auto; }
+  .linenr { font-size: smaller }
+  .code-highlighted { background-color: #ffff00; }
+  .org-info-js_info-navigation { border-style: none; }
+  #org-info-js_console-label
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
+  .org-info-js_search-highlight
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
+  .org-svg { width: 90%; }
+</style>
+<link rel="stylesheet" href="/static/style.css" type="text/css"/>
+</head>
+<body>
+<div id="preamble" class="status">
+<div id="header">
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
+</div>
+</div>
+<div id="content" class="content">
+
+<div id="outline-container-orgd1c2e87" class="outline-2">
+<h2 id="orgd1c2e87">eheheawawawawa</h2>
+<div class="outline-text-2" id="text-orgd1c2e87">
+<p>
+<span class="timestamp-wrapper"><span class="timestamp">&lt;2022-03-21 Mon 21:33&gt;</span></span>
+</p>
+
+<p>
+<i>last modified: 2022-03-21</i>
+</p>
+</div>
+</div>
+</div>
+<div id="postamble" class="status">
+<div id="footer">
+  <hr>
+  If you have any comments about this page, you can email me at: <br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
+
+  All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
+  Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
+</div>
+</div>
+</body>
+</html>
diff --git a/html/sitemap.html b/html/sitemap.html
index 8a8df92..66edb6b 100644
--- a/html/sitemap.html
+++ b/html/sitemap.html
@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 <head>
-<!-- 2022-03-18 Fri 20:17 -->
+<!-- 2022-03-21 Mon 21:34 -->
 <meta charset="utf-8" />
 <meta name="viewport" content="width=100%, initial-scale=0.7" />
 <title>Sitemap for project pages</title>
@@ -195,17 +195,23 @@
 <body>
 <div id="preamble" class="status">
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
 </div>
 <div id="content" class="content">
 <ul class="org-ul">
+<li><a href="experiments.html">Experiments</a></li>
+<li><a href="blogroll.html">Blogroll</a></li>
+<li><a href="todo.html">TODO</a></li>
+<li><a href="snippets.html">Snippets</a></li>
 <li><a href="about.html">About</a></li>
 <li><a href="index.html">Index</a></li>
 <li>Posts
 <ul class="org-ul">
+<li><a href="posts/test.html">chuu</a></li>
 <li><a href="posts/elog-1-blog.html">Emacs Log 1: This Blog</a></li>
 <li><a href="posts/resources.html">Resources</a></li>
 <li><a href="posts/framework.html">Framework Laptop Review</a></li>
@@ -216,7 +222,9 @@
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/html/snippets.html b/html/snippets.html
new file mode 100644
index 0000000..55e4c47
--- /dev/null
+++ b/html/snippets.html
@@ -0,0 +1,234 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- 2022-03-21 Mon 19:57 -->
+<meta charset="utf-8" />
+<meta name="viewport" content="width=100%, initial-scale=0.7" />
+<title>Snippets</title>
+<meta name="generator" content="Org Mode" />
+<style>
+  #content { max-width: 60em; margin: auto; }
+  .title  { text-align: center;
+             margin-bottom: .2em; }
+  .subtitle { text-align: center;
+              font-size: medium;
+              font-weight: bold;
+              margin-top:0; }
+  .todo   { font-family: monospace; color: red; }
+  .done   { font-family: monospace; color: green; }
+  .priority { font-family: monospace; color: orange; }
+  .tag    { background-color: #eee; font-family: monospace;
+            padding: 2px; font-size: 80%; font-weight: normal; }
+  .timestamp { color: #bebebe; }
+  .timestamp-kwd { color: #5f9ea0; }
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
+  .underline { text-decoration: underline; }
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
+  p.verse { margin-left: 3%; }
+  pre {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    background-color: #f2f2f2;
+    padding: 8pt;
+    font-family: monospace;
+    overflow: auto;
+    margin: 1.2em;
+  }
+  pre.src {
+    position: relative;
+    overflow: auto;
+  }
+  pre.src:before {
+    display: none;
+    position: absolute;
+    top: -8px;
+    right: 12px;
+    padding: 3px;
+    color: #555;
+    background-color: #f2f2f299;
+  }
+  pre.src:hover:before { display: inline; margin-top: 14px;}
+  /* Languages per Org manual */
+  pre.src-asymptote:before { content: 'Asymptote'; }
+  pre.src-awk:before { content: 'Awk'; }
+  pre.src-authinfo::before { content: 'Authinfo'; }
+  pre.src-C:before { content: 'C'; }
+  /* pre.src-C++ doesn't work in CSS */
+  pre.src-clojure:before { content: 'Clojure'; }
+  pre.src-css:before { content: 'CSS'; }
+  pre.src-D:before { content: 'D'; }
+  pre.src-ditaa:before { content: 'ditaa'; }
+  pre.src-dot:before { content: 'Graphviz'; }
+  pre.src-calc:before { content: 'Emacs Calc'; }
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
+  pre.src-fortran:before { content: 'Fortran'; }
+  pre.src-gnuplot:before { content: 'gnuplot'; }
+  pre.src-haskell:before { content: 'Haskell'; }
+  pre.src-hledger:before { content: 'hledger'; }
+  pre.src-java:before { content: 'Java'; }
+  pre.src-js:before { content: 'Javascript'; }
+  pre.src-latex:before { content: 'LaTeX'; }
+  pre.src-ledger:before { content: 'Ledger'; }
+  pre.src-lisp:before { content: 'Lisp'; }
+  pre.src-lilypond:before { content: 'Lilypond'; }
+  pre.src-lua:before { content: 'Lua'; }
+  pre.src-matlab:before { content: 'MATLAB'; }
+  pre.src-mscgen:before { content: 'Mscgen'; }
+  pre.src-ocaml:before { content: 'Objective Caml'; }
+  pre.src-octave:before { content: 'Octave'; }
+  pre.src-org:before { content: 'Org mode'; }
+  pre.src-oz:before { content: 'OZ'; }
+  pre.src-plantuml:before { content: 'Plantuml'; }
+  pre.src-processing:before { content: 'Processing.js'; }
+  pre.src-python:before { content: 'Python'; }
+  pre.src-R:before { content: 'R'; }
+  pre.src-ruby:before { content: 'Ruby'; }
+  pre.src-sass:before { content: 'Sass'; }
+  pre.src-scheme:before { content: 'Scheme'; }
+  pre.src-screen:before { content: 'Gnu Screen'; }
+  pre.src-sed:before { content: 'Sed'; }
+  pre.src-sh:before { content: 'shell'; }
+  pre.src-sql:before { content: 'SQL'; }
+  pre.src-sqlite:before { content: 'SQLite'; }
+  /* additional languages in org.el's org-babel-load-languages alist */
+  pre.src-forth:before { content: 'Forth'; }
+  pre.src-io:before { content: 'IO'; }
+  pre.src-J:before { content: 'J'; }
+  pre.src-makefile:before { content: 'Makefile'; }
+  pre.src-maxima:before { content: 'Maxima'; }
+  pre.src-perl:before { content: 'Perl'; }
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
+  pre.src-scala:before { content: 'Scala'; }
+  pre.src-shell:before { content: 'Shell Script'; }
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
+  /* additional language identifiers per "defun org-babel-execute"
+       in ob-*.el */
+  pre.src-cpp:before  { content: 'C++'; }
+  pre.src-abc:before  { content: 'ABC'; }
+  pre.src-coq:before  { content: 'Coq'; }
+  pre.src-groovy:before  { content: 'Groovy'; }
+  /* additional language identifiers from org-babel-shell-names in
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
+     the execution function name together. */
+  pre.src-bash:before  { content: 'bash'; }
+  pre.src-csh:before  { content: 'csh'; }
+  pre.src-ash:before  { content: 'ash'; }
+  pre.src-dash:before  { content: 'dash'; }
+  pre.src-ksh:before  { content: 'ksh'; }
+  pre.src-mksh:before  { content: 'mksh'; }
+  pre.src-posh:before  { content: 'posh'; }
+  /* Additional Emacs modes also supported by the LaTeX listings package */
+  pre.src-ada:before { content: 'Ada'; }
+  pre.src-asm:before { content: 'Assembler'; }
+  pre.src-caml:before { content: 'Caml'; }
+  pre.src-delphi:before { content: 'Delphi'; }
+  pre.src-html:before { content: 'HTML'; }
+  pre.src-idl:before { content: 'IDL'; }
+  pre.src-mercury:before { content: 'Mercury'; }
+  pre.src-metapost:before { content: 'MetaPost'; }
+  pre.src-modula-2:before { content: 'Modula-2'; }
+  pre.src-pascal:before { content: 'Pascal'; }
+  pre.src-ps:before { content: 'PostScript'; }
+  pre.src-prolog:before { content: 'Prolog'; }
+  pre.src-simula:before { content: 'Simula'; }
+  pre.src-tcl:before { content: 'tcl'; }
+  pre.src-tex:before { content: 'TeX'; }
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
+  pre.src-verilog:before { content: 'Verilog'; }
+  pre.src-vhdl:before { content: 'VHDL'; }
+  pre.src-xml:before { content: 'XML'; }
+  pre.src-nxml:before { content: 'XML'; }
+  /* add a generic configuration mode; LaTeX export needs an additional
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
+  pre.src-conf:before { content: 'Configuration File'; }
+
+  table { border-collapse:collapse; }
+  caption.t-above { caption-side: top; }
+  caption.t-bottom { caption-side: bottom; }
+  td, th { vertical-align:top;  }
+  th.org-right  { text-align: center;  }
+  th.org-left   { text-align: center;   }
+  th.org-center { text-align: center; }
+  td.org-right  { text-align: right;  }
+  td.org-left   { text-align: left;   }
+  td.org-center { text-align: center; }
+  dt { font-weight: bold; }
+  .footpara { display: inline; }
+  .footdef  { margin-bottom: 1em; }
+  .figure { padding: 1em; }
+  .figure p { text-align: center; }
+  .equation-container {
+    display: table;
+    text-align: center;
+    width: 100%;
+  }
+  .equation {
+    vertical-align: middle;
+  }
+  .equation-label {
+    display: table-cell;
+    text-align: right;
+    vertical-align: middle;
+  }
+  .inlinetask {
+    padding: 10px;
+    border: 2px solid gray;
+    margin: 10px;
+    background: #ffffcc;
+  }
+  #org-div-home-and-up
+   { text-align: right; font-size: 70%; white-space: nowrap; }
+  textarea { overflow-x: auto; }
+  .linenr { font-size: smaller }
+  .code-highlighted { background-color: #ffff00; }
+  .org-info-js_info-navigation { border-style: none; }
+  #org-info-js_console-label
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
+  .org-info-js_search-highlight
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
+  .org-svg { width: 90%; }
+</style>
+<link rel="stylesheet" href="/static/style.css" type="text/css"/>
+</head>
+<body>
+<div id="preamble" class="status">
+<div id="header">
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
+</div>
+</div>
+<div id="content" class="content">
+
+<div id="outline-container-orgfc6b3b7" class="outline-2">
+<h2 id="orgfc6b3b7">X11</h2>
+<div class="outline-text-2" id="text-orgfc6b3b7">
+</div>
+<div id="outline-container-org3de8bb7" class="outline-3">
+<h3 id="org3de8bb7">Reset xrandr</h3>
+<div class="outline-text-3" id="text-org3de8bb7">
+<div class="org-src-container">
+<pre class="src src-bash">xrandr -s <span class="org-highlight-numbers-number">0</span>
+</pre>
+</div>
+</div>
+</div>
+</div>
+</div>
+<div id="postamble" class="status">
+<div id="footer">
+  <hr>
+  If you have any comments about this page, you can email me at: <br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
+
+  All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
+  Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
+</div>
+</div>
+</body>
+</html>
diff --git a/html/static/style.css b/html/static/style.css
index 96b37eb..0ae4487 100644
--- a/html/static/style.css
+++ b/html/static/style.css
@@ -1,7 +1,7 @@
 :root {
     --site-width: 70%;
     --vert-content-margin: 1.5em;
-    --navbar-color: #d2e8b0;
+    --accent1: #d2e8b0;
     --black: #222;
     --white: #FBFBFB;
 }
@@ -20,8 +20,7 @@ p + p {
 
 hr {
   border: 0;
-  height: 2px;
-  background-color: var(--black);
+  border-top: 2px dotted var(--black);
 }
 
 .center {
@@ -31,6 +30,11 @@ hr {
   text-align: center;
 }
 
+.navbar-link {
+  margin-right: 5px;
+  margin-left: 5px;
+}
+
 a, a:visited {
   color: blue;
   text-decoration: none;
@@ -50,8 +54,8 @@ a, a:visited {
 
 #header {
   padding: 5px;
-  background-color: var(--navbar-color);
-  border: 1px solid var(--black);
+  background-color: var(--accent1);
+  border: 2px double var(--black);
   border-radius: 5px;
 }
 
diff --git a/html/todo.html b/html/todo.html
new file mode 100644
index 0000000..90aa4bb
--- /dev/null
+++ b/html/todo.html
@@ -0,0 +1,223 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<!-- 2022-03-21 Mon 19:57 -->
+<meta charset="utf-8" />
+<meta name="viewport" content="width=100%, initial-scale=0.7" />
+<title>TODO</title>
+<meta name="generator" content="Org Mode" />
+<style>
+  #content { max-width: 60em; margin: auto; }
+  .title  { text-align: center;
+             margin-bottom: .2em; }
+  .subtitle { text-align: center;
+              font-size: medium;
+              font-weight: bold;
+              margin-top:0; }
+  .todo   { font-family: monospace; color: red; }
+  .done   { font-family: monospace; color: green; }
+  .priority { font-family: monospace; color: orange; }
+  .tag    { background-color: #eee; font-family: monospace;
+            padding: 2px; font-size: 80%; font-weight: normal; }
+  .timestamp { color: #bebebe; }
+  .timestamp-kwd { color: #5f9ea0; }
+  .org-right  { margin-left: auto; margin-right: 0px;  text-align: right; }
+  .org-left   { margin-left: 0px;  margin-right: auto; text-align: left; }
+  .org-center { margin-left: auto; margin-right: auto; text-align: center; }
+  .underline { text-decoration: underline; }
+  #postamble p, #preamble p { font-size: 90%; margin: .2em; }
+  p.verse { margin-left: 3%; }
+  pre {
+    border: 1px solid #e6e6e6;
+    border-radius: 3px;
+    background-color: #f2f2f2;
+    padding: 8pt;
+    font-family: monospace;
+    overflow: auto;
+    margin: 1.2em;
+  }
+  pre.src {
+    position: relative;
+    overflow: auto;
+  }
+  pre.src:before {
+    display: none;
+    position: absolute;
+    top: -8px;
+    right: 12px;
+    padding: 3px;
+    color: #555;
+    background-color: #f2f2f299;
+  }
+  pre.src:hover:before { display: inline; margin-top: 14px;}
+  /* Languages per Org manual */
+  pre.src-asymptote:before { content: 'Asymptote'; }
+  pre.src-awk:before { content: 'Awk'; }
+  pre.src-authinfo::before { content: 'Authinfo'; }
+  pre.src-C:before { content: 'C'; }
+  /* pre.src-C++ doesn't work in CSS */
+  pre.src-clojure:before { content: 'Clojure'; }
+  pre.src-css:before { content: 'CSS'; }
+  pre.src-D:before { content: 'D'; }
+  pre.src-ditaa:before { content: 'ditaa'; }
+  pre.src-dot:before { content: 'Graphviz'; }
+  pre.src-calc:before { content: 'Emacs Calc'; }
+  pre.src-emacs-lisp:before { content: 'Emacs Lisp'; }
+  pre.src-fortran:before { content: 'Fortran'; }
+  pre.src-gnuplot:before { content: 'gnuplot'; }
+  pre.src-haskell:before { content: 'Haskell'; }
+  pre.src-hledger:before { content: 'hledger'; }
+  pre.src-java:before { content: 'Java'; }
+  pre.src-js:before { content: 'Javascript'; }
+  pre.src-latex:before { content: 'LaTeX'; }
+  pre.src-ledger:before { content: 'Ledger'; }
+  pre.src-lisp:before { content: 'Lisp'; }
+  pre.src-lilypond:before { content: 'Lilypond'; }
+  pre.src-lua:before { content: 'Lua'; }
+  pre.src-matlab:before { content: 'MATLAB'; }
+  pre.src-mscgen:before { content: 'Mscgen'; }
+  pre.src-ocaml:before { content: 'Objective Caml'; }
+  pre.src-octave:before { content: 'Octave'; }
+  pre.src-org:before { content: 'Org mode'; }
+  pre.src-oz:before { content: 'OZ'; }
+  pre.src-plantuml:before { content: 'Plantuml'; }
+  pre.src-processing:before { content: 'Processing.js'; }
+  pre.src-python:before { content: 'Python'; }
+  pre.src-R:before { content: 'R'; }
+  pre.src-ruby:before { content: 'Ruby'; }
+  pre.src-sass:before { content: 'Sass'; }
+  pre.src-scheme:before { content: 'Scheme'; }
+  pre.src-screen:before { content: 'Gnu Screen'; }
+  pre.src-sed:before { content: 'Sed'; }
+  pre.src-sh:before { content: 'shell'; }
+  pre.src-sql:before { content: 'SQL'; }
+  pre.src-sqlite:before { content: 'SQLite'; }
+  /* additional languages in org.el's org-babel-load-languages alist */
+  pre.src-forth:before { content: 'Forth'; }
+  pre.src-io:before { content: 'IO'; }
+  pre.src-J:before { content: 'J'; }
+  pre.src-makefile:before { content: 'Makefile'; }
+  pre.src-maxima:before { content: 'Maxima'; }
+  pre.src-perl:before { content: 'Perl'; }
+  pre.src-picolisp:before { content: 'Pico Lisp'; }
+  pre.src-scala:before { content: 'Scala'; }
+  pre.src-shell:before { content: 'Shell Script'; }
+  pre.src-ebnf2ps:before { content: 'ebfn2ps'; }
+  /* additional language identifiers per "defun org-babel-execute"
+       in ob-*.el */
+  pre.src-cpp:before  { content: 'C++'; }
+  pre.src-abc:before  { content: 'ABC'; }
+  pre.src-coq:before  { content: 'Coq'; }
+  pre.src-groovy:before  { content: 'Groovy'; }
+  /* additional language identifiers from org-babel-shell-names in
+     ob-shell.el: ob-shell is the only babel language using a lambda to put
+     the execution function name together. */
+  pre.src-bash:before  { content: 'bash'; }
+  pre.src-csh:before  { content: 'csh'; }
+  pre.src-ash:before  { content: 'ash'; }
+  pre.src-dash:before  { content: 'dash'; }
+  pre.src-ksh:before  { content: 'ksh'; }
+  pre.src-mksh:before  { content: 'mksh'; }
+  pre.src-posh:before  { content: 'posh'; }
+  /* Additional Emacs modes also supported by the LaTeX listings package */
+  pre.src-ada:before { content: 'Ada'; }
+  pre.src-asm:before { content: 'Assembler'; }
+  pre.src-caml:before { content: 'Caml'; }
+  pre.src-delphi:before { content: 'Delphi'; }
+  pre.src-html:before { content: 'HTML'; }
+  pre.src-idl:before { content: 'IDL'; }
+  pre.src-mercury:before { content: 'Mercury'; }
+  pre.src-metapost:before { content: 'MetaPost'; }
+  pre.src-modula-2:before { content: 'Modula-2'; }
+  pre.src-pascal:before { content: 'Pascal'; }
+  pre.src-ps:before { content: 'PostScript'; }
+  pre.src-prolog:before { content: 'Prolog'; }
+  pre.src-simula:before { content: 'Simula'; }
+  pre.src-tcl:before { content: 'tcl'; }
+  pre.src-tex:before { content: 'TeX'; }
+  pre.src-plain-tex:before { content: 'Plain TeX'; }
+  pre.src-verilog:before { content: 'Verilog'; }
+  pre.src-vhdl:before { content: 'VHDL'; }
+  pre.src-xml:before { content: 'XML'; }
+  pre.src-nxml:before { content: 'XML'; }
+  /* add a generic configuration mode; LaTeX export needs an additional
+     (add-to-list 'org-latex-listings-langs '(conf " ")) in .emacs */
+  pre.src-conf:before { content: 'Configuration File'; }
+
+  table { border-collapse:collapse; }
+  caption.t-above { caption-side: top; }
+  caption.t-bottom { caption-side: bottom; }
+  td, th { vertical-align:top;  }
+  th.org-right  { text-align: center;  }
+  th.org-left   { text-align: center;   }
+  th.org-center { text-align: center; }
+  td.org-right  { text-align: right;  }
+  td.org-left   { text-align: left;   }
+  td.org-center { text-align: center; }
+  dt { font-weight: bold; }
+  .footpara { display: inline; }
+  .footdef  { margin-bottom: 1em; }
+  .figure { padding: 1em; }
+  .figure p { text-align: center; }
+  .equation-container {
+    display: table;
+    text-align: center;
+    width: 100%;
+  }
+  .equation {
+    vertical-align: middle;
+  }
+  .equation-label {
+    display: table-cell;
+    text-align: right;
+    vertical-align: middle;
+  }
+  .inlinetask {
+    padding: 10px;
+    border: 2px solid gray;
+    margin: 10px;
+    background: #ffffcc;
+  }
+  #org-div-home-and-up
+   { text-align: right; font-size: 70%; white-space: nowrap; }
+  textarea { overflow-x: auto; }
+  .linenr { font-size: smaller }
+  .code-highlighted { background-color: #ffff00; }
+  .org-info-js_info-navigation { border-style: none; }
+  #org-info-js_console-label
+    { font-size: 10px; font-weight: bold; white-space: nowrap; }
+  .org-info-js_search-highlight
+    { background-color: #ffff00; color: #000000; font-weight: bold; }
+  .org-svg { width: 90%; }
+</style>
+<link rel="stylesheet" href="/static/style.css" type="text/css"/>
+</head>
+<body>
+<div id="preamble" class="status">
+<div id="header">
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
+</div>
+</div>
+<div id="content" class="content">
+
+<div id="outline-container-orgedfa30c" class="outline-2">
+<h2 id="orgedfa30c">literate dotfiles?</h2>
+</div>
+</div>
+<div id="postamble" class="status">
+<div id="footer">
+  <hr>
+  If you have any comments about this page, you can email me at: <br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
+
+  All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
+  Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
+</div>
+</div>
+</body>
+</html>
diff --git a/org/blogroll.org b/org/blogroll.org
new file mode 100644
index 0000000..9281415
--- /dev/null
+++ b/org/blogroll.org
@@ -0,0 +1,4 @@
+#+TITLE: Blogroll
+#+MACRO: modified 2022-03-21
+
+last modified: {{{modified}}}
diff --git a/org/experiments.org b/org/experiments.org
new file mode 100644
index 0000000..315294f
--- /dev/null
+++ b/org/experiments.org
@@ -0,0 +1,5 @@
+#+TITLE: Experiments
+
+#+BEGIN_SRC bash
+echo $0
+#+END_SRC
diff --git a/org/posts/elog-1-blog.org b/org/posts/elog-1-blog.org
index 4279e00..1b57133 100644
--- a/org/posts/elog-1-blog.org
+++ b/org/posts/elog-1-blog.org
@@ -4,7 +4,7 @@
 * Emacs Log 1: This Blog
 _/*WARNING:*/_ This blog post is still under construction!
 
-This blog is built on top of =org-mode='s publishing capabilities.
+This blog is built on top of =org-mode=!
 
 * Appendix A: config.el snippet
 #+BEGIN_SRC emacs-lisp
@@ -32,6 +32,12 @@ This blog is built on top of =org-mode='s publishing capabilities.
        :html-doctype "html5"
        :html-html5-fancy t
 
+       :html-viewport ((width "100%")
+                       (initial-scale "0.7")
+                       (minimum-scale "")
+                       (maximum-scale "")
+                       (user-scalable ""))
+
        :language "en"
        :section-numbers nil
 
@@ -51,7 +57,7 @@ This blog is built on top of =org-mode='s publishing capabilities.
                  entry
                  (org-publish-find-title entry project)))
                ((eq style 'tree)
-                 (capitalize (file-name-nondirectory (directory-file-name entry))))
+                (capitalize (file-name-nondirectory (directory-file-name entry))))
                (t entry)))
 
        :headline-levels 4
@@ -69,7 +75,7 @@ This blog is built on top of =org-mode='s publishing capabilities.
 
       ("blog" :components ("pages" "static")))))
 
-  (setq org-publish-project-alist (akko/blog-spec))
+(setq org-publish-project-alist (akko/blog-spec))
 
 (defun akko/publish-blog ()
   (interactive)
@@ -82,11 +88,4 @@ This blog is built on top of =org-mode='s publishing capabilities.
   (org-publish-remove-all-timestamps)
   (org-publish-all))
 
-(map! :leader
-      (:prefix ("a" . "akko")
-       :desc "Publish Blog"
-       "b" #'akko/publish-blog))
-
-(setq org-html-htmlize-output-type 'css)
-(setq org-html-htmlize-font-prefix "org-")
 #+END_SRC
diff --git a/org/posts/framework.org b/org/posts/framework.org
index 34c121f..83465d9 100644
--- a/org/posts/framework.org
+++ b/org/posts/framework.org
@@ -1,5 +1,6 @@
 #+TITLE: Framework Laptop Review
-#+DATE:<2022-03-17 Thu>
+#+DATE: <2022-03-17 Thu>
+#+MACRO: modified 2022-03-21
 
 * My Experience with the Framework Laptop
 ** Ordering
@@ -92,7 +93,7 @@ Getting this laptop set up has been really fun! It's a good opportunity to take
 
 On the software side, I feel like the GNU/Linux end-user ecosystem has come a long way. The experience was very painless, though I am also an advanced user, of course. How different are things now than when I got started on Linux Mint Olivia.
 
-Personally, I'm getting a rare chance to critically examine all the little config files, scripts, programs, plugins and worklfows I have. It's fun to re-ignite the spark of join in configuring software and figuring out fluent, comfortable ways of doing things. I look forward to once more exploring and documenting the joy of computers...! <3
+Personally, I'm getting a rare chance to critically examine all the little config files, scripts, programs, plugins and workflows I have. It's fun to re-ignite the spark of join in configuring software and figuring out fluent, comfortable ways of doing things. I look forward to once more exploring and documenting the joy of computers...! <3
 
 
 
@@ -111,3 +112,9 @@ Personally, I'm getting a rare chance to critically examine all the little confi
 
 * Appendix B: lock.py
 #+INCLUDE: "~/Scripts/lock.py" src python
+
+* TODO
+remark on modularity of charger
+remark on finish of modules
+
+/last modified: {{{modified}}}/
diff --git a/org/posts/test.org b/org/posts/test.org
new file mode 100644
index 0000000..d0919f5
--- /dev/null
+++ b/org/posts/test.org
@@ -0,0 +1,7 @@
+#+TITLE: eheheawawawawa
+#+MACRO: modified 2022-03-21
+#+DATE: <2022-03-21 Mon 21:33>
+
+* eheheawawawawa
+
+/last modified: {{{modified}}}/
diff --git a/org/sitemap.org b/org/sitemap.org
index 78ccfd5..8a83ae8 100644
--- a/org/sitemap.org
+++ b/org/sitemap.org
@@ -1,8 +1,13 @@
 #+TITLE: Sitemap for project pages
 
+- [[file:experiments.org][Experiments]]
+- [[file:blogroll.org][Blogroll]]
+- [[file:todo.org][TODO]]
+- [[file:snippets.org][Snippets]]
 - [[file:about.org][About]]
 - [[file:index.org][Index]]
 - Posts
+  - [[file:posts/test.org][chuu]]
   - [[file:posts/elog-1-blog.org][Emacs Log 1: This Blog]]
   - [[file:posts/resources.org][Resources]]
   - [[file:posts/framework.org][Framework Laptop Review]]
\ No newline at end of file
diff --git a/org/snippets.org b/org/snippets.org
new file mode 100644
index 0000000..2abaa4d
--- /dev/null
+++ b/org/snippets.org
@@ -0,0 +1,7 @@
+#+TITLE: Snippets
+
+* X11
+** Reset xrandr
+#+BEGIN_SRC bash
+xrandr -s 0
+#+END_SRC
diff --git a/org/todo.org b/org/todo.org
new file mode 100644
index 0000000..d34e927
--- /dev/null
+++ b/org/todo.org
@@ -0,0 +1,3 @@
+#+TITLE: TODO
+
+* literate dotfiles?
diff --git a/static/style.css b/static/style.css
index 96b37eb..0ae4487 100644
--- a/static/style.css
+++ b/static/style.css
@@ -1,7 +1,7 @@
 :root {
     --site-width: 70%;
     --vert-content-margin: 1.5em;
-    --navbar-color: #d2e8b0;
+    --accent1: #d2e8b0;
     --black: #222;
     --white: #FBFBFB;
 }
@@ -20,8 +20,7 @@ p + p {
 
 hr {
   border: 0;
-  height: 2px;
-  background-color: var(--black);
+  border-top: 2px dotted var(--black);
 }
 
 .center {
@@ -31,6 +30,11 @@ hr {
   text-align: center;
 }
 
+.navbar-link {
+  margin-right: 5px;
+  margin-left: 5px;
+}
+
 a, a:visited {
   color: blue;
   text-decoration: none;
@@ -50,8 +54,8 @@ a, a:visited {
 
 #header {
   padding: 5px;
-  background-color: var(--navbar-color);
-  border: 1px solid var(--black);
+  background-color: var(--accent1);
+  border: 2px double var(--black);
   border-radius: 5px;
 }
 
diff --git a/util/postamble.html b/util/postamble.html
index bfea87e..e3045a5 100644
--- a/util/postamble.html
+++ b/util/postamble.html
@@ -1,7 +1,9 @@
 <div id="footer">
   <hr>
   If you have any comments about this page, you can email me at: <br>
-  <b>akko [shift-2] nakadashi -dot- lol</b><br><br>
+  <b>akko [shift-2] nakadashi -dot- lol</b><br>
+  And I may include them on the website!<br>
+  <br>
 
   All code on this website is licensed <b>GPLv3</b> unless otherwise indicated. <br>
   Blog proudly built using <a href="/posts/elog-1-blog.html">org-mode</a>!
diff --git a/util/preamble.html b/util/preamble.html
index 36dbf70..9a2ca79 100644
--- a/util/preamble.html
+++ b/util/preamble.html
@@ -1,5 +1,6 @@
 <div id="header">
-  <a href="/">Home</a> |
-  <a href="/about.html">dare desu ka</a> |
-  <a href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/">Home</a>
+  <a class="navbar-link" href="/about.html">誰</a>
+  <a class="navbar-link" href="/sitemap.html">Sitemap</a>
+  <a class="navbar-link" href="/blogroll.html">Blogroll</a>
 </div>
