Started refactoring

This commit is contained in:
slashformotion 2021-07-21 20:23:55 +02:00
parent e2af7d63ca
commit c454c6f4ca
19 changed files with 186 additions and 124 deletions

View file

@ -5,25 +5,20 @@ Hugo-Tufte is a minimalist blog-like theme for the
[static site generator Hugo](https://gohugo.io) that
attempts to be a faithful implementation of the
[Tufte-css](https://github.com/edwardtufte/tufte-css) project.
It supports mathematical typesetting via [MathJax](https://www.mathjax.org).
It supports mathematical typesetting via [katex](https://katex.org/).
By utilizing copious partial templates the theme is largely customizable.
## State of Project
This theme is largely unmaintained. If there is a particular fork
that should be considered the primary project please submit a PR
updating the README, thanks!
This is a fork of the original [hugo-tufte](https://github.com/shawnohare/hugo-tufte);
## Math
Mathjax renders LaTeX written inside of markdown files. LaTeX can be
written more or less as normal, but inline and display environments that
start with `\` must be escaped. Some examples:
[katex](https://katex.org/) renders LaTeX written inside of markdown files. LaTeX can be
written more or less as normal. Some examples:
- `This $\LaTeX$ will be rendered inline.`
- `This \\(\LaTeX\\) will be rendered inline.`
- `A simple displayed equation: $$f(x, y) := e^{x^2 - y^2}.$$`
- `A simple displayed equation: \\[f(x, y) := e^{x^2 - y^2}.\\]`
- This `\\( \frac{1}{2} \\)` will be rendered inline.
- A simple displayed equation: `$$f(x, y) := e^{x^2 - y^2}.$$`
There currently seems to be some weirdness with other environments,
such as the `align` environment. These environments will render provided
@ -78,9 +73,9 @@ support all the features present in the
- **Usage**: Accepts the named parameters `cite` and `footer`.
- **Example**:
```html
{{% blockquote cite="www.shawnohare.com" footer="Shawn" %}}
{{< blockquote cite="www.shawnohare.com" footer="Shawn" >}}
There is nothing more beautiful than an elegant mathematical proof.
{{% /blockquote %}}`
{{< /blockquote >}}
```
- `div`
@ -103,17 +98,20 @@ support all the features present in the
styled epigraph will be used if the `type` parameter is set to `compact`.
- **Example**:
```
{{% epigraph pre="Author Writer, " cite="Math is Fun" %}}
{{< epigraph pre="Author Writer, " cite="Math is Fun" >}}
This is an example of an epigraph with some math
\\( \mathbb N \subseteq \mathbb R \\)
to start the beginning of a section.
{{% /epigraph %}}
{{< /epigraph >}}
```
- `marginnote`
- **Description**: Wrap text to produce a numberless margin note.
- Usage: `{{% marginnote %}}...{{% /marginnote %}}`
- **Example**: `{{% marginnote %}}Some marginnote{{% /marginnote%}}`
- Usage: `{{< marginnote >}}...{{< /marginnote >}}`
- **Example**:
```html
{{< marginnote >}}Some marginnote{{< /marginnote>}}
```
- `section`
- **Description**: This shortcode is provided as a work-around for wrapping
@ -130,11 +128,14 @@ support all the features present in the
- `sidenote`
- **Description**: Wrap text to produce an automatically numbered sidenote.
- **Usage**: identical to `marginnote`
`{{% sidenote %}}...{{% /sidenote %}}`
- **Example**: `{{% sidenote %}}Some sidenote{{% /sidenote %}}`
`{{< sidenote >}}...{{< /sidenote >}}`
- **Example**:
```html
{{< sidenote >}}Some sidenote{{< /sidenote >}}
```
## Templates
TODO
- [ ] Describe the role of each template file, as commenting within the files
themselves seems to break the templates.
#### TODO
- [ ] Describe the role of each template file. Commenting in template files works.
- [ ] Fix the F**ing css

View file

@ -3,7 +3,7 @@ math = false
meta = true
toc = true
author = "AUTHOR NAME"
type = "post"
+++

View file

@ -1,9 +1,7 @@
contentdir = "content"
layoutdir = "layouts"
publishdir = "public"
builddrafts = true
themesDir = "../../"
canonifyurls = true
baseurl = "https://github.com/shawnohare/hugo-tufte"
# baseurl = "https://github.com/shawnohare/hugo-tufte"
theme = "hugo-tufte"
title = "Hugo-tufte Theme Example Site"
@ -14,9 +12,11 @@ title = "Hugo-tufte Theme Example Site"
tag = "tags"
[params]
math = true
subtitle = "Subtitle goes here."
copyrightHolder = "Copyright Holder"
showPoweredBy = true
hidedate = false
# -----------------------------------------------------------------------
# Navigation menu
@ -55,3 +55,9 @@ title = "Hugo-tufte Theme Example Site"
weight = -90
identifier = "twitter"
url = "https://twitter.com"
[markup]
[markup.goldmark]
unsafe = false

View file

@ -6,7 +6,7 @@ math = true
title = "Hugo-Tufte Features"
subtitle = "Fancy Subtitle"
toc = true
categories = ["mathjax", "latex", "tufte-css"]
categories = ["katex", "latex", "tufte-css"]
+++
@ -16,23 +16,24 @@ of this theme. One of them is \\( \LaTeX \\) via MathJax.
{{< section "begin" >}}
## A Bit About Mathematics
{{% epigraph pre="Shawn O'Hare, " cite="Math is Fun" %}}
{{< epigraph pre="Shawn O'Hare, " cite="Math is Fun" >}}
This is an example of an epigraph with some math
\\(\mathbb N \subseteq \mathbb R \\)
to start the beginning of a section.
{{% /epigraph %}}
{{< /epigraph >}}
<!--more-->
### Inline
Some inline math:
{{% marginnote "mn-example" %}}This is a margin note.{{% /marginnote %}}
$e^{i \pi} = -1$ and \\(\sqrt{-1} = i \\)
{{< marginnote "mn-example" >}}This is a margin note.{{< /marginnote >}}
\\(e^{i \pi} = -1\\)
and \\(\sqrt{-1} = i \\)
and \\( a_2 = 3 \\).
### Display
And display math using escaped brackets `\\[`:
{{% sidenote "sn-example" %}}This is a sidenote!{{% /sidenote %}}
{{< sidenote "sn-example" >}}This is a sidenote!{{< /sidenote >}}
\\[
-- \cdot_H -- \colon B(G,H) \times B(H, K) \to B(G, K), \quad ([X], [Y]) \mapsto [X \times_H Y].
\\]
@ -73,7 +74,7 @@ is produced from
Some blockquotes. But first, we try to manually cite via
<cite>This is between cite tags and has math: \\(e^x \\)</cite>
{{% blockquote cite="www.shawnohare.com" footer="Shawn O'Hare" %}}
{{< blockquote cite="www.shawnohare.com" footer="Shawn O'Hare" >}}
This is a blockquote with two paragraphs, that employs the
theme's `blockquote` shortcode. Lorem ipsum dolor sit amet,
consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
@ -82,7 +83,7 @@ Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse
id sem consectetuer libero luctus adipiscing.
Vestibulum enim wisi, viverra nec, fringilla in, laoreet vitae, risus.
{{% /blockquote %}}
{{< /blockquote >}}
### New thoughts

View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
{{- partial "header.html" . -}}
<body >
{{ block "main" . }}{{ end }}
<script>
feather.replace()
</script>
</body>
</html>

View file

@ -0,0 +1,23 @@
<!-- +++
layout: "baseof"
+++ -->
{{ define "main" }}
<div id="layout" class="pure-g">
<article class="pure-u-1">
{{ partial "brand.html" . }}
{{ range first 5 .Site.Pages }}
{{ partial "content.header.html" . }}
<p>{{ .Summary }}</p>
{{ if .Truncated }}
<p><a href="{{ .RelPermalink }}">Read On &rarr;</a></p>
{{ end }}
{{ end }}
{{ partial "footer.html" . }}
</article>
</div>
{{ end }}

View file

@ -1,5 +1,6 @@
{{ partial "header.html" . }}
{{ partial "header.html" . }}
<body>
<div id="layout" class="pure-g">
<article class="pure-u-1">

View file

@ -1,3 +1,11 @@
{{/*
This template render single pages
*/}}
<!DOCTYPE html>
<html lang="{{ .Site.LanguageCode }}">
{{ partial "header.html" . }}
<body>

View file

@ -1,17 +1,25 @@
{{ partial "header.html" . }}
<body>
{{ define "main" }}
<div id="layout" class="pure-g">
<article class="pure-u-1">
{{ partial "brand.html" . }}
{{ range first 5 .Site.Pages }}
{{ partial "content.header.html" . }}
<p>{{ .Summary }}</p>
{{ if .Truncated }}
<p><a href="{{ .RelPermalink }}">Read On &rarr;</a></p>
{{ end }}
{{ end }}
{{ partial "footer.html" . }}
</article>
<article class="pure-u-1">
{{ partial "brand.html" . }}
{{ range where .Site.RegularPages "Type" "post"}}
<h1 class="content-title">
{{ if .IsNode }}
<a href="{{ .Permalink }}">{{ .Title}}</a>
{{ else }}
<a href="{{ .RelPermalink }}">{{ .Title }}{{ if .Draft }} :: Draft {{end}}</a>
{{ end }}
</h1>
<p>{{ truncate 120 .Summary }}</p>
{{/* {{ if .Truncated }} */}}
<p><a href="{{ .RelPermalink }}">Read On &rarr;</a></p>
{{/* {{ end }} */}}
{{ end }}
{{ partial "footer.html" . }}
</article>
</div>
</body>
</html>
{{ end }}

View file

@ -1,39 +1,42 @@
<section>
<h1 class="content-title">
{{ if .IsNode }}
<a href="{{ .Permalink }}">{{ .Title}}</a>
{{ else }}
<a href="{{ .RelPermalink }}">{{ .Title }}{{ if .Draft }} :: Draft {{end}}</a>
<h1 class="content-title">
{{ if .IsNode }}
<a href="{{ .Permalink }}">{{ .Title}}</a>
{{ else }}
<a href="{{ .RelPermalink }}">{{ .Title }}{{ if .Draft }} :: Draft {{end}}</a>
{{ end }}
</h1>
{{ if .IsPage }}
{{ if .Params.subtitle }}
<p class=subtitle>{{ .Params.subtitle }}</p>
{{ end }}
{{ if or (eq .Type "post") (.Params.meta) }}
<span class="content-meta">
{{ if .Params.author }}
<i class="fa fa-user">&nbsp;</i><span class="author">
&nbsp;{{ .Params.author }}</span> <br>
{{ end }}
{{ if not .Params.hidedate }}
<i class="fa fa-calendar"></i>
&nbsp;{{ .Date.Format "Jan 2, 2006" }}
{{end }}
{{ if not .Params.hidereadtime }}
&nbsp;<i class="fa fa-clock-o"></i>
&nbsp;{{ .ReadingTime }} min read
{{ end }}
{{ if .Params.categories }}
<br>
<i class="fa fa-tags"> </i>
{{ range .Params.categories }}
<a href="{{ "/categories/" | absURL }}{{ . | urlize }}">{{ . }}</a>
{{ end }}
{{ end }}
</span>
{{ end }}
{{ end }}
</h1>
{{ if .IsPage }}
{{ if .Params.subtitle }}<p class=subtitle>{{ .Params.subtitle }}</p>{{ end }}
{{ if or (eq .Type "post") (.Params.meta) }}
<span class="content-meta">
{{ if .Params.author }}
<i class="fa fa-user">&nbsp;</i><span class="author">
&nbsp;{{ .Params.author }}</span> <br>
{{ end }}
{{ if not .Params.hidedate }}
<i class="fa fa-calendar"></i>
&nbsp;{{ .Date.Format "Jan 2, 2006" }}
{{end }}
{{ if not .Params.hidereadtime }}
&nbsp;<i class="fa fa-clock-o"></i>
&nbsp;{{ .ReadingTime }} min read
{{ end }}
{{ if .Params.categories }}
<br>
<i class="fa fa-tags"> </i>
{{ range .Params.categories }}
<a href="{{ "/categories/" | absURL }}{{ . | urlize }}">{{ . }}</a>
{{ end }}
{{ end }}
</span>
{{ end }}
{{ end }}
</section>
</section>

View file

@ -1,2 +0,0 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en-us">

View file

@ -1,7 +1,10 @@
{{ partial "doctype.html" . }}
<head>
<title>{{ .Site.Title }} - {{ .Title }}</title>
{{ partial "meta.html" . }}
{{ partial "opengraph.html" }}
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<meta name="description"
content="{{ with .Description }}{{ . }}{{ else }}{{ with .Summary }}{{ . }}{{ else }}{{ .Site.Params.description }}{{end }}{{ end }} ">
<link rel="canonical" href="{{ .Permalink }}" />
{{ partial "header.includes.html" . }}
</head>

View file

@ -1,6 +1,6 @@
<!-- Load MathJax, if necessary. -->
<!-- Load Katex, if necessary. -->
{{ if or .Params.math .IsHome }}
{{ partial "math.html" . }}
{{ partial "math.html" . }}
{{ end }}
<!-- Syntax highlighting -->
@ -23,6 +23,7 @@
<!-- Font Awesome -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<script defer src="{{ "/js/main.js" | absURL }}"></script>
<!-- Main CSS file based on Pure blog layout -->
<link rel="stylesheet" href="{{ "/css/tufte.css" | absURL }}">
<link rel="stylesheet" href="{{ "/css/hugo-tufte.css" | absURL }}">

View file

@ -1,18 +1,4 @@
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax: {
inlineMath: [['$','$'], ['\\(','\\)']],
displayMath: [['$$','$$'], ['\\[','\\]']],
processEscapes: true,
processEnvironments: true,
menuSettings: { zoom: "Double-Click" },
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre'],
TeX: { equationNumbers: { autoNumber: "AMS" },
extensions: ["AMSmath.js", "AMSsymbols.js"] }
}
});
</script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.12.0/dist/contrib/auto-render.min.js" onload="renderMathInElement(document.body);"></script>
<script type="text/javascript"
src="//cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML">
</script>

View file

@ -1,7 +0,0 @@
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<!-- Enable responsiveness on mobile devices-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="{{ .Description }}">
<meta name="keywords" content="{{ range .Keywords }}{{ . }},{{ end }}">
<meta name="author" content="{{ .Site.Title }}">
{{ hugo.Generator }}

View file

@ -1,3 +1,6 @@
{{ $marginnoteDomIdSuffix := .Ordinal }}<label for="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle">&#8853;</label>
<input type="checkbox" id="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle"/>
{{ $marginnoteDomIdSuffix := .Ordinal }}
<label for="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}">
class="margin-toggle">&#8853;
</label>
<input type="checkbox" id="marginnote-{{.Page.File.UniqueID}}-{{ $marginnoteDomIdSuffix }}" class="margin-toggle" />
<span class="marginnote">{{ .Inner }}</span>

14
static/js/main.js Normal file
View file

@ -0,0 +1,14 @@
<script>
renderMathInElement(
document.body,
{
delimiters: [
{left: "$$", right: "$$", display: true},
{left: "\\[", right: "\\]", display: true},
{left: "$", right: "$", display: true},
{left: "\\(", right: "\\)", display: true}
],
displayMode: true
}
);
</script>