diff options
author | Thomas Letan <lthms@soap.coffee> | 2020-08-27 15:05:29 +0200 |
---|---|---|
committer | Thomas Letan <lthms@soap.coffee> | 2020-08-27 15:05:29 +0200 |
commit | b065628fb1ffa6edf8f35a690931c2d56d26ab3e (patch) | |
tree | f5c75029bc4b61de228e809889dc58f5907e5fb6 /site/cleopatra | |
parent | Make the two articles about Ltac refer to each other (diff) |
Simplify the theme
Diffstat (limited to 'site/cleopatra')
-rw-r--r-- | site/cleopatra/coq.org | 64 | ||||
-rw-r--r-- | site/cleopatra/org.org | 55 | ||||
-rw-r--r-- | site/cleopatra/soupault.org | 44 | ||||
-rw-r--r-- | site/cleopatra/theme.org | 284 |
4 files changed, 144 insertions, 303 deletions
diff --git a/site/cleopatra/coq.org b/site/cleopatra/coq.org index 51b0ecb..7f617e8 100644 --- a/site/cleopatra/coq.org +++ b/site/cleopatra/coq.org @@ -28,80 +28,52 @@ COQDOCARG := --no-index --charset utf8 --short \ #+END_SRC #+BEGIN_SRC sass :tangle site/style/coq.sass -@mixin patchy-centered($inc: 0rem) - width : 100vw - position: relative - @media screen and (min-width : $document-width) - padding-left : calc(50vw - #{$document-width} / 2) - right : calc(50vw - #{$document-width} / 2) - @media screen and (max-width : $document-width) - padding-left : 1rem - right : 1rem - div.code white-space: nowrap + line-height : 140% -.coq-text-block - @include patchy-centered - padding-top: 1rem - padding-bottom: 1rem - -.doc - @include padding-centered - margin-top : 1em - margin-bottom : 1em - - pre - @include patchy-centered - padding-top : 1rem - padding-bottom : 1rem - background : $bg-verbatim - overflow-x : auto +div.code, +span.inlinecode + font-family : 'Fira Code', monospace + font-size : 80% -.code - @include padding-centered - @include code-block - -.inlinecode - @include code-font +div.doc + max-width : 35rem + line-height : 140% -h1, h2, h3, h4, h5, h6 - .inlinecode - font-size: 100% +.paragraph + margin-bottom : .8em +#+END_SRC +#+BEGIN_SRC sass :tangle site/style/coq.sass .code .id[title="keyword"] - color : #ff6188 + color : #d73a49 .id[title="definition"], .id[title="projection"], .id[title="theorem"], .id[title="lemma"] - color : #a9dc76 + color : #6f42c1 .id[title="inductive"], .id[title="record"], .id[title="axiom"], .id[title="class"] - color : #78dce8 + color : #005cc5 .id[title="constructor"] - color : #ab9df2 + color : #e36209 a[href] color : inherit text-decoration : none - background : #403e41 - padding : .05rem .15rem .05rem .15rem + background : #f7f7f7 + padding : .1rem .15rem .1rem .15rem border-radius : 15% .url-mark display: none - -.paragraph - margin-top: 1em - margin-bottom: 1em - #+END_SRC # Local Variables: diff --git a/site/cleopatra/org.org b/site/cleopatra/org.org index b846ee8..df6c513 100644 --- a/site/cleopatra/org.org +++ b/site/cleopatra/org.org @@ -9,9 +9,9 @@ (use-package haskell-mode :ensure t :defer t) (use-package toml-mode :ensure t :defer t) (use-package json-mode :ensure t :defer t) -(use-package monokai-pro-theme :ensure t :defer t +(use-package github-modern-theme :ensure t :defer t :init - (load-theme 'monokai-pro t)) + (load-theme 'github-modern t)) #+END_SRC #+BEGIN_SRC emacs-lisp :tangle scripts/export-org.el @@ -97,21 +97,8 @@ 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) - -.example - @include verbatim-block - // this is hacky, but it works: no need for a padding-bottom - padding-top : 1rem - -.footdef - @include padding-centered +#text-footnotes + max-width : 35rem .footpara display: inline @@ -127,27 +114,23 @@ INIT := --batch --load="${ROOT}/scripts/packages.el" \ display: none dl - dt - font-weight: bold - dd p - margin-top: 0 + dt + font-weight: bold + dd p + margin-top: 0 .footnotes - font-size : 1rem + font-size : 1rem .org-literate-programming - padding-top : 1rem - padding-bottom : 1rem - .org-src-name - @include code-font - font-weight: bold - - .org-src-tangled-to:before - content: "\f054" - font : normal normal normal 14px/1 ForkAwesome - - .org-src-tangled-to - @include code-font - font-weight: bold - text-align: right + .org-src-tangled-to:before + content: "\f054" + font : normal normal normal 11px/1 ForkAwesome + + .org-src-tangled-to, + .org-src-name + font-family : 'Fira Code', monospace + font-size : 70% + font-weight: bold + color : #444 #+END_SRC diff --git a/site/cleopatra/soupault.org b/site/cleopatra/soupault.org index fb2c57c..0675ae7 100644 --- a/site/cleopatra/soupault.org +++ b/site/cleopatra/soupault.org @@ -361,7 +361,14 @@ https://code.soap.coffee/writing/lthms.git <table> {{#history}} <tr> - <td class="date"{{#created}} id="created-at"{{/created}}{{#modified}} id="modified-at"{{/modified}}> + <td class="date" +{{#created}} + id="created-at" +{{/created}} +{{#modified}} + id="modified-at" +{{/modified}} + > {{date}} </td> <td class="subject">{{subject}}</td> @@ -377,26 +384,21 @@ https://code.soap.coffee/writing/lthms.git #+END_SRC #+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; - - td - border-bottom: 1px solid $primary-color - padding: .5em - vertical-align: top - - td.commit - font-size: smaller - - td.commit - font-family: 'Fira Code', monospace - color: $code-fg-color - font-size: 80% - white-space: nowrap; +table + border-top : 2px solid black + border-bottom : 2px solid black + border-collapse : collapse + max-width : 35rem + +td + border-bottom : 1px solid black + padding : .5em + +#history .commit + font-size : smaller + font-family : 'Fira Code', monospace + width : 7em + text-align : center #+END_SRC *** Implementation diff --git a/site/cleopatra/theme.org b/site/cleopatra/theme.org index 35f13b4..4c2ea26 100644 --- a/site/cleopatra/theme.org +++ b/site/cleopatra/theme.org @@ -29,35 +29,24 @@ ARTIFACTS += ${CSS} #+NAME: head #+BEGIN_SRC html :noweb no-export <head> - <<encoding>> - <<viewport>> + <meta charset="utf-8"> + <meta name="viewport" + content="width=device-width, initial-scale=1.0"> <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 + href="https://soap.coffee/+vendors/normalize.css.8.0.1/normalize.css" + rel="stylesheet"> <link rel="stylesheet" href="/style/main.css"> -<link rel="icon" type="image/ico" href="/img/merida.webp"> +<link rel="icon" type="image/ico" href="/img/merida.webp"> #+END_SRC #+NAME: asyncloading_js @@ -71,13 +60,13 @@ noscript.parentNode.removeChild(noscript); #+BEGIN_SRC html <noscript id="asyncloading"> <link href="https://soap.coffee/+vendors/fira-code.2+swap/font.css" - rel="stylesheet"> + rel="stylesheet"> <link href="https://soap.coffee/+vendors/et-book+swap/font.css" - rel="stylesheet"> + rel="stylesheet"> <link href="https://soap.coffee/+vendors/katex.0.11.1+swap/katex.css" - rel="stylesheet"> + rel="stylesheet"> <link href="https://soap.coffee/+vendors/fork-awesome.1.1.7+swap/css/fork-awesome.min.css" - rel="stylesheet"> + rel="stylesheet"> </nolink> #+END_SRC @@ -86,20 +75,38 @@ noscript.parentNode.removeChild(noscript); #+NAME: body #+BEGIN_SRC html :noweb no-export <body id="default"> - <nav> + <header> <ul> <li> <a href="/news">News</a></li> - <li> <a href="/">Write-ups</a></li> + <li> <a href="/">Technical Articles</a></li> + <li> <a href="/projects">Projects</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> + <footer> + <img src="https://soap.coffee/~lthms/img/merida.webp" + alt="Merida from the movie Ralph 2.0 from Disney is the + avatar I use most of the time on the Internet" + title="lthms’ avatar" /> + + <p> + Hi, I’m <strong>lthms</strong>, and this is my humble corner of the + Internet. You are very welcome here! If you are interested in + <em>functional programming</em>, <em>formal verification</em>, or <em>free + software projects in the making</em>, you may even enjoy your stay! + </p> + + <p> + This website has been generated using a collection of + <a href="/posts/Thanks.html">awesome free software projects</a>. You can + have a look at <a href="https://code.soap.coffee/writing/lthms">the source + of this webpage</a>, and if you have find an error, feel free to <a + href="mailto:">shoot me an email</a>. + </p> + </footer> <script> <<asyncloading_js>> </script> @@ -109,184 +116,61 @@ noscript.parentNode.removeChild(noscript); * Main SASS File #+BEGIN_SRC sass :tangle site/style/main.sass -$bg-color: #2d2a2e -$bg-verbatim : #f4f4f4 -$code-fg-color: #fcfcfa -$text-fg-color: #505050 -$primary-color: black -$todo-bg: #e4d3b3 -$todo-fg: #2f2b24 -$remark-bg: #c5dbe2 -$remark-fg: #4d575e - -$sans-serif : sans-serif - -$document-width : 38rem - -a - color : #557de8 -a:visited - color : #40599a - -@mixin padding-centered($inc: 0rem) - @media screen and (min-width : $document-width) - padding-left : calc(50% - #{$document-width} / 2 - #{$inc}) - padding-right : calc(50% - #{$document-width} / 2 - #{$inc}) - @media screen and (max-width : $document-width) - padding-left : 1rem - padding-right : 1rem - -@mixin margin-centered($inc: 0rem) - @media screen and (min-width : $document-width) - margin-left : calc(50% - #{$document-width} / 2 - #{$inc}) - margin-right : calc(50% - #{$document-width} / 2 - #{$inc}) - @media screen and (max-width : $document-width) - margin-left : 1rem - margin-right : 1rem - -@mixin text-font - font-family : serif - -@mixin code-font($size : .8em) - font-family: 'Fira Code', monospace - font-size: $size - -@mixin code-block - @include padding-centered - @include code-font - background : $bg-color - color : $code-fg-color - overflow-x : auto - scrollbar-width : thin - -@mixin verbatim-block - @include padding-centered - @include code-font - background : $bg-verbatim - overflow-x : auto - scrollbar-width : thin - * - box-sizing: border-box + box-sizing : border-box -html, body - margin : 0 - padding : 0 +html width : 100% - height : 100% - font-size : 115% - @include text-font + font-size : 100% body - overflow-x : hidden - -code, tt - @include code-font - + padding : 2rem + +main p, +main h1, +main h2, +main h3, +main h4, +main h5, +main h6, +main ul, +main dl, +main ol, +header, +footer + max-width : 35rem + line-height : 140% + +header ul, +footer p + font-size : 90% + +header ul + padding : 0 + margin : 0 + list-style-type : none + display : flex + gap : 1rem + +main + padding-top : 1rem + padding-bottom : 1rem + +footer img + border-radius : 100% + max-width : 7rem + float : right + margin-left : 1rem + margin-bottom : 1rem + +code, +tt, pre - @include code-font - -body#default - nav - @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-weight: bold - - a - text-decoration: none - - header - text-align: center - - img - text-align: center - border-radius: 50% - width: 150px - - main - h1 - text-align: center - - h2, h3, h4, h5, h6 - font-style: italic - - - code, tt - font-size: 100% - - h1, h2, h3, h4, h5, h6, p, summary - @include padding-centered - - dl, ul, ol - @include margin-centered - - .TODO - background : $todo-bg - color : $todo-fg - padding-top : .1rem - padding-bottom : .1rem - margin-top : 1rem - margin-bottom : 1rem - - @import coq, org - -.index - dt - font-weight : bold - color : $primary-color - - dd - margin-left : 0 - margin-bottom : 1em - - ol - margin-top: 0.3em + font-family : 'Fira Code', monospace + font-size : 80% + line-height : 140% @import plugins - -/* VCARD (index.html) */ -body#vcard - display: flex - align-items: center - flex-direction: column - font-size: 125% - - article - max-width: 400px - width: 80% - margin: auto - - img - display: block - border-radius: 50% - width: 175px - margin: auto - margin-bottom: 3em - - h1 - color: $primary-color - font-size: 300% - text-align: center - - nav dt - font-weight: bold - - a - color: $primary-color +@import org +@import coq #+END_SRC |