diff options
author | Alan Pearce | 2023-09-22 08:40:59 +0200 |
---|---|---|
committer | Alan Pearce | 2023-09-22 12:03:47 +0200 |
commit | 3a2d198d153efc8a69e7640f7dcde88207268ff3 (patch) | |
tree | 7cec49484a6fbbf96121ff396afe1fd0425c4654 /templates | |
parent | 9c4fd37c97a87b9d1ab9e65b77e4578936b66323 (diff) | |
download | website-3a2d198d153efc8a69e7640f7dcde88207268ff3.tar.lz website-3a2d198d153efc8a69e7640f7dcde88207268ff3.tar.zst website-3a2d198d153efc8a69e7640f7dcde88207268ff3.zip |
Replace zola with DOM-based static site generation code
Diffstat (limited to 'templates')
-rw-r--r-- | templates/404.html | 37 | ||||
-rw-r--r-- | templates/feed-styles.xsl (renamed from templates/feed-styles.html) | 4 | ||||
-rw-r--r-- | templates/feed.xml | 24 | ||||
-rw-r--r-- | templates/footer.html | 1 | ||||
-rw-r--r-- | templates/index.html | 99 | ||||
-rw-r--r-- | templates/post.html | 50 | ||||
-rw-r--r-- | templates/style.css | 196 | ||||
-rw-r--r-- | templates/tag.html | 49 | ||||
-rw-r--r-- | templates/tags.html | 40 |
9 files changed, 459 insertions, 41 deletions
diff --git a/templates/404.html b/templates/404.html new file mode 100644 index 0000000..4e64fcc --- /dev/null +++ b/templates/404.html @@ -0,0 +1,37 @@ +<!doctype html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>Site Title</title> + <meta name="referrer" content="no-referrer-when-downgrade" /> + <link + rel="alternate" + type="application/atom+xml" + title="" + href="/atom.xml" + /> + <style></style> + </head> + <body> + <a class="skip" href="#main">Skip to main content</a> + <header> + <h2> + <a href="/" class="title">Site title</a> + </h2> + <nav> + <a href="/">Home</a> + </nav> + </header> + <main id="main"> + <h1>404</h1> + <h2>ʕノ•ᴥ•ʔノ ︵ ┻━┻</h2> + </main> + <footer> + Licensed under a + <a rel="license" href="http://creativecommons.org/licenses/by/4.0/" + >Creative Commons Attribution 4.0 International License</a + >. + </footer> + </body> +</html> diff --git a/templates/feed-styles.html b/templates/feed-styles.xsl index a66ddc0..0197e87 100644 --- a/templates/feed-styles.html +++ b/templates/feed-styles.xsl @@ -12,9 +12,7 @@ <meta charset="utf-8" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> - <style> - {%- include "style.css.html" ignore missing -%} - </style> + <style></style> </head> <body> <main> diff --git a/templates/feed.xml b/templates/feed.xml new file mode 100644 index 0000000..ddc90dd --- /dev/null +++ b/templates/feed.xml @@ -0,0 +1,24 @@ +<?xml version="1.0" encoding="utf-8"?> +<?xml-stylesheet href="/feed-styles.xsl" type="text/xsl"?> +<feed xmlns="http://www.w3.org/2005/Atom"> + <title>Example Feed</title> + <link href="http://example.org/"></link> + <id>urn:uuid:60a76c80-d399-11d9-b91C-0003939e0af6</id> + <updated>2003-12-13T18:30:02Z</updated> + <entry> + <title>Atom-Powered Robots Run Amok</title> + <link rel="alternate" type="text/html" href="http://example.org/2003/12/13/atom03.html"></link> + <id>urn:uuid:1225c695-cfb8-4ebb-aaaa-80da344efa6a</id> + <updated>2003-12-13T18:30:02Z</updated> + <summary>Some text.</summary> + <content type="html"> + <div> + <p>This is the entry content.</p> + </div> + </content> + <author> + <name>John Doe</name> + </author> + </entry> + +</feed> diff --git a/templates/footer.html b/templates/footer.html deleted file mode 100644 index 422c90c..0000000 --- a/templates/footer.html +++ /dev/null @@ -1 +0,0 @@ -<footer>Licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/4.0/">Creative Commons Attribution 4.0 International License</a>.</footer> diff --git a/templates/index.html b/templates/index.html index a79b1c8..b4832a9 100644 --- a/templates/index.html +++ b/templates/index.html @@ -1,39 +1,64 @@ -{% extends "base.html" %} - -{% block body_attrs %} class="h-card vcard"{% endblock %} - -{% block title_class %} p-name fn{% endblock %} - -{% block main -%} - <main id="content"> - <div> - {{ section.content | safe -}} - </div> - <section> - <h2>Latest Posts</h2> - <ul class="h-feed"> - {%- set section = get_section(path="post/_index.md") %} - {%- for page in section.pages | slice(end=3) %} +<!doctype html> +<html> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>Site Title</title> + <meta name="referrer" content="no-referrer-when-downgrade" /> + <link + rel="alternate" + type="application/atom+xml" + title="" + href="/atom.xml" + /> + <style></style> + </head> + <body> + <a class="skip" href="#main">Skip to main content</a> + <header> + <h2> + <a href="/" class="title">Site title</a> + </h2> + <nav> + <a href="/">Home</a> + </nav> + </header> + <main id="main"> + <div id="content"></div> + <section> + <h2>Latest Posts</h2> + <ul class="h-feed"> <li class="h-entry"> - <time class="dt-published" datetime="{{ page.date | date(format="%+") }}">{{ page.date | date(format=config.extra.date_format) }}</time> - <a class="u-url p-name" href="{{ page.path | safe }}">{{ page.title }}</a> + <span> + <time + class="dt-published" + datetime="2000-12-31T12:33:02+02:00" + pubdate + > + 2000-12-31 + </time> + </span> + <a class="p-name u-url" href="/post/lorem-ipsum/">Lorem Ipsum</a> </li> - {%- endfor %} - </ul> - </section> - <section> - <h2>Elsewhere on the Internet</h2> - <ul> - {%- for item in config.extra.contact_menu %} - <li> - {%- if item.url is starting_with("mailto:") -%} - <a href="{{ item.url | safe }}" class="u-email email" rel="me">{{ item.name }}</a> - {%- else -%} - <a href="{{ item.url | safe }}" class="u-url url" rel="me">{{ item.name }}</a> - {%- endif -%} - </li> - {%- endfor %} - </ul> - </section> - </main> -{% endblock %} + </ul> + </section> + <section> + <h2>Elsewhere on the Internet</h2> + <ul> + <li><a href="mailto:alan@alanpearce.eu">alan@alanpearce.eu</a></li> + <li><a href="https://codeberg.org/alanpearce/">Codeberg</a></li> + <li><a href="https://github.com/alanpearce/">GitHub</a></li> + <li><a href="https://gitlab.com/alanpearce/">GitLab</a></li> + <li><a href="https://ieji.de/@alanpearce">Mastodon</a></li> + <li><a href="https://bsky.app/profile/alanpearce.eu">Bluesky</a></li> + </ul> + </section> + </main> + <footer> + Licensed under a + <a rel="license" href="http://creativecommons.org/licenses/by/4.0/" + >Creative Commons Attribution 4.0 International License</a + >. + </footer> + </body> +</html> diff --git a/templates/post.html b/templates/post.html new file mode 100644 index 0000000..2a66058 --- /dev/null +++ b/templates/post.html @@ -0,0 +1,50 @@ +<!doctype html> +<html lang="en-GB"> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title></title> + <meta name="referrer" content="no-referrer-when-downgrade" /> + <link + rel="alternate" + type="application/atom+xml" + title="" + href="/atom.xml" + /> + <style></style> + </head> + <body> + <a class="skip" href="#main">Skip to main content</a> + <header> + <h2> + <a href="/" class="title"></a> + </h2> + <nav> + <a href="/">Home</a> + </nav> + </header> + <main id="main"> + <article class="h-entry"> + <h1 class="p-name">Post Title</h1> + <p> + <time class="dt-published" pubdate>2000-12-31</time> + </p> + <div class="e-content"> + Enim lobortis scelerisque fermentum dui faucibus in ornare quam + viverra. Eget egestas purus viverra accumsan in nisl nisi, scelerisque + eu ultrices vitae, auctor eu augue ut lectus arcu, bibendum at. + </div> + <ul class="p-categories"> + Tags: + <li><a class="p-category" href="/tags/sample/">#sample</a></li> + </ul> + </article> + </main> + <footer> + Licensed under a + <a rel="license" href="http://creativecommons.org/licenses/by/4.0/" + >Creative Commons Attribution 4.0 International License</a + >. + </footer> + </body> +</html> diff --git a/templates/style.css b/templates/style.css new file mode 100644 index 0000000..23722e1 --- /dev/null +++ b/templates/style.css @@ -0,0 +1,196 @@ +body { + font-family: Verdana, sans-serif; + margin: auto; + padding: 20px; + max-width: 720px; + text-align: left; + background-color: #fff; + word-wrap: break-word; + overflow-wrap: break-word; + line-height: 1.5; + color: #444; +} + +.skip { + position: absolute; + top: -3em; + background: #fff; +} +.skip:focus { + top: 0; +} + +h1, +h2, +h3, +h4, +h5, +h6, +strong, +b { + color: #222; +} + +a { + color: #3273dc; +} + +.title { + color: #222; + text-decoration: none; + border: 0; +} + +time { + font-style: italic; +} + +.title span { + font-weight: 400; +} + +nav a { + margin-right: 10px; +} + +.tags { + padding: unset; + font-size: small; +} + +.tags > li { + list-style: none; + display: inline-block; + padding-right: 1ex; +} + +textarea { + width: 100%; + font-size: 1rem; +} + +input { + font-size: 1rem; +} + +main, +article { + line-height: 1.6; +} + +table { + width: 100%; +} + +img { + max-width: 100%; +} + +code { + padding: 2px 5px; + background-color: #f2f2f2; +} + +pre code { + color: #222; + display: block; + padding: 20px; + white-space: pre-wrap; + font-size: 0.875rem; + overflow-x: auto; +} + +div.highlight pre { + background-color: initial; + color: initial; +} + +div.highlight code { + background-color: unset; + color: unset; +} + +blockquote { + border-left: 1px solid #999; + color: #222; + padding-left: 20px; + font-style: italic; +} + +footer { + padding: 25px; + text-align: center; +} + +.helptext { + color: #777; + font-size: small; +} + +.errorlist { + color: #eba613; + font-size: small; +} + +/* blog posts */ +ul.blog-posts { + list-style-type: none; + padding: unset; +} + +ul.blog-posts li { + display: flex; +} + +ul.blog-posts li span { + flex: 0 0 130px; +} + +ul.blog-posts li a:visited { + color: #8b6fcb; +} + +@media (prefers-color-scheme: dark) { + body { + background-color: #333; + color: #ddd; + } + + h1, + h2, + h3, + h4, + h5, + h6, + strong, + b, + .title { + color: #eee; + } + + a { + color: #8cc2dd; + } + + code { + background-color: #777; + } + + pre code { + color: #ddd; + } + + blockquote { + color: #ccc; + } + + textarea, + input { + background-color: #252525; + color: #ddd; + } + + .helptext { + color: #aaa; + } +} diff --git a/templates/tag.html b/templates/tag.html new file mode 100644 index 0000000..ae5b8e9 --- /dev/null +++ b/templates/tag.html @@ -0,0 +1,49 @@ +<!doctype html> +<html lang="en-GB"> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>Site Title</title> + <meta name="referrer" content="no-referrer-when-downgrade" /> + <link + rel="alternate" + type="application/atom+xml" + title="Site Title" + href="/atom.xml" + /> + <style></style> + </head> + <body> + <a class="skip" href="#content">Skip to main content</a> + <header> + <h2> + <a href="/" class="title">Site Title</a> + </h2> + <nav> + <a href="/">Home</a> + </nav> + </header> + <main id="content"> + <ul class="h-feed blog-posts"> + <li class="h-entry"> + <span> + <time + class="dt-published" + datetime="2000-12-31T12:33:02+02:00" + pubdate + > + 2000-12-31 + </time> + </span> + <a class="p-name u-url" href="/post/lorem-ipsum/">Lorem Ipsum</a> + </li> + </ul> + </main> + <footer> + Licensed under a + <a rel="license" href="http://creativecommons.org/licenses/by/4.0/" + >Creative Commons Attribution 4.0 International License</a + >. + </footer> + </body> +</html> diff --git a/templates/tags.html b/templates/tags.html new file mode 100644 index 0000000..a724c62 --- /dev/null +++ b/templates/tags.html @@ -0,0 +1,40 @@ +<!doctype html> +<html lang="en-GB"> + <head> + <meta charset="utf-8" /> + <meta name="viewport" content="width=device-width, initial-scale=1.0" /> + <title>Site Title</title> + <meta name="referrer" content="no-referrer-when-downgrade" /> + <link + rel="alternate" + type="application/atom+xml" + title="Site title" + href="/atom.xml" + /> + <style></style> + </head> + <body> + <a class="skip" href="#content">Skip to main content</a> + <header> + <h2> + <a href="/" class="title">Site title</a> + </h2> + <nav> + <a href="/">Home</a> + </nav> + </header> + <main id="content"> + <ul class="tags"> + <li class="h-feed"> + <a href="/tags/tag">#tag</a> + </li> + </ul> + </main> + <footer> + Licensed under a + <a rel="license" href="http://creativecommons.org/licenses/by/4.0/" + >Creative Commons Attribution 4.0 International License</a + >. + </footer> + </body> +</html> |