Commit 1c876e89 authored by Paulo Pereira's avatar Paulo Pereira 🐧
Browse files

New Simple List theme for Hugo.io

parents
.DS_Store
The MIT License (MIT)
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
# Hugo.io - Simple List Theme
Simple List is forked from the **hugo-classic** theme, written by [goodroot](https://goodroot.ca/). It's alson inspired by the [terminal](https://github.com/panr/hugo-theme-terminal) theme.
[**View live demo in my homepage**](https://paapereira.xyz/)
### Instructions
Based on an [Arch Linux](https://archlinux.org/) based OS.
1: Install Hugo.
```
sudo pacman -S hugo
```
2: Create a new site.
```
hugo new site mySimpleListHomepage
```
3: Change to themes dir.
```
cd mySimpleListHomepage/themes
```
4: Clone the repo
```
git clone https://gitlab.com/paapereira/hugo-theme-simple-list
```
5: Copy files within the `exampleSite/` directory into the `mySimpleListHomepage/` directory. Overwrite the existing `content/`, `static/`, and `config.toml` files.
6: Run `hugo server` within `mySimpleListHomepage/` and enjoy and customize to your hearts content!
### New Posts
To make new posts, simply use the command line:
```
hugo new posts/good-to-great.md
```
#### Screenshot
![Screenshot](/images/screenshot.png)
---
title: ""
slug: ""
author: ""
date:
lastmod:
description: ""
draft: false
toc: false
categories:
-
tags:
-
---
baseurl = "/"
languageCode = "en-us"
title = "mySimpleListHomepage"
theme = "hugo-theme-simple-list"
ignoreFiles = ["\\.Rmd$", "_files$", "_cache$"]
preserveTaxonomyNames = true
[permalinks]
posts = "/posts/:year/:month/:slug/"
archive = "/posts/:year/:month/:slug/"
[taxonomies]
tag = "Tags"
category = "Categories"
[[menu.main]]
identifier = "about"
weight = 1
name = "About"
url = "/pages/about"
[[menu.main]]
identifier = "categories"
weight = 2
name = "Categories"
url = "/categories"
[[menu.main]]
identifier = "tags"
weight = 3
name = "Tags"
url = "/tags"
[[menu.feed]]
name = "rss"
url = "/index.xml"
[params]
# the content that will be listed in the homepage
contentTypeName = "posts"
# the site icon filename located in /static (e.g. "favicon.ico")
favicon = ""
# the site description
description = ""
# comment if you want the default footer
footer = ""
---
title: Home
---
# Hugo Simple List Theme
Simple List is forked from the **hugo-classic** theme, written by [goodroot](https://goodroot.ca/). It's alson inspired by the [terminal](https://github.com/panr/hugo-theme-terminal) theme.
[**View live demo in my homepage**](https://paapereira.xyz/)
---
### Blog posts
---
title: About
author: Open Source
---
Simple List is forked from the **hugo-classic** theme, written by [goodroot](https://goodroot.ca/). It's alson inspired by the [terminal](https://github.com/panr/hugo-theme-terminal) theme.
[**View live demo in my homepage**](https://paapereira.xyz/)
---
title: Juicy Code
author: Open Source
date: '2012-01-23'
categories:
- Code
tags:
- Juicy
slug: juicy-code
---
Check out this JUICY! code:
~~~ruby
def with_value_from_database(value)
self.class.from_database(name, value, type)
end
def with_cast_value(value)
self.class.with_cast_value(name, value, type)
end
def with_type(type)
if changed_in_place?
with_value_from_user(value).with_type(type)
else
self.class.new(name, value_before_type_cast, type, original_attribute)
end
end
~~~
---
title: Hacker with Bullhorn
author: Open-Source
date: '2012-04-23'
categories:
- Bullhorn
- Example
slug: hacker-with-horn
---
Hacker with bullhorn: "Save your money! Accept one of our free tanks! It is invulnerable, and can drive across rocks and swamps at ninety miles an hour while getting a hundred miles to the gallon!"
Prospective station wagon buyer: "I know what you say is true...but...er...I don't know how to maintain a tank!"
Bullhorn: "You don't know how to maintain a station wagon either!"
Buyer: "But this dealership has mechanics on staff. If something goes wrong with my station wagon, I can take a day off work, bring it here, and pay them to work on it while I sit in the waiting room for hours, listening to elevator music."
Bullhorn: "But if you accept one of our free tanks we will send volunteers to your house to fix it for free while you sleep!"
Buyer: "Stay away from my house, you freak!"
Bullhorn: "But..."
Buyer: "Can't you see that everyone is buying station wagons?"
---
title: "Command Line Awesomeness"
author: Open-Source
date: '2012-03-12'
categories:
- Blog
tags:
- HTML
---
This crud is called HTML (HyperText Markup Language) and it is basically a very simple programming language instructing your web browser how to draw a page on a screen. Anyone can learn HTML and many people do. The important thing is that no matter what splendid multimedia web pages they might represent, HTML files are just telegrams.
> When Ronald Reagan was a radio announcer, he used to call baseball games by reading the terse descriptions that trickled in over the telegraph wire and were printed out on a paper tape. He would sit there, all by himself in a padded room with a microphone, and the paper tape would eke out of the machine and crawl over the palm of his hand printed with cryptic abbreviations. If the count went to three and two, Reagan would describe the scene as he saw it in his mind's eye: "The brawny left-hander steps out of the batter's box to wipe the sweat from his brow. The umpire steps forward to sweep the dirt from home plate." and so on. When the cryptogram on the paper tape announced a base hit, he would whack the edge of the table with a pencil, creating a little sound effect, and describe the arc of the ball as if he could actually see it. His listeners, many of whom presumably thought that Reagan was actually at the ballpark watching the game, would reconstruct the scene in their minds according to his descriptions.
This is exactly how the World Wide Web works: the HTML files are the pithy description on the paper tape, and your Web browser is Ronald Reagan. The same is true of Graphical User Interfaces in general.
---
title: Markdown Guide (modified)
author: Open Source
date: '2018-08-30'
categories:
- Example
tags:
- Markdown
---
An h1 header
============
Paragraphs are separated by a blank line.
2nd paragraph. *Italic*, **bold**, and `monospace`. Itemized lists
look like:
* this one
* that one
* the other one
Note that --- not considering the asterisk --- the actual text
content starts at 4-columns in.
> Block quotes are
> written like so.
>
> They can span multiple paragraphs,
> if you like.
Use 3 dashes for an em-dash. Use 2 dashes for ranges (ex., "it's all
in chapters 12--14"). Three dots ... will be converted to an ellipsis.
Unicode is supported. ☺
An h2 header
------------
Here's a numbered list:
1. first item
2. second item
3. third item
Note again how the actual text starts at 4 columns in (4 characters
from the left side). Here's a code sample:
# Let me re-iterate ...
for i in 1 .. 10 { do-something(i) }
As you probably guessed, indented 4 spaces. By the way, instead of
indenting the block, you can use delimited blocks, if you like:
~~~
define foobar() {
print "Welcome to flavor country!";
}
~~~
(which makes copying & pasting easier). You can optionally mark the
delimited block for Pandoc to syntax highlight it:
~~~python
import time
# Quick, count to ten!
for i in range(10):
# (but not *too* quick)
time.sleep(0.5)
print i
~~~
### An h3 header ###
Now a nested list:
1. First, get these ingredients:
* carrots
* celery
* lentils
2. Boil some water.
3. Dump everything in the pot and follow
this algorithm:
find wooden spoon
uncover pot
stir
cover pot
balance wooden spoon precariously on pot handle
wait 10 minutes
goto first step (or shut off burner when done)
Do not bump wooden spoon or it will fall.
Notice again how text always lines up on 4-space indents (including
that last line which continues item 3 above).
Here's a link to [a website](http://foo.bar), to a [local
doc](local-doc.html), and to a [section heading in the current
doc](#an-h2-header). Here's a footnote [^1].
[^1]: Footnote text goes here.
Tables can look like this:
size|material |color
----|------------|------------
9 |leather |brown
10 |hemp canvas |natural
11 |glass |transparent
Table: Shoes, their sizes, and what they're made of
(The above is the caption for the table.)
A horizontal rule follows.
***
Here's a definition list:
apples
: Good for making applesauce.
oranges
: Citrus!
tomatoes
: There's no "e" in tomatoe.
(Put a blank line between each term/definition pair to spread
things out more.)
and images can be specified like so:
![example image](/images/partywizard.gif "An exemplary image")
Inline math equations go in like so: \\(\omega = d\phi / dt\\).
Display math should get its own line and be put in in
double-dollarsigns:
$$I = \int \rho R^{2} dV$$
And note that you can backslash-escape any punctuation characters
which you wish to be displayed literally, ex.: \`foo\`, \*bar\*, etc.
#### Images auto center:
![Party](http://emojis.slackmojis.com/emojis/images/1475875185/1223/party-dinosaur.gif?1475875185)
{{ partial "header.html" . }}
404 - You once were found. But now you're lost.
{{ partial "footer.html" . }}
{{ partial "header.html" . }}
<div class="content-wrapper">
{{if not .IsHome }}
<h1>{{ .Title | markdownify }}</h1>
{{ end }}
{{ .Content }}
<ul>
{{ if .IsHome }}
{{ range (where .Site.RegularPages "Section" "=" .Site.Params.contentTypeName) }}
<li>
<span class="date">{{ .Date.Format "2006/01/02" }}</span>
<a href="{{ .RelPermalink }}">{{ .Title | markdownify }}</a>
</li>
{{ end }}
{{ else }}
{{ range (where .Pages "Section" "!=" "") }}
<li>
<span class="date">{{ .Date.Format "2006/01/02" }}</span>
<a href="{{ .RelPermalink }}">{{ .Title | markdownify }}</a>
</li>
{{ end }}
{{ end }}
</ul>
</div>
{{ partial "footer.html" . }}
{{- $pctx := . -}}
{{- if .IsHome -}}{{ $pctx = .Site }}{{- end -}}
{{- $pages := slice -}}
{{- if or $.IsHome $.IsSection -}}
{{- $pages = $pctx.RegularPages -}}
{{- else -}}
{{- $pages = $pctx.Pages -}}
{{- end -}}
{{- $limit := .Site.Config.Services.RSS.Limit -}}
{{- if ge $limit 1 -}}
{{- $pages = $pages | first $limit -}}
{{- end -}}
{{- printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
<channel>
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
<link>{{ .Permalink }}</link>
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
{{- with .OutputFormats.Get "RSS" -}}
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
{{- end -}}
{{ range $pages }}
<item>
<title>{{ .Title }}</title>
<link>{{ .Permalink }}</link>
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
<guid>{{ .Permalink }}</guid>
<description>{{ .Description | safeHTML }}</description>
</item>
{{ end }}
</channel>
</rss>
{{ partial "header.html" . }}
<div class="post-meta">
<h1><span class="title">{{ .Title | markdownify }}</span></h1>
<p class="categories">
{{ with ($.Param "categories") }}
{{ range $c := . }}<a href="{{ relURL (print "/categories/" $c | urlize) }}">~/categories/{{$c}}</a> {{ end }} ❯
{{ end }}
{{ if .Params.date }} {{ .Date.Format "2006/01/02" }}{{ end }} by {{ with .Params.author }} {{ . }} {{ end }}
</p>
<p class="tags">
{{ with ($.Param "tags") }}
{{ range $t := . }}<a href="{{ relURL (print "/tags/" $t | urlize) }}">#{{$t}} </a> {{ end }}
{{ end }}
</p>
</div>
{{ if .Params.toc }}
<p>{{ .TableOfContents }}</p>
{{ end }}
{{ if .Params.Cover }}
<img src="{{ .Params.Cover | absURL }}" class="cover" alt="{{ .Title | plainify | default " " }}" />
{{ end }}
<div class="content-wrapper">
<main>
{{ .Content }}
{{ if or .NextInSection .PrevInSection }}
<div class="pagination">
<div class="pagination__title">
<span class="pagination__title-h">Read other posts</span>
<hr />
</div>
<div class="pagination__buttons">
{{ if .NextInSection }}
<span class="button previous">
<a href="{{ .NextInSection.Permalink }}">
<span class="button__icon"></span>
<span class="button__text">{{ .NextInSection.Title }}</span>
</a>
</span>
{{ end }}
{{ if .PrevInSection }}
<span class="button next">
<a href="{{ .PrevInSection.Permalink }}">
<span class="button__text">{{ .PrevInSection.Title }}</span>
<span class="button__icon"></span>
</a>
</span>
{{ end }}
</div>
</div>
{{ end }}
</main>
</div>
{{ partial "footer.html" . }}
{{ partial "header.html" . }}
<h1>{{ .Title }}</h1>
<ul class="terms">
{{ range .Data.Terms }}
<li>
<a href="{{ .Page.Permalink }}">{{ .Page.Title }}</a> ({{ .Count }})
</li>
{{ end }}
</ul>
{{ partial "footer.html" . }}
<!-- Automagically centers images. Original Author Yihui Xie: https://yihui.name -->
<script>
(function() {
function center_el(tagName) {
var tags = document.getElementsByTagName(tagName), i, tag;
for (i = 0; i < tags.length; i++) {
tag = tags[i];
var parent = tag.parentElement;
// center an image if it is the only element of its parent
if (parent.childNodes.length === 1) {
// if there is a link on image, check grandparent
if (parent.nodeName === 'A') {
parent = parent.parentElement;
if (parent.childNodes.length != 1) continue;
}
if (parent.nodeName === 'P') parent.style.textAlign = 'center';
}
}
}
var tagNames = ['img', 'embed', 'object'];
for (var i = 0; i < tagNames.length; i++) {
center_el(tagNames[i]);
}
})();
</script>
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment