forked from tangled.org/core
Monorepo for Tangled
1<!DOCTYPE html> 2<html xmlns="http://www.w3.org/1999/xhtml" lang="$lang$" xml:lang="$lang$"$if(dir)$ dir="$dir$"$endif$> 3 <head> 4 <meta charset="utf-8" /> 5 <meta name="generator" content="pandoc" /> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes" /> 7 $for(author-meta)$ 8 <meta name="author" content="$author-meta$" /> 9 $endfor$ 10 11 $if(date-meta)$ 12 <meta name="dcterms.date" content="$date-meta$" /> 13 $endif$ 14 15 $if(keywords)$ 16 <meta name="keywords" content="$for(keywords)$$keywords$$sep$, $endfor$" /> 17 $endif$ 18 19 $if(description-meta)$ 20 <meta name="description" content="$description-meta$" /> 21 $endif$ 22 23 <title>$pagetitle$</title> 24 25 <style> 26 $styles.css()$ 27 </style> 28 29 $for(css)$ 30 <link rel="stylesheet" href="$css$" /> 31 $endfor$ 32 33 $for(header-includes)$ 34 $header-includes$ 35 $endfor$ 36 37 <link rel="preload" href="/static/fonts/InterVariable.woff2" as="font" type="font/woff2" crossorigin /> 38 39 </head> 40 <body class="bg-white dark:bg-gray-900 min-h-screen flex flex-col min-h-screen"> 41 $for(include-before)$ 42 $include-before$ 43 $endfor$ 44 45 $if(toc)$ 46 <!-- mobile TOC trigger --> 47 <div class="md:hidden px-6 py-4 border-b border-gray-200 dark:border-gray-700"> 48 <button 49 type="button" 50 popovertarget="mobile-toc-popover" 51 popovertargetaction="toggle" 52 class="w-full flex gap-2 items-center text-sm font-semibold dark:text-white" 53 > 54 ${ menu.svg() } 55 $if(toc-title)$$toc-title$$else$Table of Contents$endif$ 56 </button> 57 </div> 58 59 <div 60 id="mobile-toc-popover" 61 popover 62 class="mobile-toc-popover 63 bg-white dark:bg-gray-800 64 border-b border-gray-200 dark:border-gray-700 65 h-full overflow-y-auto 66 px-6 py-4 fixed inset-x-0 top-0 w-fit max-w-4/5 m-0" 67 > 68 <button 69 type="button" 70 popovertarget="mobile-toc-popover" 71 popovertargetaction="toggle" 72 class="w-full flex gap-2 items-center text-sm font-semibold dark:text-white mb-4"> 73 ${ x.svg() } 74 $if(toc-title)$$toc-title$$else$Table of Contents$endif$ 75 </button> 76 ${ table-of-contents:toc.html() } 77 ${ single-page:mode.html() } 78 </div> 79 80 81 <!-- desktop sidebar toc --> 82 <nav id="$idprefix$TOC" role="doc-toc" class="hidden md:block fixed left-0 top-0 w-80 h-screen bg-gray-50 dark:bg-gray-800 border-r border-gray-200 dark:border-gray-700 overflow-y-auto p-4 z-50"> 83 $if(toc-title)$ 84 <h2 id="$idprefix$toc-title" class="text-lg font-semibold mb-4 text-gray-900">$toc-title$</h2> 85 $endif$ 86 ${ table-of-contents:toc.html() } 87 ${ single-page:mode.html() } 88 </nav> 89 $endif$ 90 91 <div class="$if(toc)$md:ml-80$endif$ flex-1 flex flex-col"> 92 <main class="max-w-4xl w-full mx-auto p-6 flex-1"> 93 $if(top)$ 94 $-- only print title block if this is NOT the top page 95 $else$ 96 $if(title)$ 97 <header id="title-block-header" class="mb-8 pb-8 border-b border-gray-200 dark:border-gray-700"> 98 <h1 class="text-4xl font-bold mb-2 text-black dark:text-white">$title$</h1> 99 $if(subtitle)$ 100 <p class="text-xl text-gray-500 dark:text-gray-400 mb-2">$subtitle$</p> 101 $endif$ 102 $for(author)$ 103 <p class="text-sm text-gray-500 dark:text-gray-400">$author$</p> 104 $endfor$ 105 $if(date)$ 106 <p class="text-sm text-gray-500 dark:text-gray-400">Updated on $date$</p> 107 $endif$ 108 $if(abstract)$ 109 <div class="mt-6 p-4 bg-gray-50 rounded-lg"> 110 <div class="text-sm font-semibold text-gray-700 uppercase mb-2">$abstract-title$</div> 111 <div class="text-gray-700">$abstract$</div> 112 </div> 113 $endif$ 114 $endif$ 115 </header> 116 $endif$ 117 <article class="prose dark:prose-invert max-w-none"> 118 $body$ 119 </article> 120 </main> 121 <nav id="sitenav" class="border-t border-gray-200 dark:border-gray-700 bg-gray-50 dark:bg-gray-800 "> 122 <div class="max-w-4xl mx-auto px-8 py-4"> 123 <div class="flex justify-between gap-4"> 124 <span class="flex-1"> 125 $if(previous.url)$ 126 <span class="text-xs text-gray-500 dark:text-gray-400 uppercase block mb-1">Previous</span> 127 <a href="$previous.url$" accesskey="p" rel="previous">$previous.title$</a> 128 $endif$ 129 </span> 130 <span class="flex-1 text-right"> 131 $if(next.url)$ 132 <span class="text-xs text-gray-500 dark:text-gray-400 uppercase block mb-1">Next</span> 133 <a href="$next.url$" accesskey="n" rel="next">$next.title$</a> 134 $endif$ 135 </span> 136 </div> 137 </div> 138 </nav> 139 </div> 140 $for(include-after)$ 141 $include-after$ 142 $endfor$ 143 </body> 144</html>