jekyll-theme-gruv-poole 1.0.0

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 5bdb06a5dc61aad1afccc285cd7faf66af1ea76ea70a1a59f8ddf2ae6150bd0a
+  data.tar.gz: cb38c3a8c61371e54928db184893359944a91857cc1dabd3b492acbc3856e487
+SHA512:
+  metadata.gz: fe6945b16ac11dbd478ac806c7a596ba6509d4d2c7bac5388cf2e94002cd4204be2e30bbbabd507f4980135ac556b450ef723c77e1b5e80d051a9394569a62f1
+  data.tar.gz: 8d7fc5e6ee681d6db83b088c5c54cd76330ff39a626f1cc8254aed257df5f70ae9f04e54073bab29906add971267787c8f8f24e5df8a7ff8a0c49fc21511394c

data/LICENSE.md

@@ -0,0 +1,11 @@
+# Released under MIT License
+
+Copyright (c) 2024 Jamison Griffith.
+
+Copyright (c) 2013 Mark Otto.
+
+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.

data/README.md

@@ -0,0 +1,155 @@
+# Gruv Poole
+
+Gruv Poole is a modern, WCAG-compliant fork of the [Poole theme](https://github.com/poole/poole) for [Jekyll](http://jekyllrb.com), the static site generator.
+
+Poole's bones serve as the foundation, and Gruv Poole revamps the muscle, connective tissue and skin:
+- implements the retro groove color palette from the Vim [Gruvbox theme](https://github.com/morhetz/gruvbox)
+- complies with the [WCAG 2.2 AA accessibility standard](https://www.wcag.com/resource/what-is-wcag)
+- adds dedicated [open source typefaces](#licenses)
+- adds a responsive two-column [home layout](#home-page-content) with overridable main content and social links
+- adds dynamic privacy policy based on your [Google Analytics configuration](#privacy-and-google-analytics)
+- removes paginator plugin in favor of adding ability to create [nav items in the masthead](#masthead-navigation)
+- removes RSS and SEO plugins and replaces with configurable behavior
+- refactors stylesheets to be more focused
+
+Gruv Poole still aims to adhere to [@mdo's](https://github.com/mdo) philosophy of the original theme:
+> [To] provide a clear and concise foundational setup for any Jekyll site. It does so by furnishing a full vanilla Jekyll install with example layouts, pages, posts, and styles.
+
+Have questions or suggestions? Feel free to [open an issue on GitHub](https://github.com/jamogriff/gruv-poole/issues/new).
+
+## Contents
+
+- [Screenshots](#screenshots)
+- [Usage](#usage)
+- [Theme Overview](#theme-overview)
+- [Configuration Options](#configuration-options)
+- [Licenses](#licenses)
+
+## Screenshots
+
+### Dark Mode
+<img src="demo-assets/dark1.png" alt="Gruv Poole home dark mode" width="430">
+<img src="demo-assets/dark2.png" alt="Gruv Poole content dark mode" width="430">
+
+### Light Mode
+<img src="demo-assets/light1.png" alt="Gruv Poole home light mode" width="430">
+<img src="demo-assets/light2.png" alt="Gruv Poole content light mode" width="430">
+
+
+## Usage
+
+### Install as a Gem
+
+The Gruv Poole theme was intended to be distributed as a [Ruby Gem for Jekyll sites](https://jekyllrb.com/docs/themes/#understanding-gem-based-themes).
+In your Jekyll site's code, add the following to your Gemfile:
+`gem "jekyll-theme-gruv-poole"`
+
+Add the following line to your site's `_config.yml`:
+```yaml
+theme: gruv-poole
+```
+
+Ensure that you have your `_config.yml` with the data necessary to build the theme (see [Configuration Options](#configuration-options)) and then run `bundle` and `jekyll s`.
+
+### Hacking on theme code
+
+Feel free to tweak this theme to your liking. Pay attention to the `.ruby-version` file for what version of Ruby to use-- [rbenv](https://github.com/rbenv/rbenv) is recommended for Ruby development.
+
+Once Ruby version is set, then run `bundle install` and then `bundle exec jekyll s` to build and serve the demo theme site. Please note this theme's [Configuration Options](#configuration-options)).
+Open <http://localhost:4000> in your browser, and voilà.
+
+For further resources (e.g. hosting free site on GitHub Pages, etc) see the original [Poole theme's documentation](https://github.com/poole/poole).
+
+## Theme Overview
+
+### Site structure (HTML)
+
+The files within the `_layouts` directory define the HTML structure of pages and posts on the site. `_layouts/base.html` is the base HTML of the theme, which all other layouts should extend from.
+
+Re-usable snippets of HTML code--also known as partials-- are placed in the `_includes` directory. 
+
+### Site styling (Sass/CSS)
+
+All of the site's styling resides in the `_sass` directory. The most noteworthy being `_variables.scss`, where CSS variables can be quickly tweaked to change the look and feel of the theme.
+
+The theme's main style file that ultimately gets imported to the site's base HTML layout is `/assets/main.scss`. This `main.scss` file imports all of the Sass files in the `_sass` directory and Jekyll's Sass compilation outputs a single `main.css` similar to Webpack.
+
+## Configuration Options
+
+All the options and content in this section are configured in your site's `_config.yml` file. Note that [YAML](https://yaml.org/) syntax is very specific about spacing.
+
+The following properties should be considered required and are typical of a Jekyll theme:
+```yaml
+title: Gruv Poole
+tagline: Gruvbox Jekyll theme
+description: This description will be used in meta tags for SEO and displayed on the homepage
+```
+
+### Home page content
+
+Gruv Poole's home page layout features an abbreviated about section with social links and a main content area.
+
+#### About section
+
+These are optional, but the theme was designed to render them.
+
+```yaml
+about:
+  image:
+    src: demo-assets/jamo.jpg
+    alt: Image of Jamogriff
+  # You can add more links here, but icons are only available
+  # for these platforms specifically
+  socials:
+    - { id: github, url: https://github.com/jamogriff }
+    - { id: youtube, url: https://github.com/jamogriff }
+    - { id: linkedin, url: https://github.com/jamogriff }
+    - { id: facebook, url: https://github.com/jamogriff }
+    - { id: instagram, url: https://github.com/jamogriff }
+    - { id: reddit, url: https://github.com/jamogriff }
+    - { id: tiktok, url: https://github.com/jamogriff }
+    - { id: x, url: https://github.com/jamogriff }
+```
+
+Additionally the theme also supports advertising an RSS feed. Gruv Poole itself **does not** generate an RSS feed by default (see [jekyll-feed plugin](https://github.com/jekyll/jekyll-feed)); however, it will include a link with RSS icon in the social links area if you add the feed's path in your config:
+```yaml
+rss_feed: feed.xml
+```
+
+#### Main section
+
+By default a post archive is displayed as the main content, but this can easily be overridden to be anything you want. To override this content you can add whatever HTML you want in a page that implements the `home` layout.
+
+### Masthead navigation
+
+You may add a couple of pages to be displayed as links in the navbar section of the site's masthead:
+```yaml
+masthead_pages:
+  - about.md
+```
+
+### Privacy and Google Analytics
+
+Gruv Poole includes a dynamic privacy policy layout (`privacy-policy`) **that you must implement in a page on your site.** The layout will display a privacy policy dependant on whether Google Analytics is enabled on your site.
+
+To enable Google Analytics, add the following lines to your Jekyll site's `_config.yml`:
+
+```yaml
+google_analytics: UA-NNNNNNNN-N
+```
+
+Note that Google Analytics will only be enabled in production (i.e. adding `JEKYLL_ENV=production` [when building](https://jekyllrb.com/docs/configuration/environments/) the site).
+
+### SEO
+
+Gruv Poole offers a very simple implementation of SEO that only targets the [description meta tag](https://developers.google.com/search/docs/crawling-indexing/special-tags). You are encouraged to add a `description` to the front matter of posts and pages to leverage this. Otherwise, the site description is used by default.
+
+If you want to opt out of this behavior (e.g. you want to use an SEO plugin), then add the following to your config:
+```yaml
+disable_simple_seo: true
+```
+---
+
+## Licenses
+
+Open sourced under the [MIT license](LICENSE.md). Fonts are both licensed under the [SIL Open Font License](https://openfontlicense.org/). Their licenses can be found [here](assets/fonts/body/LICENSE.md) and [here](assets/fonts/code/LICENSE.md).

data/_includes/google-analytics.html

@@ -0,0 +1,9 @@
+<script async src="https://www.googletagmanager.com/gtag/js?id={{ site.google_analytics }}"></script>
+<script>
+  window['ga-disable-{{ site.google_analytics }}'] = window.doNotTrack === "1" || navigator.doNotTrack === "1" || navigator.doNotTrack === "yes" || navigator.msDoNotTrack === "1";
+  window.dataLayer = window.dataLayer || [];
+  function gtag(){window.dataLayer.push(arguments);}
+  gtag('js', new Date());
+
+  gtag('config', '{{ site.google_analytics }}');
+</script>

data/_includes/head.html

@@ -0,0 +1,29 @@
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  {% unless site.disable_simple_seo %}
+    {% if page.description %}
+      <meta name="description" content="{{ page.description }}" />
+    {% else %}
+      <meta name="description" content="{{ site.description}}" />
+    {% endif %}
+  {% endunless %}
+
+  <title>
+    {% if page.title == "Home" %}
+      {{ site.title }}{% if site.tagline %} &middot; {{ site.tagline }}{% endif %}
+    {% else %}
+      {{ page.title }} &middot; {{ site.title }}
+    {% endif %}
+  </title>
+
+  <link rel="preload" href="{{ 'assets/fonts/body/Jost.woff2' | relative_url }}" as="font" type="font/woff2" crossorigin>
+  <link rel="stylesheet" href="{{ 'assets/main.css' | relative_url }}">
+  <link rel="apple-touch-icon-precomposed" sizes="144x144" href="{{ '/assets/apple-touch-icon-precomposed.png' | relative_url }}">
+  <link rel="shortcut icon" href="{{ '/assets/favicon.ico' | relative_url }}">
+  <link rel="alternate" type="application/atom+xml" title="{{ site.title }}" href="{{ 'atom.xml' | relative_url }}">
+
+  {% if jekyll.environment == 'production' and site.google_analytics %}
+    {% include google-analytics.html %}
+  {% endif %}
+</head>

data/_includes/nav.html

@@ -0,0 +1,12 @@
+{% if site.masthead_pages.size > 0 %}
+  <ul class="nav">
+    {% for page in site.masthead_pages %}
+      {% assign site_page = site.pages | where: "path", page | first %}
+      {% if site_page.title %}
+        <li>
+          <a href="{{ site_page.url | relative_url }}">{{ site_page.title | escape }}</a>
+        </li>
+      {% endif %}
+    {% endfor %}
+  </ul>
+{% endif %}

data/_includes/posts-by-year.html

@@ -0,0 +1,11 @@
+{% assign postsByYear = site.posts | group_by_exp: "post", "post.date | date: '%Y'" %}
+{% for year in postsByYear %}
+  <h2 class="post-ref-category">{{ year.name }}</h2>
+  {% for post in year.items %}
+  <div class="post-ref">
+    <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
+    <span></span>
+    <time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date_to_string: "ordinal", "US" }}</time>
+  </div>
+  {% endfor %}
+{% endfor %}

data/_includes/social_icons.html

@@ -0,0 +1,35 @@
+{% comment %}
+  Note that this isn't displayed on the page itself, but it provides symbol IDs
+  that can be referenced with the use element to render an icon with clean HTML
+  (e.g. <use xlink:href="#github"></use>)
+{% endcomment %}
+
+<!-- Icon SVGs provided by Bootstrap: https://icons.getbootstrap.com/ -->
+<!-- Subject to the Bootstrap authors' MIT license: https://github.com/twbs/icons/blob/main/LICENSE -->
+<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
+  <symbol id="github" viewBox="0 0 16 16">
+    <path d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27s1.36.09 2 .27c1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.01 8.01 0 0 0 16 8c0-4.42-3.58-8-8-8"/>
+  </symbol>
+  <symbol id="youtube" viewBox="0 0 16 16">
+    <path d="M8.051 1.999h.089c.822.003 4.987.033 6.11.335a2.01 2.01 0 0 1 1.415 1.42c.101.38.172.883.22 1.402l.01.104.022.26.008.104c.065.914.073 1.77.074 1.957v.075c-.001.194-.01 1.108-.082 2.06l-.008.105-.009.104c-.05.572-.124 1.14-.235 1.558a2.01 2.01 0 0 1-1.415 1.42c-1.16.312-5.569.334-6.18.335h-.142c-.309 0-1.587-.006-2.927-.052l-.17-.006-.087-.004-.171-.007-.171-.007c-1.11-.049-2.167-.128-2.654-.26a2.01 2.01 0 0 1-1.415-1.419c-.111-.417-.185-.986-.235-1.558L.09 9.82l-.008-.104A31 31 0 0 1 0 7.68v-.123c.002-.215.01-.958.064-1.778l.007-.103.003-.052.008-.104.022-.26.01-.104c.048-.519.119-1.023.22-1.402a2.01 2.01 0 0 1 1.415-1.42c.487-.13 1.544-.21 2.654-.26l.17-.007.172-.006.086-.003.171-.007A100 100 0 0 1 7.858 2zM6.4 5.209v4.818l4.157-2.408z"/>
+  </symbol>
+  <symbol id="facebook" viewBox="0 0 16 16">
+    <path d="M16 8.049c0-4.446-3.582-8.05-8-8.05C3.58 0-.002 3.603-.002 8.05c0 4.017 2.926 7.347 6.75 7.951v-5.625h-2.03V8.05H6.75V6.275c0-2.017 1.195-3.131 3.022-3.131.876 0 1.791.157 1.791.157v1.98h-1.009c-.993 0-1.303.621-1.303 1.258v1.51h2.218l-.354 2.326H9.25V16c3.824-.604 6.75-3.934 6.75-7.951"/>
+  </symbol>
+  <symbol id="instagram" viewBox="0 0 16 16">
+    <path d="M8 0C5.829 0 5.556.01 4.703.048 3.85.088 3.269.222 2.76.42a3.9 3.9 0 0 0-1.417.923A3.9 3.9 0 0 0 .42 2.76C.222 3.268.087 3.85.048 4.7.01 5.555 0 5.827 0 8.001c0 2.172.01 2.444.048 3.297.04.852.174 1.433.372 1.942.205.526.478.972.923 1.417.444.445.89.719 1.416.923.51.198 1.09.333 1.942.372C5.555 15.99 5.827 16 8 16s2.444-.01 3.298-.048c.851-.04 1.434-.174 1.943-.372a3.9 3.9 0 0 0 1.416-.923c.445-.445.718-.891.923-1.417.197-.509.332-1.09.372-1.942C15.99 10.445 16 10.173 16 8s-.01-2.445-.048-3.299c-.04-.851-.175-1.433-.372-1.941a3.9 3.9 0 0 0-.923-1.417A3.9 3.9 0 0 0 13.24.42c-.51-.198-1.092-.333-1.943-.372C10.443.01 10.172 0 7.998 0zm-.717 1.442h.718c2.136 0 2.389.007 3.232.046.78.035 1.204.166 1.486.275.373.145.64.319.92.599s.453.546.598.92c.11.281.24.705.275 1.485.039.843.047 1.096.047 3.231s-.008 2.389-.047 3.232c-.035.78-.166 1.203-.275 1.485a2.5 2.5 0 0 1-.599.919c-.28.28-.546.453-.92.598-.28.11-.704.24-1.485.276-.843.038-1.096.047-3.232.047s-2.39-.009-3.233-.047c-.78-.036-1.203-.166-1.485-.276a2.5 2.5 0 0 1-.92-.598 2.5 2.5 0 0 1-.6-.92c-.109-.281-.24-.705-.275-1.485-.038-.843-.046-1.096-.046-3.233s.008-2.388.046-3.231c.036-.78.166-1.204.276-1.486.145-.373.319-.64.599-.92s.546-.453.92-.598c.282-.11.705-.24 1.485-.276.738-.034 1.024-.044 2.515-.045zm4.988 1.328a.96.96 0 1 0 0 1.92.96.96 0 0 0 0-1.92m-4.27 1.122a4.109 4.109 0 1 0 0 8.217 4.109 4.109 0 0 0 0-8.217m0 1.441a2.667 2.667 0 1 1 0 5.334 2.667 2.667 0 0 1 0-5.334"/>
+  </symbol>
+  <symbol id="linkedin" viewBox="0 0 16 16">
+    <path d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z"/>
+  </symbol>
+  <symbol id="x" viewBox="0 0 16 16">
+    <path d="M12.6.75h2.454l-5.36 6.142L16 15.25h-4.937l-3.867-5.07-4.425 5.07H.316l5.733-6.57L0 .75h5.063l3.495 4.633L12.601.75Zm-.86 13.028h1.36L4.323 2.145H2.865z"/>
+  </symbol>
+  <symbol id="tiktok" viewBox="0 0 16 16">
+    <path d="M9 0h1.98c.144.715.54 1.617 1.235 2.512C12.895 3.389 13.797 4 15 4v2c-1.753 0-3.07-.814-4-1.829V11a5 5 0 1 1-5-5v2a3 3 0 1 0 3 3z"/>
+  </symbol>
+  <symbol id="reddit" viewBox="0 0 16 16">
+    <path d="M6.167 8a.83.83 0 0 0-.83.83c0 .459.372.84.83.831a.831.831 0 0 0 0-1.661m1.843 3.647c.315 0 1.403-.038 1.976-.611a.23.23 0 0 0 0-.306.213.213 0 0 0-.306 0c-.353.363-1.126.487-1.67.487-.545 0-1.308-.124-1.671-.487a.213.213 0 0 0-.306 0 .213.213 0 0 0 0 .306c.564.563 1.652.61 1.977.61zm.992-2.807c0 .458.373.83.831.83s.83-.381.83-.83a.831.831 0 0 0-1.66 0z"/>
+    <path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0m-3.828-1.165c-.315 0-.602.124-.812.325-.801-.573-1.9-.945-3.121-.993l.534-2.501 1.738.372a.83.83 0 1 0 .83-.869.83.83 0 0 0-.744.468l-1.938-.41a.2.2 0 0 0-.153.028.2.2 0 0 0-.086.134l-.592 2.788c-1.24.038-2.358.41-3.17.992-.21-.2-.496-.324-.81-.324a1.163 1.163 0 0 0-.478 2.224q-.03.17-.029.353c0 1.795 2.091 3.256 4.669 3.256s4.668-1.451 4.668-3.256c0-.114-.01-.238-.029-.353.401-.181.688-.592.688-1.069 0-.65-.525-1.165-1.165-1.165"/>
+  </symbol>
+</svg>

data/_layouts/base.html

@@ -0,0 +1,36 @@
+<!doctype html>
+<html lang="en">
+
+  {% include head.html %}
+
+  <body>
+    <div class="container">
+      <header class="masthead">
+        <h3 class="masthead-title">
+          <a href="{{ "/" | relative_url }}" title="Home">{{ site.title }}</a>
+        </h3>
+        {% include nav.html %}
+      </header>
+
+      <main>
+        {{ content }}
+      </main>
+
+      <footer>
+        <div class="links">
+          <a href="https://github.com/jamogriff/gruv-poole">Open Source Theme</a>
+
+          {% assign privacy_page = site.pages | where: "layout", "privacy-policy" | first %}
+          {% if privacy_page %}
+            <a href="{{ privacy_page.url | relative_url }}">Privacy Policy</a>
+          {% else %}
+            <mark>Please create a page that implements the privacy-policy layout.</mark>
+          {% endif %}
+        </div>
+        <div>
+          &copy; <time datetime="{{ site.time | date_to_xmlschema }}">{{ site.time | date: '%Y' }}</time>. All rights reserved.
+        </div>
+      </footer>
+    </div>
+  </body>
+</html>

data/_layouts/home.html

@@ -0,0 +1,62 @@
+---
+layout: base
+---
+
+{% include social_icons.html %}
+
+<div class="home">
+  <section class="about">
+    {% if site.about.image %}
+      <img src="{{ site.about.image.src | relative_url }}" alt="{{ site.about.image.alt }}">
+    {% else %}
+      <h1>{{ site.tagline }}</h1>
+    {% endif %}
+
+    <p>{{ site.description }}</p>
+
+    {% if site.about.socials.size > 0 or site.rss_feed %}
+      <ul class="social-links">
+        {% if site.about.socials.size > 0 %}
+          {% for social in site.about.socials %}
+          <li>
+            <a href="{{ social.url }}" rel="noreferrer">
+              <svg>
+                <use xlink:href="#{{ social.id }}"></use>
+              </svg>
+              {{ social.id | capitalize }}
+            </a>
+          </li>
+          {% endfor %}
+        {% endif %}
+
+        {% if site.rss_feed %}
+          <li>
+            <a href="{{ site.rss_feed | relative_url }}">
+            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-rss" viewBox="0 0 16 16">
+              <path d="M14 1a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H2a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1zM2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2z"/>
+              <path d="M5.5 12a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m-3-8.5a1 1 0 0 1 1-1c5.523 0 10 4.477 10 10a1 1 0 1 1-2 0 8 8 0 0 0-8-8 1 1 0 0 1-1-1m0 4a1 1 0 0 1 1-1 6 6 0 0 1 6 6 1 1 0 1 1-2 0 4 4 0 0 0-4-4 1 1 0 0 1-1-1"/>
+            </svg>
+            RSS
+            </a>
+          </li>
+        {% endif %}
+      </ul>
+    {% endif %}
+    
+  </section>
+
+  {% comment %}
+    You can add any content you want to index.html 
+    and it will be rendered instead of the post archive
+  {% endcomment %}
+  {% assign content = content | strip_newlines %}
+  {% if content != '' %}
+    <section>
+      {{ content }}
+    </section>
+  {% else %}
+    <section class="archive">
+      {% include posts-by-year.html %}
+    </section>
+  {% endif %}
+</div

data/_layouts/page.html

@@ -0,0 +1,8 @@
+---
+layout: base
+---
+
+<article class="page">
+  <h1 class="page-title">{{ page.title }}</h1>
+  {{ content }}
+</article>

data/_layouts/post.html

@@ -0,0 +1,24 @@
+---
+layout: base
+---
+
+<article class="post">
+  <h1 class="post-title">{{ page.title }}</h1>
+  <time datetime="{{ page.date | date_to_xmlschema }}" class="post-date">{{ page.date | date_to_string: "ordinal", "US" }}</time>
+  {{ content }}
+</article>
+
+{% if site.related_posts != empty %}
+<aside class="related-post-wrapper">
+  <h2>Related posts</h2>
+  <div class="related-posts">
+    {% for post in site.related_posts limit:3 %}
+      <div class="post-ref">
+        <a href="{{ post.url | relative_url }}">{{ post.title }}</a>
+        <span></span>
+        <time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date_to_string: "ordinal", "US" }}</time>
+      </div>
+    {% endfor %}
+  </ul>
+</aside>
+{% endif %}

data/_layouts/privacy-policy.html

@@ -0,0 +1,27 @@
+---
+layout: page
+---
+
+{% if site.google_analytics %}
+  <p class="lead"> 
+    {{ site.title }} utilizes Google Analytics. You may refer to the summarization below for how your data is collected and processed. Google's own <a href="https://support.google.com/analytics/answer/7318509?hl=en" rel="noreferrer">labyrinthine privacy policy</a> can also be found for the most up to date information.
+  </p>
+  <hr>
+
+  <p>
+    Google Analytics collects and processes user data through a combination of tracking technologies, primarily using cookies, JavaScript tags, and data sent by website visitors. When a user visits this website, a JavaScript tracking code collects data about the user's interactions, including page views, clicks, and other events. This data is then stored in cookies on the user's browser, allowing Google Analytics to track their behavior across different sessions and visits.
+    The tracking code can also collect technical information, such as the user's IP address, device type, browser, and operating system, which helps to build a profile of how users are interacting with the site.
+  </p>
+
+  <p>
+    Once data is collected, it is sent to Google Analytics servers for processing. The raw data is aggregated and anonymized to ensure user privacy, particularly with regard to <abbr title="Personally Identifiable Information">PII</abbr>. Google Analytics processes this data to generate a variety of reports, which provide insights into user behavior, traffic sources, demographics, session duration, and other key metrics.
+  </p>
+
+  <p>
+    Note that the processed data is available for website owners and marketers.
+  </p>
+{% else %}
+  <p class="lead">
+    No worries here. {{ site.title }}'s privacy policy is that we do not collect any user data at all.
+  </p>
+{% endif %}

data/_sass/_base.scss

@@ -0,0 +1,109 @@
+@use "variables";
+@use "mixins" as *;
+// Foundational styles
+//
+// Update the foundational and global aspects of the page.
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  padding: 2rem var(--spacer-2);
+  margin: 0;
+  font-family: var(--body-font);
+  font-size: var(--body-font-size);
+  line-height: var(--body-line-height);
+  color: var(--contrast-med);
+  background-color: var(--background);
+  -webkit-text-size-adjust: 100%;
+      -ms-text-size-adjust: 100%;
+}
+
+.container {
+  max-width: variables.$max-width;
+  margin-inline: auto;
+}
+
+footer {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  align-items: center;
+  padding-top: var(--spacer-2);
+  font-size: 0.875rem;
+  border-top: 0.125rem solid var(--muted);
+
+  .links {
+    @include inline-flex;
+    margin-bottom: var(--spacer);
+
+    @media(min-width: variables.$breakpoint-md) {
+      margin-bottom: 0;
+    }
+  }
+
+  @media(min-width: variables.$breakpoint-md) {
+    flex-direction: row;
+  }
+}
+
+a {
+  font-weight: inherit;
+  line-height: inherit;
+  color: var(--contrast-high);
+  text-decoration: none;
+  transition: all .2s ease-in-out;
+  text-decoration-skip-ink: auto;
+  text-underline-offset: .25rem;
+}
+
+body a, footer a {
+  font-weight: 600;
+  text-decoration: underline;
+  text-decoration-color: var(--contrast-low);
+  text-underline-offset: .25rem;
+
+  // `:focus` is linked to `:hover` for basic accessibility
+  &:hover,
+  &:focus {
+    text-decoration-color: var(--contrast-high);
+  }
+}
+
+img {
+  display: block;
+  max-width: 100%;
+  margin-bottom: var(--spacer);
+  border-radius: var(--border-radius);
+}
+
+table {
+  margin-bottom: var(--spacer);
+  width: 100%;
+  border: 0 solid var(--contrast-med-low);
+  border-collapse: collapse;
+}
+
+td,
+th {
+  padding: .25rem .5rem;
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+  border-bottom-width: 1px;
+}
+
+th {
+  text-align: left;
+}
+
+thead th {
+  border-bottom-color: currentColor;
+}
+
+mark {
+  padding: .15rem;
+  background-color: var(--text-highlight-bg);
+  border-radius: .125rem;
+}

data/_sass/_components.scss

@@ -0,0 +1,30 @@
+// Components
+// 
+// Misc components around the site
+
+// Show alert messages to users. You may add it to single elements like a `<p>`,
+// or to a parent if there are multiple elements to show.
+.alert {
+  padding: var(--spacer);
+  margin-top: var(--spacer);
+  margin-bottom: var(--spacer);
+  color: var(--dark-5);
+  background-color: var(--alert);
+  border-radius: var(--border-radius);
+}
+
+// Table of Contents
+#markdown-toc {
+  padding: var(--spacer-2) var(--spacer-3);
+  margin-bottom: var(--spacer-2);
+  border: solid var(--contrast-med-low);
+  border-width: 1px 0;
+
+  &::before {
+    display: block;
+    margin-left: calc(var(--spacer-3) * -1);
+    content: "Contents";
+    font-size: 85%;
+    font-weight: 500;
+  }
+}

data/_sass/_home.scss

@@ -0,0 +1,72 @@
+@use 'variables';
+@use 'mixins' as *;
+
+section {
+  margin-bottom: var(--spacer-3);
+}
+
+.about {
+  h1 {
+    margin-top: 0;
+  }
+
+  img {
+    width: 192px;
+    height: 192px;
+    border-radius: 50%;
+    margin-bottom: 2rem;
+    object-fit: cover;
+  }
+
+  p {
+    margin-bottom: 1.6rem;
+
+    @media (min-width: variables.$breakpoint-lg) {
+      margin-right:1rem
+    }
+  }
+}
+
+.social-links {
+  padding-left: 0;
+  margin-bottom: 3rem;
+
+  li {
+    padding-inline: 0;
+    list-style-type: none;
+
+    a {
+      display: inline-flex;
+      align-items: center;
+      gap: .25rem;
+    }
+
+    svg {
+      width: 1em;
+      height: 1em;
+      vertical-align: -.125em;
+      fill: currentColor;
+      margin-right: .25rem;
+      color: var(--contrast-med-low);
+    }
+  }
+
+  @media (max-width: variables.$breakpoint-md) {
+    @include inline-flex;
+    margin-bottom: 0;
+  }
+}
+
+@media (min-width: variables.$breakpoint-md) {
+    .home {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr);
+        grid-gap: 1.75rem
+    }
+
+    .archive {
+        grid-column-start: 2;
+        grid-column-end: 4
+    }
+}
+