big cleanup, minify

docs.typ

@@ -1,86 +1,116 @@
+#let site-title = [The Wireless Masterclass]
+
 #import "/static/index.typ": stylesheets
 
-#let docs-page(title: none, route: none, content) = {
-  document(
-    route + "index.html",
-    title: title,
-    html.html({
-      html.head({
-        html.meta(charset: "utf-8")
-        html.meta(name: "viewport", content: "width=device-width, initial-scale=1")
-        html.meta(name: "color-scheme", content: "dark light")
-        for stylesheet in stylesheets {
-          html.link(rel: "stylesheet", href: stylesheet)
-        }
-        html.title(context title)
-      })
-      html.body({
-        html.a(href: "#main", [Skip to content])
+#let docs-page(path, header: auto, footer: auto) = main => document(path, html.html(
+  lang: "en_US",
+  {
+    html.head({
+      html.meta(charset: "utf-8")
+      html.meta(name: "viewport", content: "width=device-width, initial-scale=1")
+      html.meta(name: "color-scheme", content: "dark light")
+      for stylesheet in stylesheets { html.link(rel: "stylesheet", href: stylesheet) }
+      html.title(context document.title)
+    })
+    html.body({
+      if (header != none) {
+        html.header(if (header == auto) {
+          context {
+            let doc = query(document).first()
+            link(doc.location(), doc.title)
+          }
 
-        // html.header([header])
+          title()
 
-        html.nav(aria-label: "Table of Contents", context {
-          html.ul({
-            for doc in query(document) {
-              html.li({
-                html.details(open: doc == query(selector(document).before(here())).last(), {
-                  html.summary(link(doc.location(), doc.title))
-                  html.ul(context for sec in query(selector(heading.where(level: 1)).within(doc.location())) {
-                    html.li(link(
-                      sec.location(),
-                      [#counter(heading).display(at: sec.location()) #sec.body],
-                    ))
-                  })
-                })
-              })
-            }
-          })
-        })
-
-        html.nav(aria-label: "Outline", context {
-          let doc = query(selector(document).before(here())).last()
-          show html.elem.where(tag: "nav"): it => it.body
-          show html.elem.where(tag: "ol"): it => html.elem("ul", it.body)
-          outline(title: none, depth: 2, target: selector(heading).within(doc.location()))
-        })
-
-        html.main(id: "main", {
-          html.h1(title)
-          content
+          context {
+            let doc = query(selector(document).before(here())).last()
+            outline(title: none, target: selector(heading).within(doc.location()))
+          }
 
           html.nav(aria-label: "Page Navigation", context {
-            let prevs = query(selector(document).before(here()))
-            let nexts = query(selector(document).after(here()))
-
-            html.ul({
-              if (prevs.len() > 1) {
-                let prev = prevs.at(-2)
+            html.ol(style: "list-style-type: none", {
+              let nexts = query(selector(document).after(here()))
+              if (nexts.len() > 0) {
                 html.li(
-                  aria-label: "Prev Page",
-                  link(prev.location(), prev.title),
+                  link(nexts.at(0).location(), [Next: #nexts.at(0).title]),
                 )
               }
 
-              if (nexts.len() > 0) {
-                show html.elem.where(tag: "a"): it => it
-                let next = nexts.at(0)
+              let prevs = query(selector(document).before(here()))
+              if (prevs.len() > 1) {
                 html.li(
-                  aria-label: "Next Page",
-                  link(next.location(), next.title),
+                  link(prevs.at(-2).location(), [Previous: #prevs.at(-1).title]),
                 )
               }
             })
           })
+        } else {
+          header
         })
 
-        // html.footer([footer])
-      })
-    }),
+        divider()
+      }
+      html.main(main)
+      if (footer != none) {
+        divider()
+
+        html.footer({
+          if (footer == auto) {
+            html.nav(aria-label: "Page Navigation", context {
+              html.ol(style: "list-style-type: none", {
+                let nexts = query(selector(document).after(here()))
+                if (nexts.len() > 0) {
+                  html.li(
+                    link(nexts.at(0).location(), [Next: #nexts.at(0).title]),
+                  )
+                }
+
+                let prevs = query(selector(document).before(here()))
+                if (prevs.len() > 1) {
+                  html.li(
+                    link(prevs.at(-2).location(), [Previous: #prevs.at(-1).title]),
+                  )
+                }
+              })
+            })
+          } else {
+            footer
+          }
+        })
+      }
+    })
+  },
+))
+
+#let callout(kind: str, label: str, body) = html.section(class: kind + " callout", context {
+  let depth = counter(heading).at(here()).len() + 1
+  heading(
+    depth: depth,
+    outlined: false,
+    numbering: none,
+    label,
   )
-}
+  " "
+  body
+})
 
-#let callout(kind: str, body) = html.aside(aria-label: kind, body)
+#let note = callout.with(kind: "note", label: "Note:")
+#let warn = callout.with(kind: "warn", label: "Warning:")
+#let tip = callout.with(kind: "tip", label: "Tip:")
 
-#let note = callout.with(kind: "note")
-#let warn = callout.with(kind: "warn")
-#let tip = callout.with(kind: "tip")
+
+#let callout(kind: str, label: str, body) = html.section(class: kind + " callout", context {
+  let depth = counter(heading).at(here()).len() + 1
+  heading(
+    depth: depth,
+    outlined: false,
+    numbering: none,
+    label,
+  )
+  " "
+  body
+})
+
+#let note = callout.with(kind: "note", label: "Note:")
+#let warn = callout.with(kind: "warn", label: "Warning:")
+#let tip = callout.with(kind: "tip", label: "Tip:")