make the .nano.html version actually good

2025-09-09 17:05:07 +02:00 · 2025-07-23 09:31:06 +02:00
parent b08c426877
commit edc0a2d5ba
8 changed files with 68 additions and 50 deletions
--- a/common.typ
+++ b/common.typ
@@ -308,5 +308,9 @@ document.addEventListener('scroll', (event) => {
 }

 #let blocking-code(raw) = {
-  context html-frame(raw)
+  if is-nano {
+    raw
+  } else {
+    context html-frame(raw)
+  }
 }
--- a/components/header.typ
+++ b/components/header.typ
@@ -1,13 +1,22 @@
 #import "../common.typ": *
+#import "../simple-page-layout.typ": variant-link

 #let rev() = [
-  #if git_rev != "" {[
-    Git revision #flink("https://github.com/alex-s168/website/tree/" + git_rev)[\##short_git_rev]
-  ]}
-
-  #if git_commit_date != "" {[
-    Modified at #git_commit_date
-  ]}
+  #if is-nano [
+    #if git_commit_date != "" [
+      Last modified: #git_commit_date
+      #if git_rev != "" [
+        (Git \##raw(short_git_rev))
+      ]
+    ]
+  ] else [
+    #if git_rev != "" [
+      Git revision #flink("https://github.com/alex-s168/website/tree/" + git_rev)[\##short_git_rev] \
+    ]
+    #if git_commit_date != "" [
+      Modified at #git_commit_date
+    ]
+  ]
 ]

 // authors is list of people in common:people
@@ -16,3 +25,9 @@

  Written by #authors.map((p) => person(p)).join[, ]
 ]
+
+#let pdf-readability() = {
+  if is-web {section[
+    Note that the #variant-link([PDF Version], ".min.pdf") of this page might look a bit better styling wise.
+  ]}
+}
--- a/core-page-style.typ
+++ b/core-page-style.typ
@@ -10,11 +10,14 @@
    #html-head

    #html.elem("meta", attrs:(charset:"utf-8"))
-    #html.elem("meta", attrs:(name:"viewport", content:"width=device-width, initial-scale=1"))

-    #let ico = res-path()+"favicon.png"
-    #html.elem("link", attrs:(rel:"icon", sizes:"512x512", href:ico))
-    #html.elem("link", attrs:(rel:"image_src", type:"image/png", href:ico))
+    #if not is-nano [
+      #html.elem("meta", attrs:(name:"viewport", content:"width=device-width, initial-scale=1"))
+
+      #let ico = res-path()+"favicon.png"
+      #html.elem("link", attrs:(rel:"icon", sizes:"512x512", href:ico))
+      #html.elem("link", attrs:(rel:"image_src", type:"image/png", href:ico))
+    ]
  ])
 }
 #context html-opt-elem("body", (:))[
@@ -70,14 +73,14 @@
  }
 }

-#show heading: it => underline[#it #v(3pt)]
+#show heading: it => if is-nano { it } else { underline[#it #v(3pt)] }

 #set underline(stroke: 1pt, offset: 2pt)

-#show footnote: it => if is-web { [] } else { it }
-#show footnote.entry: it => if is-web { [] } else { it }
+#show footnote: it => if is-web or is-nano { [] } else { it }
+#show footnote.entry: it => if is-web or is-nano { [] } else { it }

-#context if is-html() {
+#context if is-html() and not is-nano {
 html.elem("style", "
  @font-face {
    font-family: 'DejaVu Sans Mono';
--- a/pages/article-gpu-arch-1.typ
+++ b/pages/article-gpu-arch-1.typ
@@ -1,7 +1,7 @@
 #import "../common.typ": *
 #import "../simple-page-layout.typ": *
 #import "../core-page-style.typ": *
-#import "../components/header.typ": rev-and-authors
+#import "../components/header.typ": *

 #simple-page(
  gen-table-of-contents: true,
@@ -16,9 +16,7 @@
  ]
 ]

-#if is-web {section[
-  Note that the #gen-min-pdf-link[PDF Version] of this page might look a bit better styling wise.
-]}
+#pdf-readability()

 #section[
  = Introduction
--- a/pages/article-make-regex-engine-1.typ
+++ b/pages/article-make-regex-engine-1.typ
@@ -1,7 +1,7 @@
 #import "../common.typ": *
 #import "../simple-page-layout.typ": *
 #import "../core-page-style.typ": *
-#import "../components/header.typ": rev-and-authors
+#import "../components/header.typ": *

 #simple-page(
  gen-table-of-contents: true,
@@ -18,9 +18,7 @@
  ]
 ]

-#if is-web {section[
-  Note that the #gen-min-pdf-link[PDF Version] of this page might look a bit better styling wise.
-]}
+#pdf-readability()

 #section[
  = Introduction
--- a/pages/compiler-pattern-matching.typ
+++ b/pages/compiler-pattern-matching.typ
@@ -1,7 +1,7 @@
 #import "../common.typ": *
 #import "../simple-page-layout.typ": *
 #import "../core-page-style.typ": *
-#import "../components/header.typ": rev-and-authors
+#import "../components/header.typ": *

 #simple-page(
  gen-table-of-contents: true,
@@ -16,9 +16,7 @@
  ]
 ]

-#if is-web {section[
-  Note that the #gen-min-pdf-link[PDF Version] of this page might look a bit better styling wise.
-]}
+#pdf-readability()

 #section[
  = Introduction
@@ -317,13 +315,7 @@

  \
  As a simple, *non realistic* example, let's imagine a CPU (core) that has one bit operations execution unit,
-  and two ALU execution units:
-  #context html-frame(table(
-    columns: 3,
-    inset: 7pt,
-    [ Bit Ops ],
-    [ ALU ], [ ALU ],
-  ))
+  and two ALU execution units / ports. \
  This means that the CPU can execute two instructions in the ALU unit and one instruction in the bit ops unit at the same time.
 ]

--- a/pages/project-etc-nand.typ
+++ b/pages/project-etc-nand.typ
@@ -1,6 +1,7 @@
 #import "../common.typ": *
 #import "../simple-page-layout.typ": *
 #import "../components/pcb-view.typ": *
+#import "../components/header.typ": *

 #let pcb-size-percent = 80
 #let qpcb(file) = {
@@ -18,9 +19,9 @@
  #title[ etc-nand ]
 ]

-#if is-web {section[
-  Note that the #gen-min-pdf-link[PDF Version] of this page might look a bit better styling wise.
+// #pdf-readability()

+#if is-web {section[
  You can click the PCB images to switch to the other side.
 ]}

--- a/simple-page-layout.typ
+++ b/simple-page-layout.typ
@@ -7,9 +7,9 @@
  } else { content }]
 }

-#let gen-min-pdf-link(content) = {
+#let variant-link(content, variant) = {
  [#context if is-html() {
-    html.elem("a", attrs:(href:"#",onclick:"gotoMinPdf();"), content)
+    html.elem("a", attrs:(href:"#",onclick:"gotoVariant(\""+variant+"\");"), content)
  } else { content }]
 }

@@ -36,13 +36,18 @@
      
      html-style(class:"sidebar", "", column-fixed(
        [#if gen-table-of-contents { [#table-of-contents()] }],
-        [#context if min-pdf-link and is-html() {
-          gen-min-pdf-link("Minimal PDF Version")
-        }],
+
        [#if gen-index-ref {[
           #context br()
           #context html-href("index.html")[#html-bold[Website Home]]
+           #context br()
        ]}],
+        [#context if min-pdf-link and is-html() [
+          Renderings of this page:
+          - #variant-link("Minimal PDF (printable)", ".min.pdf")
+          - #variant-link("less bloated HTML", ".min.html")
+          - #variant-link("minimal HTML", ".nano.html")
+        ]],

        [#context if is-html() {
          html.elem("style", "
@@ -90,14 +95,16 @@
    content
  }

-  #html-script("
-    function gotoMinPdf() {
-      window.location.href = window.location.href.replace(/\.\w+.html/g, '.min.pdf');
-    }
+  #if not is-nano {
+    html-script("
+      function gotoVariant(variant) {
+        window.location.href = window.location.href.replace(/\.\w+.html/g, variant);
+      }

-    window.addEventListener('beforeprint', (event) => {
-      gotoMinPdf();
-    });
-  ")
+      window.addEventListener('beforeprint', (event) => {
+        gotoVariant('.min.pdf');
+      });
+    ")
+  }
  ]
 }