fbievan
/
hugo-theme-readable
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

old work pushed

This commit is contained in:
cjtheham 2023-01-30 13:14:33 -06:00
parent dad292e2fd
commit e27fbc792d
15 changed files with 379 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
LICENSE
View File

@ -21,4 +21,4 @@ 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.
For more information, please refer to <https://unlicense.org>
For more information, please refer to <https://unlicense.org>

2
README.md
View File

@ -1,2 +1,4 @@
# hugo-theme-readable
Hugo theme built using readable.css from Freedom to Write
https://codeberg.org/Freedom-to-Write/readable.css

2
archetypes/default.md Normal file
View File

@ -0,0 +1,2 @@
+++
+++

0
layouts/404.html Normal file
View File

26
layouts/_default/baseof.html Normal file
View File

@ -0,0 +1,26 @@
<!DOCTYPE html>
<html>
{{- partial "head.html" . -}}
<body>
<header>
{{- partial "header.html" . -}}
</header>
<nav>
{{ range .Site.Menus.main -}}
<span>
<a href="{{ .URL | absLangURL }}">{{ .Name }}</a>
</span>
{{- end }}
</nav>
<main>
{{- block "main" . }}{{- end }}
</main>
<footer>
{{- partial "footer.html" . -}}
</footer>
</body>
</html>

9
layouts/_default/list.html Normal file
View File

@ -0,0 +1,9 @@
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ range .Pages.ByPublishDate.Reverse }}
<p>
<h3><a class="title" href="{{ .RelPermalink }}">{{ .Title }}</a></h3>
{{ partial "metadata.html" . }}
</p>
{{ end }}
{{ end }}

6
layouts/_default/single.html Normal file
View File

@ -0,0 +1,6 @@
{{ define "main" }}
<h1>{{ .Title }}</h1>
{{ partial "metadata.html" . }}
<!-- <br><br> -->
{{ .Content }}
{{ end }}

5
layouts/index.html Normal file
View File

@ -0,0 +1,5 @@
{{ define "main" }}
{{ partial "metadata.html" . }}
<!-- <br><br> -->
{{ .Content }}
{{ end }}

3
layouts/partials/footer.html Normal file
View File

@ -0,0 +1,3 @@
<p><a href="/policies/privacy/">Privacy Policy</a> | <a href="/policies/cookies/">Cookie Policy</a> | <a href="/policies/terms/">Terms of Use</a></p> <!-- We like putting links in a paragraph separated by pipe ("|") characters -->
<p>© 2023 {{ $.Site.Params.author }}</p> <!-- While not legally required, it's nice to put copyright and/or license info here. Also, it looks nice to break up the links with a line of text -->
<a href={{ $.Site.Params.Mastodon }} rel="me" target="blank">Mastodon</a> | <a href="/contact/">Contact Me</a></p> <!-- This is the kind of thing people look for in footers: contact info and legal info. Make sure you include both! -->

8
layouts/partials/head.html Normal file
View File

@ -0,0 +1,8 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- This ensures your site looks right on mobile devices -->
<link rel="stylesheet" type="text/css" href="/css/readable.css?v=1.0.0">
{{ $title := print .Site.Title " | " .Title }}
{{ if .IsHome }}{{ $title = .Site.Title }}{{ end }}
<title>{{ $title }}</title>
</head>

2
layouts/partials/header.html Normal file
View File

@ -0,0 +1,2 @@
<h1>{{ $.Site.Title }}</h1>
<p>{{ $.Site.Params.subtitle }}</p>

13
layouts/partials/metadata.html Normal file
View File

@ -0,0 +1,13 @@
{{ $dateTime := .PublishDate.Format "2006-01-02" }}
{{ $dateFormat := .Site.Params.dateFormat | default "Jan 2, 2006" }}
<i data-feather="calendar"></i>
{{ if .PublishDate }}
<time datetime="{{ $dateTime }}">{{ .PublishDate.Format $dateFormat }}</time>
{{ end }}
{{ with .Params.tags }}
<i data-feather="tag"></i>
{{ range . }}
{{ $href := print (absURL "tags/") (urlize .) }}
<a class="btn btn-sm btn-outline-dark tag-btn" href="{{ $href }}">{{ . }}</a>
{{ end }}
{{ end }}

245
static/css/readable.css Normal file
View File

@ -0,0 +1,245 @@
/* readable.css 1.0.0 */
/* Code from Benjamin Hollon (benjaminhollon@fosstodon.org) */
#typewriter::after {
content: '_';
width: 0;
display: inline-block;
animation: cursor-blink 1s infinite;
}
/* Font family support */
html, html[data-font-family="serif"] {
--font-family: serif;
}
html[data-font-family="sans-serif"] {
--font-family: sans-serif;
}
html[data-font-family="monospace"] {
--font-family: monospace;
}
/* Color scheme support */
html, html[data-theme="light"] {
--background-color: snow;
--color: #000;
}
html[data-theme="dark"] {
--background-color: #222830;
--color: #fff;
}
@media (prefers-color-scheme: dark) {
html {
--background-color: #222830;
--color: #fff;
}
}
/* Generic styles */
:root {
--column-width: 67ch;
--form-width: 50ch;
--line-width: 0.125rem;
--line-height: 1.5;
--one-line: calc(var(--line-height) * 1rem);
--half-line: calc(var(--one-line) * 0.5);
font-family: var(--font-family);
background-color: var(--background-color);
color: var(--color);
}
a {
color: inherit;
}
a:active {
color: red;
}
header, footer, h1, h2 {
text-align: center;
}
footer:not(.exclude) {
border-top: var(--line-width) solid;
}
summary {
cursor: pointer;
}
blockquote:not(.exclude) {
padding-left: var(--one-line);
border-left: var(--line-width) solid;
}
ul, ol {
padding-left: calc(var(--line-height) * 2rem);
}
:is(body, article, main, figure) > img:not(.exclude) {
max-width: 100%;
}
figure:not(.exclude) {
text-align: center;
}
figure:not(.exclude) > * ~ figcaption {
margin-top: 0;
font-style: italic;
}
article > aside:not(.exclude) {
border: var(--line-width) solid;
padding: 0 var(--one-line);
border-radius: var(--half-line);
}
pre {
max-width: 100%;
overflow: auto;
}
hr {
color: inherit;
border: 0;
border-top: var(--line-width) solid;
}
/* Vertical Rhythm */
p, ul, ol, figcaption, nav, td, th, label {
line-height: var(--line-height);
}
h1, h2, h3, h4, h5, h6, p, blockquote, hr, footer, header, nav, figure, figcaption, ul, ol, :is(body, article, main) > img:not(.exclude), table, article > aside, article > aside {
margin: var(--one-line) 0;
}
/* Headings */
header h1 {
font-weight: normal;
}
h1, h2 {
line-height: calc(var(--line-height) * 2rem);
}
h1 {
font-size: 2.5rem;
}
h2 {
font-size: 1.75rem;
}
h3, h4, h5, h6 {
line-height: var(--one-line);
padding-top: calc(var(--line-height) * 0.75rem);
margin-bottom: calc(var(--line-height) * 0.25rem);
}
:is(h3, h4, h5, h6) ~ * {
margin-top: 0;
}
/* Navbar */
body > nav:first-of-type:not(.exclude) { /* This styling only affects the first nav element that is the direct child of the body */
text-align: center;
border-width: var(--line-width) 0;
border-style: solid;
line-height: var(--line-height);
padding: calc((var(--line-height) * 0.5rem) - var(--line-width)); /* Put half a line's height on both top and bottom, then remove the width of the border */
display: flex;
flex-flow: row wrap;
}
body > nav:first-of-type:not(.exclude) > * {
flex-grow: 1;
margin: 0 var(--half-line);
text-transform: uppercase;
}
@media (prefers-reduced-motion: no-preference) {
body > nav:first-of-type:not(.exclude) a {
text-decoration: none;
display: inline-block;
}
body > nav:first-of-type:not(.exclude) a::after {
content: '';
width: 0;
height: var(--line-width);
display: block;
background: var(--color);
transition: 150ms;
}
body > nav:first-of-type:not(.exclude) a:is(:hover, :focus)::after {
width: 100%;
}
}
/* Column */
body {
margin: 0 auto;
width: min(95%, var(--column-width));
}
/* Justification (default off; use data-justify="on" on <html> to enable) */
/* 67ch (var(--column-width) / 95% (column max-width) === 70.526315789ch */
@media (min-width: 70.5ch) {
[data-justify="on"] body {
text-align: justify;
text-justify: inter-character;
}
}
/* Tables */
table:not(.exclude) {
display: block;
width: 100%;
overflow: auto;
border-collapse: collapse;
}
table:not(.exclude) :is(td, th) {
padding: calc(var(--line-height) * 0.25rem);
border: var(--line-width) solid;
}
table:not(.exclude) td {
word-wrap: break-word;
}
/* Forms */
form {
max-width: var(--form-width)
}
form:not(.exclude) :is(label:not(input:is([type="checkbox"], [type="radio"]) ~ label), input:not([type="checkbox"], [type="radio"]), textarea, select) {
display: block;
margin: var(--half-line) 0;
}
form:not(.exclude) :is(input:not([type="checkbox"], [type="radio"]), textarea, select) {
box-sizing: border-box;
padding: var(--half-line);
background: transparent;
border: var(--line-width) solid;
color: inherit;
font: inherit;
width: 100%;
}
form:not(.exclude) label:not(input:is([type="checkbox"], [type="radio"]) ~ label) {
font-weight: bold;
}

42
static/js/typewriter.js Normal file
View File

@ -0,0 +1,42 @@
// Code from Benjamin Hollon (benjaminhollon@fosstodon.org)
const addCharDelay = 75;
const removeCharDelay = 45;
const wordDelay = 1500;
const typewriterElement = document.getElementById('typewriter');
const typewriterPrompts = [
'Amateur Radio Operator',
'Electrical Engineering Student',
'Film Enjoyer'
];
let currentTypewriterIndex = 0;
function typeNextPrompt() {
function typeChar(char) {
if (char !== '~') typewriterElement.innerText += char;
}
function removeChar() {
typewriterElement.innerText = typewriterElement.innerText.slice(0, -1);
}
const word = typewriterPrompts[currentTypewriterIndex];
let delaySoFar = 0;
// Type it
for (const char of word) {
setTimeout(typeChar.bind(this, char), delaySoFar);
delaySoFar += addCharDelay;
}
delaySoFar += wordDelay;
for (const char of word.split('').reverse()) {
setTimeout(removeChar, delaySoFar);
delaySoFar += removeCharDelay;
}
currentTypewriterIndex = (currentTypewriterIndex + 1) % typewriterPrompts.length;
setTimeout(typeNextPrompt, delaySoFar);
}
setTimeout(typeNextPrompt, wordDelay / 2);

15
theme.toml Normal file
View File

@ -0,0 +1,15 @@
# theme.toml template for a Hugo theme
# See https://github.com/gohugoio/hugoThemes#themetoml for an example
name = "Readable"
license = "Unlicense"
licenselink = "https://github.com/cjtheham/hugo-theme-readable/blob/main/LICENSE"
description = "A theme using Freedom to Write's Readable.css"
homepage = "https://github.com/cjtheham/hugo-theme-readable"
tags = []
features = []
min_version = "0.41.0"
[author]
name = "RogueFoam"
homepage = ""