misc: Initial commit!
commit
8f3a1a355a
|
|
@ -0,0 +1,452 @@
|
|||
/* Adapted from Simple CSS (MIT License): https://simplecss.org/ */
|
||||
/* Set the global variables for everything. Change these to use your own fonts/colours. */
|
||||
:root {
|
||||
|
||||
/* Set sans-serif & mono fonts */
|
||||
--sans-font: -apple-system, BlinkMacSystemFont, "Avenir Next", Avenir, "Nimbus Sans L", Roboto, Noto, "Segoe UI", Arial, Helvetica, "Helvetica Neue", sans-serif;
|
||||
--mono-font: Consolas, Menlo, Monaco, "Andale Mono", "Ubuntu Mono", monospace;
|
||||
|
||||
/* Body font size. By default, effectively 18.4px, based on 16px as 'root em' */
|
||||
--base-fontsize: 1.15rem;
|
||||
|
||||
/* Major third scale progression - see https://type-scale.com/ */
|
||||
--header-scale: 1.25;
|
||||
|
||||
/* Line height is set to the "Golden ratio" for optimal legibility */
|
||||
--line-height: 1.618;
|
||||
|
||||
/* Default theme is dark, based on Dracula colors */
|
||||
--bg: #282a36;
|
||||
--accent-bg: #282a36;
|
||||
--text: #f8f8f2;
|
||||
--text-light: #6272a4;
|
||||
--border: #44475a;
|
||||
--accent: #bd93f9;
|
||||
--accent-light: #bd93f9;
|
||||
--code: #ff79c6;
|
||||
--preformatted: #CCC;
|
||||
--marked: #f1fa8c;
|
||||
}
|
||||
|
||||
/* Dark theme */
|
||||
img, video {
|
||||
opacity: .6;
|
||||
}
|
||||
|
||||
* {
|
||||
/* Set the font globally */
|
||||
font-family: var(--sans-font);
|
||||
}
|
||||
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* Make the body a nice central block */
|
||||
body {
|
||||
color: var(--text);
|
||||
background: var(--bg);
|
||||
font-size: var(--base-fontsize);
|
||||
line-height: var(--line-height);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Make the main element a nice central block */
|
||||
main {
|
||||
margin: 1rem auto 0;
|
||||
max-width: 45rem;
|
||||
padding: 0 .5rem;
|
||||
}
|
||||
|
||||
/* Make the header bg full width, but the content inline with body */
|
||||
header {
|
||||
background: var(--accent-bg);
|
||||
border-bottom: 1px solid var(--border);
|
||||
padding: 1.5rem 15rem;
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
/* Reduces header padding on smaller screens */
|
||||
@media only screen and (max-width: 1200px) {
|
||||
header {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
nav {
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
/* Remove margins for header text */
|
||||
header h1,
|
||||
header p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Fix header line height when title wraps */
|
||||
header h2 {
|
||||
text-align: center;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
/* Format navigation */
|
||||
nav {
|
||||
font-size: 1rem;
|
||||
line-height: 2;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
nav a {
|
||||
margin: 1rem 1rem 0 0;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 5px;
|
||||
color: var(--text) !important;
|
||||
display: inline-block;
|
||||
padding: .1rem 1rem;
|
||||
text-decoration: none;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
nav a:hover {
|
||||
color: var(--accent) !important;
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
nav a.current:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 4rem;
|
||||
padding: 2rem 1rem 1.5rem 1rem;
|
||||
color: var(--text-light);
|
||||
font-size: .9rem;
|
||||
text-align: center;
|
||||
border-top: 1px solid var(--border);
|
||||
}
|
||||
|
||||
/* Format headers */
|
||||
h1 {
|
||||
font-size: calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale) * var(--header-scale) * var(--header-scale));
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale) * var(--header-scale));
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: calc(var(--base-fontsize) * var(--header-scale) * var(--header-scale));
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: calc(var(--base-fontsize) * var(--header-scale));
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: var(--base-fontsize);
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: calc(var(--base-fontsize) / var(--header-scale));
|
||||
margin-top: calc(var(--line-height) * 1.5rem);
|
||||
}
|
||||
|
||||
/* Format links & buttons */
|
||||
a,
|
||||
a:visited {
|
||||
color: var(--accent);
|
||||
}
|
||||
|
||||
a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a button,
|
||||
button,
|
||||
input[type="submit"],
|
||||
input[type="reset"],
|
||||
input[type="button"] {
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background: var(--accent);
|
||||
font-size: 1rem;
|
||||
color: var(--bg);
|
||||
padding: .7rem .9rem;
|
||||
margin: .5rem 0;
|
||||
transition: .4s;
|
||||
}
|
||||
|
||||
a button[disabled],
|
||||
button[disabled],
|
||||
input[type="submit"][disabled],
|
||||
input[type="reset"][disabled],
|
||||
input[type="button"][disabled] {
|
||||
cursor: default;
|
||||
opacity: .5;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
/* Set the cursor to '?' while hovering over an abbreviation */
|
||||
abbr {
|
||||
cursor: help;
|
||||
}
|
||||
|
||||
button:focus,
|
||||
button:enabled:hover,
|
||||
input[type="submit"]:focus,
|
||||
input[type="submit"]:enabled:hover,
|
||||
input[type="reset"]:focus,
|
||||
input[type="reset"]:enabled:hover,
|
||||
input[type="button"]:focus,
|
||||
input[type="button"]:enabled:hover {
|
||||
opacity: .8;
|
||||
}
|
||||
|
||||
/* Format the expanding box */
|
||||
details {
|
||||
padding: .6rem 1rem;
|
||||
background: var(--accent-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 5px;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
summary {
|
||||
cursor: pointer;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
details[open] {
|
||||
padding-bottom: .75rem;
|
||||
}
|
||||
|
||||
details[open] summary {
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
details[open]>*:last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Format tables */
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
width: 100%
|
||||
}
|
||||
|
||||
td,
|
||||
th {
|
||||
border: 1px solid var(--border);
|
||||
text-align: left;
|
||||
padding: .5rem;
|
||||
}
|
||||
|
||||
th {
|
||||
background: var(--accent-bg);
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
tr:nth-child(even) {
|
||||
/* Set every other cell slightly darker. Improves readability. */
|
||||
background: var(--accent-bg);
|
||||
}
|
||||
|
||||
table caption {
|
||||
font-weight: bold;
|
||||
margin-bottom: .5rem;
|
||||
}
|
||||
|
||||
/* Lists */
|
||||
ol,
|
||||
ul {
|
||||
padding-left: 3rem;
|
||||
}
|
||||
|
||||
/* Format forms */
|
||||
textarea,
|
||||
select,
|
||||
input {
|
||||
font-size: inherit;
|
||||
font-family: inherit;
|
||||
padding: .5rem;
|
||||
margin-bottom: .5rem;
|
||||
color: var(--text);
|
||||
background: var(--bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 5px;
|
||||
box-shadow: none;
|
||||
box-sizing: border-box;
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
/* Make the textarea wider than other inputs */
|
||||
textarea {
|
||||
width: 80%
|
||||
}
|
||||
|
||||
/* Makes input fields wider on smaller screens */
|
||||
@media only screen and (max-width: 720px) {
|
||||
textarea,
|
||||
select,
|
||||
input {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* Ensures the checkbox and radio inputs do not have a set width like other input fields */
|
||||
input[type="checkbox"], input[type="radio"]{
|
||||
width: auto;
|
||||
}
|
||||
|
||||
/* do not show border around file selector button */
|
||||
input[type="file"] {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* Without this any HTML using <fieldset> shows ugly borders and has additional padding/margin. (Issue #3) */
|
||||
fieldset {
|
||||
border: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/* Misc body elements */
|
||||
|
||||
hr {
|
||||
color: var(--border);
|
||||
border-top: 1px;
|
||||
margin: 1rem auto;
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: 2px 5px;
|
||||
border-radius: 4px;
|
||||
background: var(--marked);
|
||||
}
|
||||
|
||||
main img, main video {
|
||||
max-width: 100%;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
figure {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
figcaption {
|
||||
font-size: .9rem;
|
||||
color: var(--text-light);
|
||||
text-align: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 2rem 0 2rem 2rem;
|
||||
padding: .4rem .8rem;
|
||||
border-left: .35rem solid var(--accent);
|
||||
opacity: .8;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
cite {
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-light);
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
/* Use mono font for code like elements */
|
||||
code,
|
||||
pre,
|
||||
kbd,
|
||||
samp {
|
||||
font-size: 1.075rem;
|
||||
font-family: var(--mono-font);
|
||||
color: var(--code);
|
||||
}
|
||||
|
||||
kbd {
|
||||
color: var(--preformatted);
|
||||
border: 1px solid var(--preformatted);
|
||||
border-bottom: 3px solid var(--preformatted);
|
||||
border-radius: 5px;
|
||||
padding: .1rem;
|
||||
}
|
||||
|
||||
pre {
|
||||
padding: 1rem 1.4rem;
|
||||
max-width: 100%;
|
||||
overflow: auto;
|
||||
color: var(--preformatted);
|
||||
background: var(--accent-bg);
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
/* Fix embedded code within pre */
|
||||
pre code {
|
||||
color: var(--preformatted);
|
||||
background: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/* CSS for Openring */
|
||||
.webring {
|
||||
margin-top: 2rem;
|
||||
}
|
||||
|
||||
.wr-articles {
|
||||
display: flex;
|
||||
|
||||
@media(max-width: 640px) {
|
||||
flex-direction: column;
|
||||
}
|
||||
}
|
||||
|
||||
.wr-article {
|
||||
flex: 1 1 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #323542;
|
||||
padding: 0.5rem;
|
||||
|
||||
margin: 0 0.5rem;
|
||||
|
||||
@media(max-width: 640px) {
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
.wr-article:first-child {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.wr-article:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.wr-summary {
|
||||
font-size: 0.8rem;
|
||||
flex: 1 1 0;
|
||||
color: rgb(235, 235, 235);
|
||||
}
|
||||
|
||||
.wr-attribution {
|
||||
float: right;
|
||||
font-size: 0.8rem;
|
||||
color: rgb(192, 191, 191);
|
||||
line-height: 3;
|
||||
}
|
||||
|
||||
.wr-date {
|
||||
color: rgb(192, 191, 191);
|
||||
}
|
||||
|
||||
.wr-source {
|
||||
color: rgb(192, 191, 191);
|
||||
}
|
||||
|
|
@ -0,0 +1,24 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="{{ with .Site.LanguageCode }}{{ . }}{{ else }}en-US{{ end }}">
|
||||
|
||||
<head>
|
||||
{{- partial "head.html" . -}}
|
||||
{{ $style := resources.Get "/main.css" | toCSS | minify | fingerprint }}
|
||||
<link rel="stylesheet" href="{{ $style.Permalink }}">
|
||||
{{- partial "head-custom.html" . -}}
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<header>
|
||||
{{- partial "header.html" . -}}
|
||||
</header>
|
||||
<main>
|
||||
{{- block "main" . }}{{- end }}
|
||||
</main>
|
||||
<footer>
|
||||
{{ partial "footer.html" . -}}
|
||||
</footer>
|
||||
|
||||
{{- partial "body-custom" . -}}
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,49 @@
|
|||
{{ define "main" }}
|
||||
|
||||
{{ if .Data.Singular }}
|
||||
<h2>{{ .Title }}:</h2>
|
||||
<p>
|
||||
<a href="{{ "/blog" | relURL }}">Back to posts</a>
|
||||
</p>
|
||||
{{ else }}
|
||||
<h2>{{ .Title }}</h2>
|
||||
{{ end }}
|
||||
|
||||
{{ .Content }}
|
||||
|
||||
<small>
|
||||
<p>Subscribe to the RSS feed for <i>this view</i> by <a href="index.xml">copying this link</a>.</p>
|
||||
</small>
|
||||
|
||||
<ul>
|
||||
{{ range .Pages }}
|
||||
<li>
|
||||
<span>
|
||||
<i>
|
||||
<time datetime='{{ .Date.Format "2006-01-02" }}' pubdate>
|
||||
{{ .Date.Format "Jan 02, 2006" }}
|
||||
</time>
|
||||
</i>
|
||||
</span>
|
||||
<a href="{{ .Permalink }}">{{ .Title }}</a>
|
||||
</li>
|
||||
{{ else }}
|
||||
<li>
|
||||
<p>No posts yet, check back soon.</p>
|
||||
</li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
|
||||
{{ if .Data.Singular }}
|
||||
{{else}}
|
||||
<small>
|
||||
<div>
|
||||
Tags:
|
||||
{{ range .Site.Taxonomies.tags }}
|
||||
<a href="{{ .Page.Permalink }}">#{{ .Page.Title }}</a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</small>
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{{ define "main" }}
|
||||
|
||||
<content>
|
||||
{{ .Content }}
|
||||
</content>
|
||||
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1,40 @@
|
|||
{{ define "main" }}
|
||||
|
||||
<h1>{{ .Title }}</h1>
|
||||
<p>
|
||||
• Published on
|
||||
<time datetime='{{ .Date.Format "2006-01-02" }}' pubdate>
|
||||
{{ .Date.Format "Jan 02, 2006" }}
|
||||
</time>
|
||||
{{ if .Lastmod }}{{ if not (eq .Lastmod .Date )}}
|
||||
<i>
|
||||
(<b>updated</b> {{ dateFormat "2006-01-02" .Lastmod.Local }})
|
||||
</i>
|
||||
{{ end }}{{ end }}
|
||||
|
||||
{{ with .Page.Params.Authors }}
|
||||
{{ partial "taxonomy-authors.html" . -}}
|
||||
{{ end }}
|
||||
</p>
|
||||
|
||||
<content>
|
||||
{{ .Content }}
|
||||
</content>
|
||||
|
||||
<p>
|
||||
<b>Tags:</b>
|
||||
{{ range (.GetTerms "tags") }}
|
||||
<a href="{{ .Permalink }}">#{{ .LinkTitle }}</a>
|
||||
{{ end }}
|
||||
</p>
|
||||
|
||||
|
||||
<a href="#"><button class="top">Back to top</button></a>
|
||||
<!--<a href="sc"><button class="top">Load comments (Mastodon)</button></a>-->
|
||||
|
||||
|
||||
{{ if $.Site.Params.openring }}
|
||||
{{ partial "openring-out" . -}}
|
||||
{{ end }}
|
||||
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{{ define "main" }}
|
||||
{{ .Content }}
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<!--Create your own copy of "layouts/partials/body-custom.html" to overwrite this one-->
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<p>
|
||||
{{ .Site.Copyright }} • <a href="https://git.earne.link/earnestma/dracublog/" target="_blank" rel="noopener">theme</a>
|
||||
</p>
|
||||
{{ if $.GitInfo }}
|
||||
<p>
|
||||
{{ .GitInfo.AbbreviatedHash }}
|
||||
</p>
|
||||
{{ end }}
|
||||
|
|
@ -0,0 +1 @@
|
|||
<!--Create your own copy of "layouts/partials/head-custom.html" to overwrite this one-->
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
{{ with .Site.Params.favicon }}
|
||||
<link rel="shortcut icon" href="{{ . | absURL }}" />{{ end }}
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>{{ if .IsHome }}{{ $.Site.Title }}{{ else }}{{ .Title }} ─ {{ $.Site.Title }}{{ end }}</title>
|
||||
{{ partial "head-favicon.html" . -}}
|
||||
<meta name="title" content="{{ with .Title }}{{ . }}{{ else }}{{ .Site.Title }}{{ end }}" />
|
||||
<meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{if .IsPage }}{{ .Summary }}{{ else }}{{ with .Site.Params.description }}{{ . }}{{ end }}{{ end }}{{ end }}" />
|
||||
<meta name="keywords" content="{{ if .IsPage}}{{ range $index, $tag := .Params.tags }}{{ $tag }},{{ end }}{{ else }}{{ range $plural, $terms := .Site.Taxonomies }}{{ range $term, $val := $terms }}{{ printf "%s," $term }}{{ end }}{{ end }}{{ end }}" />
|
||||
{{ if $.Params.noindex }}
|
||||
<meta name="robots" content="noindex">
|
||||
{{ end }}
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS" href="/blog/index.xml">
|
||||
<meta name="referrer" content="no-referrer-when-downgrade" />
|
||||
{{ template "_internal/opengraph.html" . }}
|
||||
{{ template "_internal/schema.html" . }}
|
||||
{{ template "_internal/twitter_cards.html" . }}
|
||||
|
|
@ -0,0 +1,13 @@
|
|||
<a href="{{ "/" | relURL }}" style="text-decoration: none;">
|
||||
<h2>{{ .Site.Title }}</h2>
|
||||
</a>
|
||||
|
||||
|
||||
<nav>
|
||||
{{ with .Site.GetPage "/blog" }}
|
||||
<a href="{{ "/blog" | relURL }}">Blog</a>
|
||||
{{ end }}
|
||||
{{ range .Site.Menus.main }}
|
||||
<a href="{{ .URL }}">{{ .Name }}</a>
|
||||
{{ end }}
|
||||
</nav>
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
<!--Make sure openring outputs to yoursite/layouts/partials/openring-out.html to not see this-->
|
||||
<!--Param in config.toml to enable:
|
||||
[params]
|
||||
openring = true
|
||||
-->
|
||||
<p><strong>You might not have set up your openring input file correctly.</strong></p>
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
by
|
||||
{{- range $index, $el := . -}}
|
||||
{{- if gt $index 0 }}
|
||||
<span class="separator">,</span>
|
||||
{{- end }}
|
||||
<a href="{{ ( printf "authors/%s/" ( . | urlize ) ) | relLangURL }}">{{ . }}</a>
|
||||
{{- end -}}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
# [Dracublog](https://www.earnestma.xyz/dracublog)
|
||||
|
||||
[](https://git.earne.link/earnestma/dracublog)
|
||||
[](https://github.com/earnestma/dracublog)
|
||||
|
||||
A simple, fully-featured Hugo blogging theme with Dracula colors.
|
||||
|
||||
## Setup
|
||||
|
||||
## Contributing
|
||||
|
||||
See [contributing.md](contributing.md)
|
||||
|
||||
## Thanks
|
||||
|
||||
- [Dracula theme](https://draculatheme.com/) (MIT)
|
||||
- [Simple CSS](https://simplecss.org/) (MIT)
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
# theme.toml template for a Hugo theme
|
||||
# See https://github.com/gohugoio/hugoThemes#themetoml for an example
|
||||
|
||||
name = "Dracublog"
|
||||
license = "MIT"
|
||||
licenselink = "https://git.earne.link/earnestma/dracublog/src/branch/main/license"
|
||||
description = "A simple, fully-featured blogging theme with Dracula colors"
|
||||
homepage = "http://www.earnestma.xyz/dracublog"
|
||||
tags = ["blog", "customizable", "dark", "fast", "modern", "responsive"]
|
||||
features = ["blog", "customizable", "dark", "fast", "modern", "responsive"]
|
||||
min_version = "0.67.1"
|
||||
|
||||
[author]
|
||||
name = "earnest ma"
|
||||
homepage = "https://www.earnestma.xyz"
|
||||
Loading…
Reference in New Issue