summaryrefslogtreecommitdiffstats
path: root/site
diff options
context:
space:
mode:
authorThomas Letan <lthms@soap.coffee>2020-02-27 09:22:57 +0100
committerThomas Letan <lthms@soap.coffee>2020-02-27 09:27:50 +0100
commit1a9268f141ac4234b2836d0207b1e87009821dd7 (patch)
tree849a707022a09fb5e62c25eb6931ccc5af876c2a /site
parenta105b5e0cd32e11624e5312af736e4828b06d6f4 (diff)
Theme reloading
Diffstat (limited to 'site')
-rw-r--r--site/cleopatra/Bootstrap.org32
-rw-r--r--site/cleopatra/Contents/Coq.org21
-rw-r--r--site/cleopatra/Contents/Org.org24
-rw-r--r--site/cleopatra/Soupault.org3
-rw-r--r--site/cleopatra/Theme.org269
-rw-r--r--site/posts/DiscoveringCommonLisp.org2
6 files changed, 195 insertions, 156 deletions
diff --git a/site/cleopatra/Bootstrap.org b/site/cleopatra/Bootstrap.org
index 3d954e6..b1a76ff 100644
--- a/site/cleopatra/Bootstrap.org
+++ b/site/cleopatra/Bootstrap.org
@@ -56,17 +56,8 @@ In a nutshell,
- ~ROOT~ ::
Tell Emacs where the root of your website sources is, so that tangled output
filenames can be given relative to it rather than the org files. So for
- instance, the ~BLOCK_SRC~ headers for ~Makefile~ looks like
-
- #+BEGIN_SRC org
-#+BEGIN_SRC makefile :tangle Makefile :noweb yes
- #+END_SRC
-
- instead of, /e.g./,
-
- #+BEGIN_SRC org
-#+BEGIN_SRC makefile :tangle ../../Makefile :noweb yes
- #+END_SRC
+ instance, the ~BLOCK_SRC~ tangle parameter for ~Makefile~ looks like ~:tangle
+ Makefile~, instead of ~:tangle ../../Makefile~.
- ~CLEODIR~ ::
Tell *~cleopatra~* where its sources live. If you place it inside the ~site/~
directory (as it is intended), and you enable the use of ~org~ files to author
@@ -76,7 +67,7 @@ In a nutshell,
For this website, these constants are defined as follows.
-#+BEGIN_SRC makefile :tangle Makefile :noweb tangle
+#+BEGIN_SRC makefile :tangle Makefile :noweb no-export
ROOT := $(shell pwd)
CLEODIR := site/cleopatra
#+END_SRC
@@ -92,7 +83,7 @@ and providing rules to remove them.
Long-term artifacts whose generation can be time consuming. They will only be
removed by ~make cleanall~.
-#+BEGIN_SRC makefile :tangle Makefile :noweb tangle
+#+BEGIN_SRC makefile :tangle Makefile
ARTIFACTS := build.log
CONFIGURE :=
#+END_SRC
@@ -128,7 +119,7 @@ restore it using ~git~.
We define variables that ensure that the ~ROOT~ environment variable is set and
~tangle-org.el~ is loaded when using Emacs.
-#+BEGIN_SRC makefile :tangle Makefile :noweb tangle
+#+BEGIN_SRC makefile :tangle Makefile
EMACSBIN := emacs
EMACS := ROOT="${ROOT}" ${EMACSBIN}
TANGLE := --batch \
@@ -140,7 +131,7 @@ Finally, we introduce a
[[https://www.gnu.org/software/make/manual/html_node/Canned-Recipes.html#Canned-Recipes][canned
recipe]] to seamlessly tangle a given file.
-#+BEGIN_SRC makefile :tangle Makefile :noweb tangle
+#+BEGIN_SRC makefile :tangle Makefile
define emacs-tangle =
echo " tangle $<"
${EMACS} $< ${TANGLE}
@@ -155,7 +146,7 @@ processes. This chain is divided into three stages: ~prebuild~, ~build~, and
This translates as follows in ~Makefile~.
-#+BEGIN_SRC makefile :tangle Makefile :noweb tangle
+#+BEGIN_SRC makefile :tangle Makefile
default : postbuild ignore
init :
@@ -306,7 +297,7 @@ Eventually, the second step will be automated, but in the meantime
this customization is mandatory.
#+END_TODO
-#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb tangle :exports none
+#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb yes :exports none
<<extends(IN="Theme.org", PROC="theme", AUX="templates/main.html site/style/main.sass")>>
#+END_SRC
@@ -329,7 +320,7 @@ Eventually, generation processes shall be allowed to produce specific ~soupault~
widgets to be integrated into ~soupault.conf~.
#+END_TODO
-#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb tangle :exports none
+#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb yes :exports none
<<extends(IN="Soupault.org", PROC="soupault", AUX="soupault.conf plugins/urls-rewriting.lua plugins/external-urls.lua site/style/plugins.sass scripts/history.sh templates/history.html package.json scripts/katex.js")>>
#+END_SRC
@@ -355,7 +346,7 @@ In the present website, contents can be written in the following format:
[[./Contents/Org.org][Learn more about the generation process for Org
documents]]
-#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb tangle :exports none
+#+BEGIN_SRC makefile :tangle bootstrap.mk :noweb yes :exports none
<<extends(IN="Contents/Coq.org", PROC="coq", AUX="site/style/coq.sass")>>
<<extends(IN="Contents/Org.org", PROC="org", AUX="scripts/packages.el scripts/export-org.el site/style/org.sass")>>
#+END_SRC
@@ -367,8 +358,7 @@ In the present website, contents can be written in the following format:
stages.
#+END_TODO
-#+BEGIN_SRC bash :tangle scripts/update-gitignore.sh :tangle-mode (identity #o755)
-#!/bin/bash
+#+BEGIN_SRC bash :tangle scripts/update-gitignore.sh :shebang "#+/bin/bash"
BEGIN_MARKER="# begin generated files"
END_MARKER="# begin generated files"
diff --git a/site/cleopatra/Contents/Coq.org b/site/cleopatra/Contents/Coq.org
index a792ef9..937467e 100644
--- a/site/cleopatra/Contents/Coq.org
+++ b/site/cleopatra/Contents/Coq.org
@@ -30,13 +30,22 @@ COQDOCARG := --no-index --charset utf8 --short \
#+BEGIN_SRC sass :tangle site/style/coq.sass
div.code
white-space: nowrap
- overflow-x: auto
- scrollbar-width: thin
-pre
- padding: .3em 0 .3em 0
- overflow-x: auto
- scrollbar-width: thin
+.doc
+ @include padding-centered
+ margin-top : 1em
+ margin-bottom : 1em
+
+.code
+ @include padding-centered
+ @include code-block
+
+.inlinecode
+ @include code-font
+
+h1, h2, h3, h4, h5, h6
+ .inlinecode
+ font-size: 100%
.code a[href]
text-decoration: none
diff --git a/site/cleopatra/Contents/Org.org b/site/cleopatra/Contents/Org.org
index 8320ca1..2eac322 100644
--- a/site/cleopatra/Contents/Org.org
+++ b/site/cleopatra/Contents/Org.org
@@ -119,6 +119,17 @@ INIT := --batch --load="${ROOT}/scripts/packages.el" \
#+END_SRC
#+BEGIN_SRC sass :tangle site/style/org.sass
+.org-src-container
+ @include code-block
+ padding-top : .1rem
+ padding-bottom : .1rem
+
+.org-src-tangled-to, .org-src-name
+ @include padding-centered(4rem)
+
+.footdef
+ @include padding-centered
+
.footpara
display: inline
margin-left: .2em
@@ -132,11 +143,6 @@ INIT := --batch --load="${ROOT}/scripts/packages.el" \
.section-number-6
display: none
-.org-src-container
- width: 100%
- overflow-x: auto
- scrollbar-width: thin
-
dl
dt
font-weight: bold
@@ -144,17 +150,17 @@ dl
margin-top: 0
.org-literate-programming
+ padding-top : 1rem
+ padding-bottom : 1rem
.org-src-name
- font-family: 'Fira Code', monospace
+ @include code-font
font-weight: bold
- font-size: 80%
.org-src-tangled-to:before
content: "той"
.org-src-tangled-to
- font-family: 'Fira Code', monospace
+ @include code-font
font-weight: bold
- font-size: 80%
text-align: right
#+END_SRC
diff --git a/site/cleopatra/Soupault.org b/site/cleopatra/Soupault.org
index a5703be..6b1ed58 100644
--- a/site/cleopatra/Soupault.org
+++ b/site/cleopatra/Soupault.org
@@ -9,7 +9,7 @@ soupault-build :
@echo " run soupault"
@soupault
-serve : build
+serve : soupault-prebuild
@echo " start a python server"
@cd build; python -m http.server 2>/dev/null
@@ -419,6 +419,7 @@ main "$(cat)" "${1}"
#+BEGIN_SRC sass :tangle site/style/plugins.sass
#history
table
+ @include margin-centered(2rem)
border-top: 2px solid $primary-color
border-bottom: 2px solid $primary-color
border-collapse: collapse;
diff --git a/site/cleopatra/Theme.org b/site/cleopatra/Theme.org
index afe0934..0d7c5e8 100644
--- a/site/cleopatra/Theme.org
+++ b/site/cleopatra/Theme.org
@@ -17,19 +17,64 @@ ARTIFACTS += ${CSS} ${SASS}
* Main HTML Template
-#+NAME: js_lazyloading
+#+BEGIN_SRC html :tangle templates/main.html :noweb no-export
+<html lang="en">
+ <<head>>
+ <<body>>
+</html>
+#+END_SRC
+
+** ~<head>~
+
+#+NAME: head
+#+BEGIN_SRC html :noweb no-export
+<head>
+ <<encoding>>
+ <<viewport>>
+ <title></title>
+ <<syncloading_html>>
+ <<asyncloading_html>>
+</head>
+#+END_SRC
+
+*** Encoding
+
+#+NAME: encoding
+#+BEGIN_SRC html
+<meta charset="utf-8">
+#+END_SRC
+
+*** Viewport
+
+#+NAME: viewport
+#+BEGIN_SRC html
+<meta name="viewport"
+ content="width=device-width, initial-scale=1.0">
+#+END_SRC
+
+*** Assets Loading
+
+#+NAME: syncloading_html
+#+BEGIN_SRC html
+<link rel="stylesheet" href="/style/main.css">
+<link rel="icon" type="image/ico" href="/img/merida.webp">
+#+END_SRC
+
+#+NAME: asyncloading_js
#+BEGIN_SRC js
-let noscript = document.getElementById('lazyloading');
+let noscript = document.getElementById('asyncloading');
let resources = noscript.innerText.split('\n');
for (var ix in resources) {
noscript.insertAdjacentHTML('beforebegin', resources[ix]);
}
+
+noscript.parentNode.removeChild(noscript);
#+END_SRC
-#+NAME: html_lazyloading
+#+NAME: asyncloading_html
#+BEGIN_SRC html
-<noscript id="lazyloading">
+<noscript id="asyncloading">
<link rel="stylesheet" href="/vendors/fira-code.2+swap/font.css">
<link rel="stylesheet" href="/vendors/et-book+swap/font.css">
<link rel="stylesheet" href="/vendors/katex.0.11.1+swap/katex.css">
@@ -38,38 +83,30 @@ for (var ix in resources) {
</nolink>
#+END_SRC
-#+BEGIN_SRC html :tangle templates/main.html :noweb tangle
-<html lang="en">
- <head>
- <meta charset="utf-8">
- <title> <!-- set automatically, see soupault.conf --> </title>
- <meta name="viewport"
- content="width=device-width, initial-scale=1.0">
- <link rel="stylesheet" href="/style/main.css">
- <link rel="icon" type="image/ico" href="/img/merida.webp">
- <<html_lazyloading>>
- </head>
- <body id="default">
- <nav>
- <ul>
- <li> <a href="/news">News</a></li>
- <li> <a href="/posts">Write-ups</a></li>
- <li> <a href="/">About</a></li>
- </ul>
- </nav>
- <header>
- <img src="/img/merida.webp"
- alt="Merida in the movie Ralph 2.0" />
- </header>
- <main>
- <!-- your page content will be inserted here,
- see the content_selector option in soupault.conf -->
- </main>
- <script>
- <<js_lazyloading>>
- </script>
- </body>
-</html>
+** ~body~
+
+#+NAME: body
+#+BEGIN_SRC html :noweb no-export
+<body id="default">
+ <nav>
+ <ul>
+ <li> <a href="/news">News</a></li>
+ <li> <a href="/posts">Write-ups</a></li>
+ <li> <a href="/">About</a></li>
+ </ul>
+ </nav>
+ <header>
+ <img src="/img/merida.webp"
+ alt="Merida in the movie Ralph 2.0" />
+ </header>
+ <main>
+ <!-- your page content will be inserted here,
+ see the content_selector option in soupault.conf -->
+ </main>
+ <script>
+ <<asyncloading_js>>
+ </script>
+</body>
#+END_SRC
* Main SASS File
@@ -84,57 +121,72 @@ $todo-fg: #494130
$remark-bg: #c5dbe2
$remark-fg: #4d575e
-*
- box-sizing: border-box
+$sans-serif : sans-serif
-body, html
- width: 100%
- height: 100%
- padding: 0
- margin: 0
- font-size: 100%
+$document-width : 33rem
+
+@mixin padding-centered($inc: 0rem)
+ padding-left : calc(50% - #{$document-width} / 2 - #{$inc})
+ padding-right : calc(50% - #{$document-width} / 2 - #{$inc})
+
+@mixin margin-centered($inc: 0rem)
+ margin-left : calc(50% - #{$document-width} / 2 - #{$inc})
+ margin-right : calc(50% - #{$document-width} / 2 - #{$inc})
+
+@mixin text-font
+ font-family : et-book, serif
+
+@mixin code-font($size : .9rem)
+ font-family: 'Fira Code', monospace
+ font-size: $size
+
+@mixin code-block
+ @include padding-centered
+ @include code-font
background: $bg-color
- color: $text-fg-color
- font-family: 'et-book', serif
+ color: $code-fg-color
-h1, h2, h3, h4, h5, a[href]
- color: $primary-color
+*
+ box-sizing: border-box
-h1, h2, h3, h4, h5
- font-family: sans-serif
+html, body
+ margin : 0
+ padding : 0
+ width : 100%
+ height : 100%
+ font-size : 120%
+ @include text-font
-h1
- text-align: center
+code, tt
+ @include code-font
-/* default */
+pre
+ @include code-font
body#default
- overflow-x: hidden
-
nav
- padding-top: 1em
- padding-bottom: 1em
- width: 100%
+ @include margin-centered
+ padding-top : 1rem
+ padding-bottom : 1rem
ul
- padding: 0
- margin: 0
- width: 100%
- display: flex
- flex-direction: row
- justify-content: center
- list-style-type: none
-
- li
- padding-left: .5em
- padding-right: .5em
- text-transform: uppercase
- font-family: sans-serif
- font-size: 130%
- font-weight: bold
-
- a
- text-decoration: none
+ padding : 0
+ margin : 0
+ width : 100%
+ display : flex
+ flex-direction : row
+ justify-content : center
+ list-style-type : none
+
+ li
+ padding-left: .5em
+ padding-right: .5em
+ text-transform: uppercase
+ font-family: sans-serif
+ font-weight: bold
+
+ a
+ text-decoration: none
header
text-align: center
@@ -142,42 +194,39 @@ body#default
img
text-align: center
border-radius: 50%
- width: 125px
+ width: 150px
main
- max-width: 30em
- margin: auto
- padding: 0em 1em 1em 1em
- font-size: 130%
+ h1
+ text-align: center
-body#default main .code, code, pre, .inlinecode, tt
- font-family: 'Fira Code', monospace
- color: $code-fg-color
- font-size: 75%
+ h1, h2, h3, h4, h5, h6
+ font-family : $sans-serif
+ code, tt
+ font-size: 100%
-body#default
- main
- summary
- color: $primary-color
- font-weight: bold
+ h1, h2, h3, h4, h5, h6, p, summary
+ @include padding-centered
+
+ dl, ul, ol
+ @include margin-centered
@import coq, org
- .TODO
- background: $todo-bg
- color: $todo-fg
- .REMARK
- background: $remark-bg
- color: $remark-fg
+.index
+ dt
+ font-weight : bold
+ color : $primary-color
- .TODO, .REMARK
- padding: 1em 1em 1em 1em
+ dd
+ margin-left : 0
+ margin-bottom : 1em
+
+ ol
+ margin-top: 0.3em
- p
- margin: 0
- p:not(:list-child)
- margin-bottom: 1em
+@import plugins
/* VCARD (index.html) */
body#vcard
@@ -208,20 +257,4 @@ body#vcard
a
color: $primary-color
-
-/* indexes */
-
-.index
- dt
- font-weight: bold
- color: $primary-color
-
- dd
- margin-left: 0
- margin-bottom: 1em
-
- ol
- margin-top: 0.3em
-
-@import plugins
#+END_SRC
diff --git a/site/posts/DiscoveringCommonLisp.org b/site/posts/DiscoveringCommonLisp.org
index f7bf74d..479f76c 100644
--- a/site/posts/DiscoveringCommonLisp.org
+++ b/site/posts/DiscoveringCommonLisp.org
@@ -59,7 +59,7 @@ Quicklisp is not a native feature of sbcl, and has to be loaded to be available.
To do it automatically, you have to create a file ~${HOME}/.sbclrc~, with the
following content:
-#+BEGIN_SRC
+#+BEGIN_SRC common-lisp
(load "~/quicklisp/setup")
#+END_SRC