Update example site and include images.

This commit is contained in:
Shawn O'Hare 2016-02-20 13:09:11 -08:00
parent c059472c86
commit 9dc4d989bf
12 changed files with 353 additions and 2 deletions

View file

@ -9,7 +9,34 @@ By utilizing copious partial templates the theme is largely customizable.
## Math
TODO explain the different ways to write LaTeX.
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:
- `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}.\\]`
There currently seems to be some weirdness with other environments,
such as the `align` environment. These environments will render provided
they are wrapped in `<p>` tags and blank lines. The snippet below should
render correctly.
```
Let $G$ be a finite group with exponent $2$. Then every element is
an involution, hence for any $x$, $y$ in $G$ we have:
<p>
\begin{align*}
e &= (xy)^2 \\
&=xyxy \implies \\
y^{-1} &= xyx \implies \\
y^{-1}x^{-1} &= xy,
\end{align*}
</p>
establishing that $G$ is abelian.
```
## Site Parameters

57
exampleSite/config.toml Normal file
View file

@ -0,0 +1,57 @@
contentdir = "content"
layoutdir = "layouts"
publishdir = "public"
builddrafts = true
canonifyurls = true
baseurl = "www.hugo-tufte.com"
theme = "hugo-tufte"
title = "Hugo-tufte Theme Example Site"
[taxonomies]
category = "categories"
group = "groups"
series = "series"
tag = "tags"
[params]
subtitle = "Subtitle goes here."
copyrightHolder = "Copyright Holder"
showPoweredBy = true
# -----------------------------------------------------------------------
# Morphism theme navigation menu
# -----------------------------------------------------------------------
[[menu.nav]]
name = "Home"
pre = "<i class='fa fa-home fa-lg'></i> "
weight = -110
identifier = "home"
url = "/"
[[menu.nav]]
name = "Posts"
pre = "<i class='fa fa-book fa-lg'></i> "
weight = -100
identifier = "posts"
url = "/post"
[[menu.nav]]
name = "Categories"
pre = "<i class='fa fa-tags fa-lg'></i> "
weight = -90
identifier = "categories"
url = "/categories"
# -----------------------------------------------------------------------
# Morphism theme footer menu
# -----------------------------------------------------------------------
[[menu.footer]]
name = ""
pre = "<i class='fa fa-github fa-2x'></i> "
weight = -100
identifier = "github"
url = "https://github.com/shawnohare/hugo-tufte"
[[menu.footer]]
name = ""
pre = "<i class='fa fa-twitter fa-2x'></i> "
weight = -90
identifier = "twitter"
url = "https://twitter.com"

View file

@ -0,0 +1,6 @@
+++
title = "About This Site"
hasMath = false
+++
Hello, I'm an example site that uses the Hugo Morphism theme.

View file

@ -0,0 +1,37 @@
+++
author = "Hiro Protagonist"
date = "2015-01-19T23:57:58-08:00"
hasMath = false
title = "Blockquotes"
+++
Below is a blockquote.
> This is a blockquote with two paragraphs. Lorem ipsum dolor sit amet,
> consectetuer adipiscing elit. Aliquam hendrerit mi posuere lectus.
> 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.
<!--more-->
Now we have nested blockquotes.
> This is the first level of quoting.
>
> > This is nested blockquote.
>
> Back to the first level.
And finally a blockquote with some markdown.
> ## This is a header.
>
> 1. This is the first list item.
> 2. This is the second list item.
>
> Here's some example code:
>
> return shell_exec("echo $input | $markdown_script");

View file

@ -0,0 +1,21 @@
---
title: "Just another sample post"
date: "2014-03-29"
description: "This should be a more useful description"
categories:
- "hugo"
- "fun"
- "test"
---
## First Heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus, consequatur aspernatur omnis iste. Voluptates, id inventore ea natus ab sed amet ipsa ratione sunt dignissimos. Soluta illum aliquid repellendus recusandae.
### Sub
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Optio, perferendis saepe voluptatem a nesciunt architecto voluptas deleniti dolor tempora quasi quidem odit rem fugit magnam minima quam dolores vel id?
## Conclusion
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Corporis, numquam ipsa ad! Quasi, deleniti quae sint consequatur error corporis dicta inventore alias soluta dignissimos? Molestias, quia ab deserunt repellat ut.

View file

@ -0,0 +1,11 @@
+++
title = "Hide Date"
date = "2015-05-15"
hideDate = true
hideReadTime = true
+++
Here is an example post where the date set, but hidden from display.
Moreover, the reading time is also hidden.

View file

@ -0,0 +1,26 @@
---
title: "First Post"
description: "Welcome to the first blog post."
date: "2014-03-28"
categories:
- "template"
- "boring"
---
## Sample Post 1
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
### Sub-heading
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Est, non, ratione, molestiae illo optio quia sequi id fuga natus nihil ad architecto dolor alias ex sunt iste aperiam eius itaque.
## foo
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo, neque, eveniet voluptate eos debitis illum qui nostrum eius maxime ratione assumenda suscipit impedit deserunt voluptatibus odio ducimus non. Ex, ratione.

View file

@ -0,0 +1,164 @@
+++
author = "AUTHOR NAME"
date = "2016-02-20T13:56:01-08:00"
meta = true
math = true
title = "Hugo-Tufte Features"
subtitle = "Fancy Subtitle"
toc = true
categories = ["mathjax", "latex", "tufte-css"]
+++
This is a quick demonstration post. It serves as an example of the features
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" %}}
This is an example of an epigraph with some math
\\(\mathbb N \subseteq \mathbb R \\)
to start the beginning of a section.
{{% /epigraph %}}
<!--more-->
### Inline
Some inline math:
{{% 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 %}}
\\[
-- \cdot_H -- \colon B(G,H) \times B(H, K) \to B(G, K), \quad ([X], [Y]) \mapsto [X \times_H Y].
\\]
### Environments
Currently, certain $\LaTeX$ environments need to be escaped so that
the markdown processor does not override MathJax. Currently, display
environments should be enclosed in `<p>` tags and blank lines.
For instance:
<p>
\begin{align*}
\mu(A) &= \iint_{I^2} \chi_A (x,y) \ d(x,y)
= \int_I \left( \int_I \chi_A (x,y) \ dx\right) dy
= \int_I 0 \ dy= 0 \quad \text{and} \\
\mu(A) &=\iint_{I^2} \chi_A (x,y) \ d(x,y)
= \int_I \left( \int_I \chi_A (x,y) \ dy \right) dx
=\int_I dx = 1,
\end{align*}
</p>
is produced from
```
<p>
\begin{align*}
\mu(A) &= \iint_{I^2} \chi_A (x,y) \ d(x,y)
= \int_I \left( \int_I \chi_A (x,y) \ dx\right) dy
= \int_I 0 \ dy= 0 \quad \text{and} \\
\mu(A) &=\iint_{I^2} \chi_A (x,y) \ d(x,y)
= \int_I \left( \int_I \chi_A (x,y) \ dy \right) dx
=\int_I dx = 1,
\end{align*}
</p>
```
### Blockquotes
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" %}}
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.
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 %}}
### New thoughts
<span class="newthought">Sometimes a new thought</span> distinguishes a section,
as here. There are currently two ways to create one. One way is with raw
HTML such as: `<span class="newthought">...</span>"`. The theme also provides
the `newthought` shortcode.
### Code
As an example of some inline code: `go test -v -short`.
And this is some block-code:
```go
package main
import "log"
func add(x int, y int) int {
log.Println("We are going to take the sum of two numbers, and leave a long comment.")
return x + y
}
func main() {
y := add(1, 2)
log.Println(y)
}
```
### Figure
Below we have an example of a regular width figure.
{{< figure
src="https://raw.githubusercontent.com/edwardtufte/tufte-css/master/img/exports-imports.png"
class="class param"
title="The image title."
caption="This is the image caption."
label="mn-export-import"
attr="Image attribution"
attrlink="attribute link"
alt="alt"
link="link"
>}}
{{< section "end" >}}
And now we exhibit a margin figure.
{{< figure
src="https://edwardtufte.github.io/tufte-css/img/rhino.png"
class="class param"
type="margin"
label="mn-rhino"
title="The image title."
label="mn-export-import"
caption="This is the image caption."
attr="Image attribution"
attrlink="attribute link"
alt="alt"
link="link"
>}}
{{< section "end" >}}
Below is a full-width figure.
{{< figure
src="https://edwardtufte.github.io/tufte-css/img/napoleons-march.png"
type="full"
label="mn-napoleonic-wars"
title="Napoleonic wars"
caption="This the image caption."
attr="Image attribution"
attrlink="attribute link"
alt="Napoleonic wars"
link="link"
>}}
{{< section "end" >}}
{{< div class="myclass" >}}
## A Story About Cats
Climb a tree, wait for a fireman jump to fireman then scratch his face sleep on dog bed, force dog to sleep on floor cat snacks, and eat prawns daintily with a claw then lick paws clean wash down prawns with a lap of carnation milk then retire to the warmest spot on the couch to claw at the fabric before taking a catnap climb a tree, wait for a fireman jump to fireman then scratch his face put toy mouse in food bowl run out of litter box at full speed . See owner, run in terror chase mice, so thinking longingly about tuna brine for eat a plant, kill a hand for wake up human for food at 4am. Human is washing you why halp oh the horror flee scratch hiss bite scratch the furniture and rub face on owner. Loves cheeseburgers see owner, run in terror chew on cable. Thug cat ignore the squirrels, you'll never catch them anyway. Eat a plant, kill a hand find empty spot in cupboard and sleep all day so hide head under blanket so no one can see yet love to play with owner's hair tie rub face on everything i like big cats and i can not lie. Wake up human for food at 4am stare at the wall, play with food and get confused by dust yet then cats take over the world scamper. Inspect anything brought into the house get video posted to internet for chasing red dot. Brown cats with pink ears chew foot spit up on light gray carpet instead of adjacent linoleum. I am the best wake up human for food at 4am, meow spread kitty litter all over house, for meow. Knock dish off table head butt cant eat out of my own dish jump off balcony, onto stranger's head, chase ball of string scream at teh bath but climb leg, so unwrap toilet paper but destroy couch. Climb a tree, wait for a fireman jump to fireman then scratch his face. Leave hair everywhere swat turds around the house eat grass, throw it back up, and eat grass, throw it back up. Chase after silly colored fish toys around the house.
{{< div "end" >}}
### We really like cats.
Yes, they are fluffy and happy.

View file

@ -0,0 +1,2 @@
This file is the last hugo-tufte related css file
loaded by the theme, and so personal customization can go here.

BIN
images/screenshot.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 275 KiB

BIN
images/tn.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

View file

@ -4,7 +4,7 @@ licenselink = "https://github.com/shawnohare/hugo-tufte/blob/master/LICENSE.md"
description = "A minimalist blog theme using Tufte-css."
homepage = "http://github.com/shawnohare/hugo-tufte"
tags = ["blog", "tufte", "minimal"]
features = ["math", "tufte-css"]
features = ["math", "tufte-css", "tufte"']
min_version = 0.15
[author]