diff --git a/Shakefile.hs b/Shakefile.hs
index 61eaf8b..fb093f6 100644
--- a/Shakefile.hs
+++ b/Shakefile.hs
@@ -136,6 +136,7 @@ genAllDeps patterns = do
buildRules :: Rules ()
buildRules = do
cleanRule
+ fastRule
allRule
fullRule
getPost <- mkGetPost
@@ -364,18 +365,34 @@ compressImage img = do
, "-ordered-dither","o4x4,4"
, dst ]
+
+needFast = do
+ allAssets <- filter (/= ".DS_Store") <$> getDirectoryFiles srcDir ["**"]
+ need (map build $ allAssets <> ["archive.html"])
+ allHtmlAction
+
+fastRule :: Rules ()
+fastRule =
+ withTargetDocs "generate html" $
+ phony "fast" $
+ needFast
+
needAll = do
- allAssets <- filter (/= ".DS_Store") <$> getDirectoryFiles srcDir ["**"]
- need (map build $ allAssets <> ["archive.html"])
- allHtmlAction
- allAsciiAction
- allPdfAction
+ needFast
+ allAsciiAction
+ allPdfAction
allRule :: Rules ()
-allRule = phony "all" needAll
+allRule =
+ withTargetDocs "generate all, no optim" $
+ phony "all" $
+ needAll
fullRule :: Rules ()
-fullRule = phony "full" $ need [optimDir > "rss.xml"]
+fullRule =
+ withTargetDocs "generate all and optim" $
+ phony "full" $
+ need [optimDir > "rss.xml"]
cleanRule :: Rules ()
cleanRule =
diff --git a/shell.nix b/shell.nix
index bff21dd..4b05d9b 100644
--- a/shell.nix
+++ b/shell.nix
@@ -16,6 +16,7 @@ pkgs.mkShell {
buildInputs = with pkgs;
[ cacert
coreutils
+ entr
html-xml-utils
zsh
perl
diff --git a/src/css/latex.css b/src/css/latex.css
deleted file mode 100644
index 5a1bc41..0000000
--- a/src/css/latex.css
+++ /dev/null
@@ -1,379 +0,0 @@
-/*!
- * LaTeX.css (https://latex.now.sh/)
- *
- * Source: https://github.com/vincentdoerig/latex-css
- * Licensed under MIT (https://github.com/vincentdoerig/latex-css/blob/master/LICENSE)
-*/
-
-@font-face {
- font-family: 'Latin Modern';
- font-style: normal;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/LM-regular.woff2') format('woff2'),
- url('./fonts/LM-regular.woff') format('woff'),
- url('./fonts/LM-regular.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'Latin Modern';
- font-style: italic;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/LM-italic.woff2') format('woff2'),
- url('./fonts/LM-italic.woff') format('woff'),
- url('./fonts/LM-italic.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'Latin Modern';
- font-style: normal;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/LM-bold.woff2') format('woff2'),
- url('./fonts/LM-bold.woff') format('woff'),
- url('./fonts/LM-bold.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'Latin Modern';
- font-style: italic;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/LM-bold-italic.woff2') format('woff2'),
- url('./fonts/LM-bold-italic.woff') format('woff'),
- url('./fonts/LM-bold-italic.ttf') format('truetype');
-}
-
-/* Box sizing rules */
-*,
-*::before,
-*::after {
- box-sizing: border-box;
-}
-
-/* Remove default margin */
-body,
-h1,
-h2,
-h3,
-h4,
-p,
-ul[class],
-ol[class],
-li,
-figure,
-figcaption,
-dl,
-dd {
- margin: 0;
-}
-
-/* Make default font-size 1rem and add smooth scrolling to anchors */
-html {
- font-size: 1rem;
- scroll-behavior: smooth;
-}
-
-body {
- font-family: 'Latin Modern', Georgia, Cambria, 'Times New Roman', Times, serif;
- line-height: 1.8;
-
- max-width: 80ch;
- min-height: 100vh;
- overflow-x: hidden;
- margin: 0 auto;
- padding: 2rem 1.25rem;
-
- counter-reset: theorem;
- counter-reset: definition;
-
- color: hsl(0, 5%, 10%);
- background-color: hsl(210, 20%, 98%);
-
- text-rendering: optimizeLegibility;
-}
-
-/* Justify and hyphenate all paragraphs */
-p {
- text-align: justify;
- hyphens: auto;
- -webkit-hyphens: auto;
- -moz-hyphens: auto;
- margin-top: 1rem;
-}
-
-/* A elements that don't have a class get default styles */
-a:not([class]) {
- text-decoration-skip-ink: auto;
-}
-
-/* Make links red */
-a,
-a:visited {
- color: #a00;
-}
-
-/* Make images easier to work with */
-img {
- max-width: 100%;
- display: block;
-}
-
-/* Inherit fonts for inputs and buttons */
-input,
-button,
-textarea,
-select {
- font: inherit;
-}
-
-/* Prevent textarea from overflowing */
-textarea {
- width: 100%;
-}
-
-/* Natural flow and rhythm in articles by default */
-article > * + * {
- margin-top: 1em;
-}
-
-/* Styles for inline code or code snippets */
-code,
-pre,
-kbd {
- font-family: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New',
- monospace;
- font-size: 85%;
-}
-pre {
- padding: 1rem 1.4rem;
- max-width: 100%;
- overflow: auto;
- border: 1px solid hsl(210, 15%, 49%);
- border-radius: 4px;
- background: hsl(210, 40%, 96%);
-}
-pre code {
- font-size: 95%;
- position: relative;
-}
-kbd {
- background: hsl(210, 5%, 100%);
- border: 1px solid hsl(210, 5%, 70%);
- border-radius: 2px;
- padding: 2px 4px;
- font-size: 75%;
-}
-
-/* Make table 100% width, add borders between rows */
-table {
- border-collapse: collapse;
- border-spacing: 0;
- width: 100%;
- max-width: 100%;
-}
-th,
-td {
- text-align: left;
- padding: 0.5rem;
-}
-td {
- border-bottom: 1px solid hsl(0, 0%, 85%);
-}
-thead th {
- border-bottom: 2px solid hsl(0, 0%, 70%);
-}
-tfoot th {
- border-top: 2px solid hsl(0, 0%, 70%);
-}
-
-/* Center align the title */
-h1:first-child {
- text-align: center;
-}
-
-/* Nested ordered list for ToC */
-nav ol {
- counter-reset: item;
- padding-left: 2rem;
-}
-nav li {
- display: block;
-}
-nav li:before {
- content: counters(item, '.') ' ';
- counter-increment: item;
- padding-right: 0.85rem;
-}
-
-/* Center definitions (most useful for display equations) */
-dl dd {
- text-align: center;
-}
-
-/* Theorem */
-.theorem {
- counter-increment: theorem;
- display: block;
- margin: 12px 0;
- font-style: italic;
-}
-.theorem::before {
- content: 'Theorem ' counter(theorem) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Lemma */
-.lemma {
- counter-increment: theorem;
- display: block;
- margin: 12px 0;
- font-style: italic;
-}
-.lemma::before {
- content: 'Lemma ' counter(theorem) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Proof */
-.proof {
- display: block;
- margin: 12px 0;
- font-style: normal;
- position: relative;
-}
-.proof::before {
- content: 'Proof. ' attr(title);
- font-style: italic;
-}
-.proof:after {
- content: '◾️';
- position: absolute;
- right: -12px;
- bottom: -2px;
-}
-
-/* Definition */
-.definition {
- counter-increment: definition;
- display: block;
- margin: 12px 0;
- font-style: normal;
-}
-.definition::before {
- content: 'Definition ' counter(definition) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Center align author name, use small caps and add vertical spacing */
-.author {
- margin: 0.85rem 0;
- font-variant-caps: small-caps;
- text-align: center;
-}
-
-/* Make footnote text smaller and left align it (looks bad with long URLs) */
-.footnotes p {
- text-align: left;
- line-height: 1.5;
- font-size: 85%;
- margin-bottom: 0.4rem;
-}
-.footnotes {
- border-top: 1px solid hsl(0, 0%, 39%);
-}
-
-/* Center title and paragraph */
-.abstract,
-.abstract p {
- text-align: center;
-}
-.abstract {
- margin: 2.25rem 0;
-}
-
-/* Format the LaTeX symbol correctly (a higher up, e lower) */
-.latex span:nth-child(1) {
- text-transform: uppercase;
- font-size: 0.75em;
- vertical-align: 0.25em;
- margin-left: -0.36em;
- margin-right: -0.15em;
- line-height: 1ex;
-}
-
-.latex span:nth-child(2) {
- text-transform: uppercase;
- vertical-align: -0.5ex;
- margin-left: -0.1667em;
- margin-right: -0.125em;
- line-height: 1ex;
-}
-
-/* Heading typography */
-h1 {
- font-size: 2.5rem;
- line-height: 3.25rem;
- margin-bottom: 1.625rem;
-}
-
-h2 {
- font-size: 1.7rem;
- line-height: 2rem;
- margin-top: 3rem;
-}
-
-h3 {
- font-size: 1.4rem;
- margin-top: 2.5rem;
-}
-
-h4 {
- font-size: 1.2rem;
- margin-top: 2rem;
-}
-
-h5 {
- font-size: 1rem;
- margin-top: 1.8rem;
-}
-
-h6 {
- font-size: 1rem;
- font-style: italic;
- font-weight: normal;
- margin-top: 2.5rem;
-}
-
-h3,
-h4,
-h5,
-h6 {
- line-height: 1.625rem;
-}
-
-h1 + h2 {
- margin-top: 1.625rem;
-}
-
-h2 + h3,
-h3 + h4,
-h4 + h5 {
- margin-top: 0.8rem;
-}
-
-h5 + h6 {
- margin-top: -0.8rem;
-}
-
-h2,
-h3,
-h4,
-h5,
-h6 {
- margin-bottom: 0.8rem;
-}
diff --git a/src/css/mk.css b/src/css/mk.css
deleted file mode 100644
index cec9502..0000000
--- a/src/css/mk.css
+++ /dev/null
@@ -1,139 +0,0 @@
-/* COLORS */
-
-/* colortheme switch */
-body>input { display: none; }
-#labels > .content { margin: 0 auto; text-align: center; }
-label { font-weight: 700; }
-label:hover { cursor: pointer; }
-#logo { text-align: center; }
-body { margin:0; padding: 0; border: 0; max-width: none;}
-#content,.content,#preamble,#postamble {
- max-width: 80ch;
- overflow-x: hidden;
- margin: 0 auto;
-}
-figure img { width: 100%; }
-.footdef > sup { vertical-align: top; font-size: medium; }
-.footdef > sup > a { padding: 0.5em; }
-.footpara { display: inline; }
-footer { margin: 3em 0; padding: 1em 0; border-top: solid 1px; border-bottom: solid 1px; line-height: 1em; }
-#postamble td { border-bottom: none; }
-nav { text-align: center; padding: 2em 0; }
-
-
-:root {
- --b03: #2E3440;
- --b02: #3B4252;
- /* not used because light mode is has more contrast
- --b01: #656b74;
- */
- --b00: #727781;
- --b0: #989ea8;
- --b1: #b0bac7;
- --b2: #ECEFF4;
- --b3: #fff;
- --y: #c18600;
- --o: #d84100;
- --r: #e62729;
- --m: #ec0085;
- --v: #6c71c4;
- --b: #0095ff;
- --c: #00b0a3;
- --g: #879a00;
-
- /* default light */
- --bg: var(--b3);
- --rbg: var(--b2);
- --fg0: var(--b0);
- --fg: var(--b02);
- --rfg: #000;
- --hl: var(--o);
-}
-
-/* light checked */
-input#l:checked ~ div {
- --bg: var(--b3);
- --rbg: var(--b2);
- --fg0: var(--b0);
- --fg: var(--b02);
- --rfg: #000;
- --hl: var(--o);
-}
-input#l:checked ~ div img {
- filter: none;
-}
-
-/* dark checked */
-input#d:checked ~ div {
- --bg: hsl(210,20%,2%);
- --rbg: var(--b03);
- --fg: var(--b1);
- --fg0: var(--b00);
- --rfg: var(--b2);
- --hl: var(--y);
-}
-input#d:checked ~ div img {
- filter: brightness(0.5) saturate(0.5);
-}
-
-/* dark preferred */
-@media (prefers-color-scheme: dark)
-{
- :root {
- --bg: black;
- --rbg: var(--b03);
- --fg: var(--b1);
- --fg0: var(--b00);
- --rfg: var(--b2);
- --hl: var(--y);
- }
- img { filter: brightness(0.5) saturate(0.5); }
-}
-body, body > div {
- background: var(--bg);
- color: var(--fg);
-}
-a,a:visited { color: var(--hl); }
-
-/* ---- SYNTAX HIGHLIGHTING ---- */
-.org-rainbow-delimiters-depth-1, .org-rainbow-delimiters-depth-9,
-.org-css-selector, .org-nix-attribute, .org-builtin,
-.IN_REVIEW {
- color:var(--c);
-}
-
-.org-rainbow-delimiters-depth-2, .org-nix-builtin, .org-variable-name,
-.org-haskell-definition, .org-haskell-operator, .org-function-name, .org-diff-changed {
- color:var(--b);
-}
-
-.org-rainbow-delimiters-depth-3, .HOLD, .WAITING {
- color:var(--v);
-}
-
-.org-rainbow-delimiters-depth-4, .org-diff-hunk-header, .org-sh-quoted-exec,
-.CANCELED {
- color:var(--m);
-}
-.org-rainbow-delimiters-depth-5, .org-diff-removed, .TODO {
- color:var(--r);
-}
-.org-rainbow-delimiters-depth-6, .org-haskell-constructor {
- color:var(--o);
-}
-.org-rainbow-delimiters-depth-7, .org-type, .org-constant, .org-diff-header,
-.org-haskell-keyword, .org-haskell-type, .IN_PROGRESS {
- color:var(--y);
-}
-.org-rainbow-delimiters-depth-8, .org-sh-heredoc, .org-diff-added, .org-string,
-.org-doc, .org-keyword, .DONE {
- color:var(--g);
-}
-
-.org-highlight-numbers-number, .org-highlight-number-number,
-.org-diff-none, .org-preprocessor, .org-comment-delimiter, .org-comment,
-.org-outshine-level-1, .org-outshine-level-2, .org-outshine-level-3,
-.org-outshine-level-4, .org-outshine-level-5, .org-outshine-level-6,
-.org-outshine-level-7, .org-outshine-level-8, .org-outshine-level-9 {
- color:var(--fg0);
-}
diff --git a/src/css/nice.css b/src/css/nice.css
new file mode 100644
index 0000000..5a67c1d
--- /dev/null
+++ b/src/css/nice.css
@@ -0,0 +1,607 @@
+/* Fonts if you need them
+@font-face {
+ font-family: 'CMU Serif';
+ font-style: normal;
+ font-weight: normal;
+ font-display: swap;
+ src: url('./fonts/cmunrm.woff2') format('woff2'),
+ url('./fonts/cmunrm.woff') format('woff'),
+ url('./fonts/cmunrm.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Serif';
+ font-style: italic;
+ font-weight: normal;
+ font-display: swap;
+ src: url('./fonts/cmunti.woff2') format('woff2'),
+ url('./fonts/cmunti.woff') format('woff'),
+ url('./fonts/cmunti.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Serif';
+ font-style: normal;
+ font-weight: bold;
+ font-display: swap;
+ src: url('./fonts/cmunbx.woff2') format('woff2'),
+ url('./fonts/cmunbx.woff') format('woff'),
+ url('./fonts/cmunbx.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Serif';
+ font-style: italic;
+ font-weight: bold;
+ font-display: swap;
+ src: url('./fonts/cmunbi.woff2') format('woff2'),
+ url('./fonts/cmunbi.woff') format('woff'),
+ url('./fonts/cmunbi.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Typewriter';
+ font-style: normal;
+ font-weight: normal;
+ font-display: swap;
+ src: url('./fonts/cmuntt.woff2') format('woff2'),
+ url('./fonts/cmuntt.woff') format('woff'),
+ url('./fonts/cmuntt.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Typewriter';
+ font-style: italic;
+ font-weight: normal;
+ font-display: swap;
+ src: url('./fonts/cmunit.woff2') format('woff2'),
+ url('./fonts/cmunit.woff') format('woff');
+ url('./fonts/cmunit.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Typewriter';
+ font-style: normal;
+ font-weight: bold;
+ font-display: swap;
+ src: url('./fonts/cmuntb.woff2') format('woff2'),
+ url('./fonts/cmuntb.woff') format('woff'),
+ url('./fonts/cmuntb.ttf') format('truetype');
+}
+
+@font-face {
+ font-family: 'CMU Typewriter';
+ font-style: italic;
+ font-weight: bold;
+ font-display: swap;
+ src: url('./fonts/cmuntx.woff2') format('woff2'),
+ url('./fonts/cmuntx.woff') format('woff'),
+ url('./fonts/cmuntx.ttf') format('truetype');
+}
+
+*/
+
+/* Box sizing rules */
+*,
+*::before,
+*::after {
+ box-sizing: border-box;
+}
+
+/* Remove default margin */
+body,
+h1,
+h2,
+h3,
+h4,
+p,
+ul[class],
+ol[class],
+li,
+figcaption,
+dl,
+dd {
+ margin: 0;
+}
+figure { margin: 1em 0; }
+
+/* Make default font-size 1rem and add smooth scrolling to anchors */
+html {
+ font-size: 1rem;
+ scroll-behavior: smooth;
+}
+
+body {
+ font-family: "Helvetica Neue", sans-serif;
+ line-height: 1.5;
+
+ min-height: 100vh;
+ overflow-x: hidden;
+ margin: 0;
+ padding: 0;
+
+ counter-reset: theorem;
+ counter-reset: definition;
+
+ color: hsl(0, 5%, 10%);
+ background-color: hsl(218, 20%, 98%);
+
+ text-rendering: optimizeLegibility;
+}
+
+#content, .content {
+ max-width: 60ch;
+ margin: 0 auto;
+ padding: 0 1.25rem;
+}
+
+/* Justify and hyphenate all paragraphs */
+p {
+ text-align: justify;
+ hyphens: auto;
+ -webkit-hyphens: auto;
+ -moz-hyphens: auto;
+ margin-top: 1rem;
+}
+
+/* A elements that don't have a class get default styles */
+a:not([class]) {
+ text-decoration-skip-ink: auto;
+}
+
+/* Make images easier to work with */
+img {
+ max-width: 100%;
+ display: block;
+}
+
+/* Inherit fonts for inputs and buttons */
+input,
+button,
+textarea,
+select {
+ font: inherit;
+}
+
+/* Prevent textarea from overflowing */
+textarea {
+ width: 100%;
+}
+
+/* Natural flow and rhythm in articles by default */
+article > * + * {
+ margin-top: 1em;
+}
+
+/* Styles for inline code or code snippets */
+code,
+pre,
+kbd {
+ font-family: Courier, monospace;
+}
+pre {
+ padding: 1rem;
+ max-width: 100%;
+ overflow: auto;
+ border: 1px solid hsl(218, 15%, 49%);
+ border-radius: 4px;
+ background: hsl(218, 40%, 96%);
+ font-size: 85%;
+}
+pre code {
+ font-size: 95%;
+ position: relative;
+}
+kbd {
+ background: hsl(218, 5%, 100%);
+ border: 1px solid hsl(218, 5%, 70%);
+ border-radius: 2px;
+ padding: 2px 4px;
+ font-size: 75%;
+}
+
+/* Make table 100% width, add borders between rows */
+table {
+ border-collapse: collapse;
+ border-spacing: 0;
+ width: 100%;
+ max-width: 100%;
+}
+th,
+td {
+ text-align: left;
+ padding: 0.5rem;
+}
+td {
+ border-bottom: 1px solid hsl(0, 0%, 85%);
+}
+thead th {
+ border-bottom: 2px solid hsl(0, 0%, 70%);
+}
+tfoot th {
+ border-top: 2px solid hsl(0, 0%, 70%);
+}
+
+/* Center align the title */
+h1:first-child {
+ text-align: center;
+}
+
+/* Nested ordered list for ToC */
+nav ol {
+ counter-reset: item;
+ padding-left: 2rem;
+}
+nav li {
+ display: block;
+}
+
+/* Center definitions (most useful for display equations) */
+dl dt { font-weight: 700; }
+dl dd {
+ padding-left: 3rem;
+}
+
+/* Theorem */
+.theorem {
+ counter-increment: theorem;
+ display: block;
+ margin: 12px 0;
+ font-style: italic;
+}
+.theorem::before {
+ content: 'Theorem ' counter(theorem) '. ';
+ font-weight: bold;
+ font-style: normal;
+}
+
+/* Lemma */
+.lemma {
+ counter-increment: theorem;
+ display: block;
+ margin: 12px 0;
+ font-style: italic;
+}
+.lemma::before {
+ content: 'Lemma ' counter(theorem) '. ';
+ font-weight: bold;
+ font-style: normal;
+}
+
+/* Proof */
+.proof {
+ display: block;
+ margin: 12px 0;
+ font-style: normal;
+ position: relative;
+}
+.proof::before {
+ content: 'Proof. ' attr(title);
+ font-style: italic;
+}
+.proof:after {
+ content: '◾️';
+ position: absolute;
+ right: -12px;
+ bottom: -2px;
+}
+
+/* Definition */
+.definition {
+ counter-increment: definition;
+ display: block;
+ margin: 12px 0;
+ font-style: normal;
+}
+.definition::before {
+ content: 'Definition ' counter(definition) '. ';
+ font-weight: bold;
+ font-style: normal;
+}
+
+/* Center align author name, use small caps and add vertical spacing */
+.author {
+ margin: 0.85rem 0;
+ font-variant-caps: small-caps;
+ text-align: center;
+}
+
+/* Make footnote text smaller and left align it (looks bad with long URLs) */
+.footref { display: inline-block; padding: 0 3px; }
+.footnotes p {
+ text-align: left;
+ line-height: 1.5;
+ font-size: 85%;
+ margin-bottom: 0.4rem;
+}
+
+/* Center title and paragraph */
+.abstract,
+.abstract p {
+ text-align: center;
+}
+.abstract {
+ margin: 2.25rem;
+ font-size: 0.85rem;
+ font-style: italic;
+}
+
+/* Format the LaTeX symbol correctly (a higher up, e lower) */
+.latex span:nth-child(1) {
+ text-transform: uppercase;
+ font-size: 0.75em;
+ vertical-align: 0.25em;
+ margin-left: -0.36em;
+ margin-right: -0.15em;
+ line-height: 1ex;
+}
+
+.latex span:nth-child(2) {
+ text-transform: uppercase;
+ vertical-align: -0.5ex;
+ margin-left: -0.1667em;
+ margin-right: -0.125em;
+ line-height: 1ex;
+}
+
+/* Heading typography */
+h1 {
+ font-size: 2.5rem;
+ line-height: 3.25rem;
+ margin-bottom: 1.625rem;
+}
+
+h2 {
+ font-size: 1.7rem;
+ line-height: 2rem;
+ margin-top: 3rem;
+}
+
+h3 {
+ font-size: 1.4rem;
+ margin-top: 2.5rem;
+}
+
+h4 {
+ font-size: 1.2rem;
+ margin-top: 2rem;
+}
+
+h5 {
+ font-size: 1rem;
+ margin-top: 1.8rem;
+}
+
+h6 {
+ font-size: 1rem;
+ font-style: italic;
+ font-weight: normal;
+ margin-top: 2.5rem;
+}
+
+h3,
+h4,
+h5,
+h6 {
+ line-height: 1.625rem;
+}
+
+h1 + h2 {
+ margin-top: 1.625rem;
+}
+
+h2 + h3,
+h3 + h4,
+h4 + h5 {
+ margin-top: 0.8rem;
+}
+
+h5 + h6 {
+ margin-top: -0.8rem;
+}
+
+h2,
+h3,
+h4,
+h5,
+h6 {
+ margin-bottom: 0.8rem;
+}
+/* COLORS */
+
+/* colortheme switch */
+body>input { display: none; }
+#labels > .content { margin: 0 auto; text-align: center; }
+label { font-weight: 700; }
+label:hover { cursor: pointer; }
+label ~ pre { margin-top: 0; }
+.org-src-container { margin: 1rem 0; }
+#logo { text-align: center; }
+#preamble, #postamble { text-align: center; }
+#content,.content,#preamble,#postamble {
+ max-width: 60ch;
+ overflow: hidden;
+ margin: 0 auto;
+}
+figure img { width: 100%; }
+.footdef > sup { vertical-align: top; font-size: medium; }
+.footdef > sup > a { padding: 0.5em; }
+.footpara { display: inline; }
+footer { margin: 3em 0;
+ padding: 1em 0;
+ border-top: solid 1px;
+ border-bottom: solid 1px;
+ line-height: 1em;
+ font-size: 0.85em;
+ text-align: center;
+ }
+td { border-bottom: none; padding: .2rem; }
+table { margin-top: 1rem; }
+nav { text-align: center; padding: 1em 0; }
+pre { line-height: 1em; }
+
+:root {
+ --b03: #2E3440;
+ --b02: #3B4252;
+ /* not used because light mode is has more contrast
+ --b01: #656b74;
+ */
+ --b00: #727781;
+ --b0: #989ea8;
+ --b1: #b0bac7;
+ --b2: #ECEFF4;
+ --b3: #fff;
+ --y: #c18600;
+ --o: #d84100;
+ --r: #e62729;
+ --m: #ec0085;
+ --v: #6c71c4;
+ --b: #0095ff;
+ --c: #00b0a3;
+ --g: #879a00;
+
+ /* default light */
+ --bg: var(--b3);
+ --rbg: var(--b2);
+ --fg0: var(--b0);
+ --fg: var(--b02);
+ --rfg: #000;
+ --hl: var(--r);
+}
+
+/* dark preferred */
+@media (prefers-color-scheme: dark)
+{
+ :root {
+ --bg: hsl(218,20%,16%);
+ --rbg: var(--b03);
+ --fg: var(--b0);
+ --fg0: var(--b00);
+ --rfg: var(--b2);
+ --hl: var(--g);
+ --y: #ae8c51;
+ --o: #a9654a;
+ --r: #af6255;
+ --m: #ae5e7d;
+ --v: #6774b2;
+ --b: #3f8cc3;
+ --c: #15a198;
+ --g: #939452;
+ }
+ img { filter: brightness(0.7) saturate(0.5); }
+ pre {
+ background: hsl(218,20%,18%);
+ border-color: hsl(218,15%,23%);
+ }
+}
+
+/* light checked */
+input#l:checked ~ div {
+ --bg: var(--b3);
+ --rbg: var(--b2);
+ --fg0: var(--b0);
+ --fg: var(--b02);
+ --rfg: #000;
+ --hl: var(--o);
+ --y: #c18600;
+ --o: #d84100;
+ --r: #e62729;
+ --m: #ec0085;
+ --v: #6c71c4;
+ --b: #0095ff;
+ --c: #00b0a3;
+ --g: #879a00;
+}
+input#l:checked ~ div img {
+ filter: none;
+}
+input#l:checked ~ div pre {
+ border: 1px solid hsl(218, 15%, 49%);
+ background: hsl(218, 40%, 96%);
+}
+
+/* dark checked */
+input#d:checked ~ div {
+ --bg: hsl(218,20%,16%);
+ --rbg: var(--b03);
+ --fg: var(--b0);
+ --fg0: var(--b00);
+ --rfg: var(--b2);
+ --hl: var(--g);
+ --y: #ae8c51;
+ --o: #a9654a;
+ --r: #af6255;
+ --m: #ae5e7d;
+ --v: #6774b2;
+ --b: #3f8cc3;
+ --c: #15a198;
+ --g: #939452;
+}
+input#d:checked ~ div img {
+ filter: brightness(0.7) saturate(0.5);
+}
+input#d:checked ~ div pre {
+ background: hsl(218,20%,18%);
+ border-color: hsl(218,15%,23%);
+}
+
+/* ---- */
+::selection {
+ background: var(--m);
+ color: hsl(218,40%,96%);
+ text-decoration: hsl(218,40%,96%);
+}
+
+body, body > div {
+ background: var(--bg);
+ color: var(--fg);
+}
+a,a:visited { color: var(--hl); }
+
+figcaption { color: var(--fg0); }
+
+/* ---- SYNTAX HIGHLIGHTING ---- */
+#table-of-contents { text-align: left; }
+
+.org-rainbow-delimiters-depth-1, .org-rainbow-delimiters-depth-9,
+.org-css-selector, .org-builtin,
+.IN_REVIEW, .ex {
+ color:var(--c);
+}
+
+.org-rainbow-delimiters-depth-2, .org-nix-builtin, .org-variable-name,
+.org-haskell-definition, .org-haskell-operator, .org-function-name, .org-diff-changed,
+.org-nix-attribute, .org-nxml-element-local-name, .op, .fu, .ot {
+ color:var(--b);
+}
+
+.org-rainbow-delimiters-depth-3, .HOLD, .WAITING {
+ color:var(--v);
+}
+
+.org-rainbow-delimiters-depth-4, .org-diff-hunk-header, .org-sh-quoted-exec,
+.CANCELED, .bu {
+ color:var(--m);
+}
+.org-rainbow-delimiters-depth-5, .org-diff-removed, .TODO {
+ color:var(--r);
+}
+.org-rainbow-delimiters-depth-6, .org-haskell-constructor, .dt {
+ color:var(--o);
+}
+.org-rainbow-delimiters-depth-7, .org-type, .org-constant, .org-diff-header,
+.org-haskell-keyword, .org-haskell-type, .IN_PROGRESS, .kw {
+ color:var(--y);
+}
+.org-rainbow-delimiters-depth-8, .org-sh-heredoc, .org-diff-added, .org-string,
+.org-doc, .org-keyword, .DONE, .st {
+ color:var(--g);
+}
+
+.org-highlight-numbers-number, .org-highlight-number-number,
+.org-diff-none, .org-preprocessor, .org-comment-delimiter, .org-comment,
+.org-outshine-level-1, .org-outshine-level-2, .org-outshine-level-3,
+.org-outshine-level-4, .org-outshine-level-5, .org-outshine-level-6,
+.org-outshine-level-7, .org-outshine-level-8, .org-outshine-level-9, .co {
+ color:var(--fg0);
+}
diff --git a/src/css/y.css b/src/css/y.css
index 1afeece..6fc6f1b 100644
--- a/src/css/y.css
+++ b/src/css/y.css
@@ -1,407 +1,18 @@
-/* Fonts if you need them
-@font-face {
- font-family: 'CMU Serif';
- font-style: normal;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/cmunrm.woff2') format('woff2'),
- url('./fonts/cmunrm.woff') format('woff'),
- url('./fonts/cmunrm.ttf') format('truetype');
+html { font-family: "Helvetica Neue", sans-serif; font-size: 14px; line-height: 20px; }
+html,body { margin: 0; padding: 0; border: 0; }
+pre { overflow-x: scroll; border: solid 1px; padding: 1ex; }
+figure { margin: 1rem 0; padding: 0; }
+.meta { margin: 1rem 0;}
+.abstract { margin: 1rem; }
+#logo { text-align: center; }
+#preamble, #postamble { text-align: center; }
+#content,.content,#preamble,#postamble {
+ padding: 0 1rem;
+ max-width: 67ch;
+ overflow: hidden;
+ margin: 0 auto;
}
-@font-face {
- font-family: 'CMU Serif';
- font-style: italic;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/cmunti.woff2') format('woff2'),
- url('./fonts/cmunti.woff') format('woff'),
- url('./fonts/cmunti.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Serif';
- font-style: normal;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/cmunbx.woff2') format('woff2'),
- url('./fonts/cmunbx.woff') format('woff'),
- url('./fonts/cmunbx.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Serif';
- font-style: italic;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/cmunbi.woff2') format('woff2'),
- url('./fonts/cmunbi.woff') format('woff'),
- url('./fonts/cmunbi.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Typewriter';
- font-style: normal;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/cmuntt.woff2') format('woff2'),
- url('./fonts/cmuntt.woff') format('woff'),
- url('./fonts/cmuntt.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Typewriter';
- font-style: italic;
- font-weight: normal;
- font-display: swap;
- src: url('./fonts/cmunit.woff2') format('woff2'),
- url('./fonts/cmunit.woff') format('woff');
- url('./fonts/cmunit.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Typewriter';
- font-style: normal;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/cmuntb.woff2') format('woff2'),
- url('./fonts/cmuntb.woff') format('woff'),
- url('./fonts/cmuntb.ttf') format('truetype');
-}
-
-@font-face {
- font-family: 'CMU Typewriter';
- font-style: italic;
- font-weight: bold;
- font-display: swap;
- src: url('./fonts/cmuntx.woff2') format('woff2'),
- url('./fonts/cmuntx.woff') format('woff'),
- url('./fonts/cmuntx.ttf') format('truetype');
-}
-
-*/
-
-/* Box sizing rules */
-*,
-*::before,
-*::after {
- box-sizing: border-box;
-}
-
-/* Remove default margin */
-body,
-h1,
-h2,
-h3,
-h4,
-p,
-ul[class],
-ol[class],
-li,
-figcaption,
-dl,
-dd {
- margin: 0;
-}
-figure { margin: 1em 0; }
-
-/* Make default font-size 1rem and add smooth scrolling to anchors */
-html {
- font-size: 1rem;
- scroll-behavior: smooth;
-}
-
-body {
- font-family: "American Typewriter", Georgia, serif;
- line-height: 1.5;
-
- max-width: 60ch;
- min-height: 100vh;
- overflow-x: hidden;
- margin: 0 auto;
- padding: 2rem 1.25rem;
-
- counter-reset: theorem;
- counter-reset: definition;
-
- color: hsl(0, 5%, 10%);
- background-color: hsl(218, 20%, 98%);
-
- text-rendering: optimizeLegibility;
-}
-
-/* Justify and hyphenate all paragraphs */
-p {
- text-align: justify;
- hyphens: auto;
- -webkit-hyphens: auto;
- -moz-hyphens: auto;
- margin-top: 1rem;
-}
-
-/* A elements that don't have a class get default styles */
-a:not([class]) {
- text-decoration-skip-ink: auto;
-}
-
-/* Make images easier to work with */
-img {
- max-width: 100%;
- display: block;
-}
-
-/* Inherit fonts for inputs and buttons */
-input,
-button,
-textarea,
-select {
- font: inherit;
-}
-
-/* Prevent textarea from overflowing */
-textarea {
- width: 100%;
-}
-
-/* Natural flow and rhythm in articles by default */
-article > * + * {
- margin-top: 1em;
-}
-
-/* Styles for inline code or code snippets */
-code,
-pre,
-kbd {
- font-family: Courier, monospace;
-}
-pre {
- padding: 1rem;
- max-width: 100%;
- overflow: auto;
- border: 1px solid hsl(218, 15%, 49%);
- border-radius: 4px;
- background: hsl(218, 40%, 96%);
- font-size: 85%;
-}
-pre code {
- font-size: 95%;
- position: relative;
-}
-kbd {
- background: hsl(218, 5%, 100%);
- border: 1px solid hsl(218, 5%, 70%);
- border-radius: 2px;
- padding: 2px 4px;
- font-size: 75%;
-}
-
-/* Make table 100% width, add borders between rows */
-table {
- border-collapse: collapse;
- border-spacing: 0;
- width: 100%;
- max-width: 100%;
-}
-th,
-td {
- text-align: left;
- padding: 0.5rem;
-}
-td {
- border-bottom: 1px solid hsl(0, 0%, 85%);
-}
-thead th {
- border-bottom: 2px solid hsl(0, 0%, 70%);
-}
-tfoot th {
- border-top: 2px solid hsl(0, 0%, 70%);
-}
-
-/* Center align the title */
-h1:first-child {
- text-align: center;
-}
-
-/* Nested ordered list for ToC */
-nav ol {
- counter-reset: item;
- padding-left: 2rem;
-}
-nav li {
- display: block;
-}
-
-/* Center definitions (most useful for display equations) */
-dl dt { font-weight: 700; }
-dl dd {
- padding-left: 3rem;
-}
-
-/* Theorem */
-.theorem {
- counter-increment: theorem;
- display: block;
- margin: 12px 0;
- font-style: italic;
-}
-.theorem::before {
- content: 'Theorem ' counter(theorem) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Lemma */
-.lemma {
- counter-increment: theorem;
- display: block;
- margin: 12px 0;
- font-style: italic;
-}
-.lemma::before {
- content: 'Lemma ' counter(theorem) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Proof */
-.proof {
- display: block;
- margin: 12px 0;
- font-style: normal;
- position: relative;
-}
-.proof::before {
- content: 'Proof. ' attr(title);
- font-style: italic;
-}
-.proof:after {
- content: '◾️';
- position: absolute;
- right: -12px;
- bottom: -2px;
-}
-
-/* Definition */
-.definition {
- counter-increment: definition;
- display: block;
- margin: 12px 0;
- font-style: normal;
-}
-.definition::before {
- content: 'Definition ' counter(definition) '. ';
- font-weight: bold;
- font-style: normal;
-}
-
-/* Center align author name, use small caps and add vertical spacing */
-.author {
- margin: 0.85rem 0;
- font-variant-caps: small-caps;
- text-align: center;
-}
-
-/* Make footnote text smaller and left align it (looks bad with long URLs) */
-.footref { display: inline-block; padding: 0 3px; }
-.footnotes p {
- text-align: left;
- line-height: 1.5;
- font-size: 85%;
- margin-bottom: 0.4rem;
-}
-
-/* Center title and paragraph */
-.abstract,
-.abstract p {
- text-align: center;
-}
-.abstract {
- margin: 2.25rem;
- font-size: 0.85rem;
- font-style: italic;
-}
-
-/* Format the LaTeX symbol correctly (a higher up, e lower) */
-.latex span:nth-child(1) {
- text-transform: uppercase;
- font-size: 0.75em;
- vertical-align: 0.25em;
- margin-left: -0.36em;
- margin-right: -0.15em;
- line-height: 1ex;
-}
-
-.latex span:nth-child(2) {
- text-transform: uppercase;
- vertical-align: -0.5ex;
- margin-left: -0.1667em;
- margin-right: -0.125em;
- line-height: 1ex;
-}
-
-/* Heading typography */
-h1 {
- font-size: 2.5rem;
- line-height: 3.25rem;
- margin-bottom: 1.625rem;
-}
-
-h2 {
- font-size: 1.7rem;
- line-height: 2rem;
- margin-top: 3rem;
-}
-
-h3 {
- font-size: 1.4rem;
- margin-top: 2.5rem;
-}
-
-h4 {
- font-size: 1.2rem;
- margin-top: 2rem;
-}
-
-h5 {
- font-size: 1rem;
- margin-top: 1.8rem;
-}
-
-h6 {
- font-size: 1rem;
- font-style: italic;
- font-weight: normal;
- margin-top: 2.5rem;
-}
-
-h3,
-h4,
-h5,
-h6 {
- line-height: 1.625rem;
-}
-
-h1 + h2 {
- margin-top: 1.625rem;
-}
-
-h2 + h3,
-h3 + h4,
-h4 + h5 {
- margin-top: 0.8rem;
-}
-
-h5 + h6 {
- margin-top: -0.8rem;
-}
-
-h2,
-h3,
-h4,
-h5,
-h6 {
- margin-bottom: 0.8rem;
-}
/* COLORS */
/* colortheme switch */
@@ -411,14 +22,6 @@ label { font-weight: 700; }
label:hover { cursor: pointer; }
label ~ pre { margin-top: 0; }
.org-src-container { margin: 1rem 0; }
-#logo { text-align: center; }
-body { margin:0; padding: 0; border: 0; max-width: none;}
-#preamble, #postamble { text-align: center; }
-#content,.content,#preamble,#postamble {
- max-width: 60ch;
- overflow: hidden;
- margin: 0 auto;
-}
figure img { width: 100%; }
.footdef > sup { vertical-align: top; font-size: medium; }
.footdef > sup > a { padding: 0.5em; }
@@ -433,7 +36,7 @@ footer { margin: 3em 0;
}
td { border-bottom: none; padding: .2rem; }
table { margin-top: 1rem; }
-nav { text-align: center; padding: 2em 0; }
+nav { text-align: center; padding: 1em 0; }
pre { line-height: 1em; }
:root {
diff --git a/src/index.org b/src/index.org
index 8e0d501..bcfa5c9 100644
--- a/src/index.org
+++ b/src/index.org
@@ -6,6 +6,8 @@
#+LANG: en
#+OPTIONS: H:5
#+STARTUP: showeverything
+#+MACRO: br @@html:
@@
+#+MACRO: pemail @@html: Yann Esposito <yann@esposito.host>@@
@@html:@@
-#+MACRO: br @@html:
@@
-#+MACRO: pemail @@html: Yann Esposito <yann@esposito.host>@@
I'm a functional programmer, working remotely for Cisco.{{{br}}}
I work in Clojure and use Haskell/Purescript during the weekends.
@@ -46,18 +46,10 @@ priority:
1. *Respect Privacy*; no tracker of any sort (no ads, no google analytics, no
referrer for all external links, etc...)
- {{{br}}}
- {{{br}}}
2. *javascript free*; no js at all (math is rendered with MathML).
- {{{br}}}
- {{{br}}}
3. *Accessibility*; should be easy to read on a text browser so people with
disabilities could easily consume it.
- {{{br}}}
- {{{br}}}
4. *RSS*; you should be able to get informed when I add a new blog post.
- {{{br}}}
- {{{br}}}
5. *Frugal*; try to minimize the resources needed to visit my website; no
javascript, no web-font, not too much CSS magic, not much images or really
compressed one.
diff --git a/templates/post.mustache b/templates/post.mustache
index 628730d..83b11fc 100644
--- a/templates/post.mustache
+++ b/templates/post.mustache
@@ -30,7 +30,8 @@