init

2019-07-21 22:16:23 -04:00 · 2019-07-21 22:16:23 -04:00 · 8853b7c668
commit 8853b7c668
48 changed files with 1682 additions and 0 deletions
--- a/.DS_Store
+++ b/.DS_Store
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,5 @@
+/*.gem
+/.bundle
+/.sass-cache
+/_site
+/Gemfile.lock
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -0,0 +1,6 @@
+# CHANGELOG
+
+- *Ver 0.1.x*: Initial development versions. Never released.
+- *Ver 0.2.x*: Public beta releases. Primarily for internal use.
+- *Ver 0.3.x*: Public beta releases for general use.
+- *Ver 1.0.0*: General release.
--- a/13
+++ b/13
@ -0,0 +1,13 @@
+# frozen_string_literal: true
+
+source "https://rubygems.org"
+gemspec
+
+group :jekyll_plugins do
+  gem 'jekyll-tidy'
+  gem 'jekyll-tagging'
+  gem 'jekyll-mentions'
+  gem 'jekyll-sitemap'
+  gem 'jekyll-feed'
+  gem 'jekyll-seo-tag'
+end
--- a/LICENSE.txt
+++ b/LICENSE.txt
@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2019 
+
+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.
--- a/README.md
+++ b/README.md
@ -0,0 +1,54 @@
+# jekyll-theme-isabelline
+
+Welcome to your new Jekyll theme! In this directory, you'll find the files you need to be able to package up your theme into a gem. Put your layouts in `_layouts`, your includes in `_includes`, your sass files in `_sass` and any other assets in `assets`.
+
+To experiment with this code, add some sample content and run `bundle exec jekyll serve` – this directory is setup just like a Jekyll site!
+
+TODO: Delete this and the text above, and describe your gem
+
+
+## Installation
+
+Add this line to your Jekyll site's `Gemfile`:
+
+```ruby
+gem "jekyll-theme-isabelline"
+```
+
+And add this line to your Jekyll site's `_config.yml`:
+
+```yaml
+theme: jekyll-theme-isabelline
+```
+
+And then execute:
+
+    $ bundle
+
+Or install it yourself as:
+
+    $ gem install jekyll-theme-isabelline
+
+## Usage
+
+This theme supports pages, posts and blogs. Unlike posts, blogs can be setup to not show the date of the post in the article's URL.
+
+Theme can be configured by tweaking `_sass/_config.scss`. All colors are derived from `$hue`. Although you can tweak individual colors to your liking further down the config file.
+
+## Contributing
+
+Bug reports and pull requests are welcome on GitHub at https://github.com/rzen/jekyll-theme-isabelline. This project is intended to be a safe, welcoming space for collaboration, and contributors are expected to adhere to the [Contributor Covenant](http://contributor-covenant.org) code of conduct.
+
+## Development
+
+To set up your environment to develop this theme, run `bundle install`.
+
+Your theme is setup just like a normal Jekyll site! To test your theme, run `bundle exec jekyll serve` and open your browser at `http://localhost:4000`. This starts a Jekyll server using your theme. Add pages, documents, data, etc. like normal to test your theme's contents. As you make modifications to your theme and to your content, your site will regenerate and you should see the changes in the browser after a refresh, just like normal.
+
+When your theme is released, only the files in `_layouts`, `_includes`, `_sass` and `assets` tracked with Git will be bundled.
+To add a custom directory to your theme-gem, please edit the regexp in `jekyll-theme-isabelline.gemspec` accordingly.
+
+## License
+
+The theme is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
+
--- a/_blog/example.md
+++ b/_blog/example.md
@ -0,0 +1,17 @@
+---
+title: This is an example blog post
+layout: post
+date: 2019-07-21
+tags: example deleteme
+---
+
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris ut blandit est. Nullam porta sem nec vehicula auctor. Proin venenatis sit amet ligula non rhoncus. Ut dignissim, ante lobortis gravida ullamcorper, metus diam aliquam mauris, non blandit nulla ligula vulputate nibh. In hac habitasse platea dictumst. Ut ac mi arcu. In hac habitasse platea dictumst. Mauris lobortis neque eu aliquam vestibulum. Nullam at maximus libero.
+
+Etiam mollis ultricies justo, posuere eleifend velit. Sed placerat, mi vitae bibendum aliquam, mi ipsum elementum lorem, eget congue eros purus eget lectus. Cras ac sem neque. Quisque congue tortor eget arcu mattis, eget semper lectus rhoncus. Pellentesque eu quam at orci vulputate porta sed fringilla nulla. Morbi tempor blandit leo condimentum gravida. Vivamus tincidunt dapibus est ac facilisis. Mauris gravida nisi urna, eu luctus nulla ultricies et.
+
+Morbi orci diam, semper et mauris quis, maximus luctus mi. Morbi vel eros dolor. Suspendisse vitae dapibus leo, eget imperdiet dui. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed vitae dictum massa. Nulla facilisi. Sed aliquet, orci a dignissim lobortis, libero justo elementum mi, id tincidunt justo orci elementum ligula. Pellentesque viverra quam nec diam faucibus sodales. In massa erat, sagittis a eros quis, aliquet volutpat ex. Morbi semper dictum turpis, in ornare metus consequat ac. Praesent vehicula risus id mi sollicitudin rutrum et nec dui.
+
+Vivamus vitae viverra quam, at condimentum nunc. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla laoreet eget leo sit amet porttitor. Cras varius ut lorem eget ullamcorper. Donec ut mauris ut magna varius euismod. Sed auctor fringilla velit non tristique. In eu accumsan sem. Morbi luctus sed nulla id fringilla. Proin sit amet quam ac libero interdum bibendum eu id nisl. Ut commodo est eget mi rutrum, quis viverra augue vehicula. Nam tempus ante et metus tempor aliquet. Nullam sit amet consectetur urna, et rhoncus magna. Curabitur at risus a mi pellentesque pulvinar et ac sem. Vestibulum porttitor dolor et lorem vulputate tincidunt. Aliquam in suscipit massa. Maecenas nec condimentum enim.
+
+Vivamus efficitur ac sapien sit amet mollis. Aenean volutpat viverra elit, a venenatis elit finibus sit amet. Nulla rhoncus justo dolor, condimentum bibendum quam luctus in. Proin orci nibh, commodo vel aliquam non, convallis nec lorem. Praesent tristique orci ante, quis molestie dui interdum volutpat. Quisque dolor sapien, ornare eu euismod non, sollicitudin non tellus. Praesent dui orci, ultrices ut placerat id, consectetur eget mauris. Phasellus consectetur tellus est, ut ullamcorper eros finibus quis. Morbi convallis mi sit amet malesuada sollicitudin. Donec vestibulum velit id interdum mattis. Pellentesque eget venenatis nibh. Duis eleifend neque sollicitudin, pulvinar ex eu, sagittis nibh.
+
--- a/_config.yaml
+++ b/_config.yaml
@ -0,0 +1,98 @@
+# title of this site
+title: SAMPLE BLOG
+
+# subtitle
+# TODO: 
+subtitle: Sample Subtitle
+
+# site description
+description: Sample description
+
+# used on the home page's title tag
+tagline: Sample tagline
+
+baseurl: ""
+url: "https://rzen.dev"
+
+# used in footer
+copyright_owner:
+  full_name: Your Name
+  short_name: your_short_name
+  email: youremail@example.com
+
+# default author's name
+author:
+  short_name: your_short_name
+  full_name: Your Full Name
+  email: youremail at example dot com
+
+collections:
+  blog:
+    permalink: /:collection/:title/
+    output: true
+  links:
+    permalink: /link/:title/
+    output: true
+  posts:
+    permalink: /post/:title/
+    output: true
+  pages:
+    permalink: /:title/
+    output: true
+  private:
+    permalink: /:collection/:title/
+    output: true
+
+defaults:
+  - scope:
+      type: blog
+    values:
+      layout: post
+
+plugins:
+  - rouge
+  # - jekyll-tidy
+  - jekyll/tagging
+  - jekyll-mentions
+  - jekyll-sitemap
+  - jekyll-feed
+  - jekyll-seo-tag  # https://github.com/jekyll/jekyll-seo-tag
+
+# tag_page_layout: tag_page
+# tag_page_dir: tag
+
+# tag_page: /tags/
+# category_page: /categories/
+# tag_permalink_style: pretty
+
+tag_page_layout: tags
+tag_page_dir: tags
+
+kramdown:
+  auto_ids: false
+  syntax_highlighter_opts:
+    block:
+      default_lang: javascript
+      line_numbers: true
+    span:
+      line_numbers: false
+
+jekyll_tidy:
+  compress_html: true
+
+sass:
+  sass_dir: _sass
+  style: compressed
+
+include: ["_pages"]
+
+# dont move the following to _site/
+exclude: ["docker-compose.yaml", "docker", "Gemfile.lock", "Gemfile"]
+
+tz: America/New York
+
+# used for edit link in the footer
+edit_url: https://github.com/path_to_repo/_edit/master/
+
+# google_analytics_token: 'UA-00000000-1' # leave blank if you don't want google analytics
+# disqus_short_name: 'your_short_name' # leave blank if you don't want disqus
--- a/_includes/footer.html
+++ b/_includes/footer.html
@ -0,0 +1,24 @@
+
+<footer>
+   <nav>
+      <p>
+         <span class="copy">&copy;</span> {{ 'now' | date: '%Y' }} {{ site.copyright_owner.full_name }}. 
+         <a href="/legal/">MIT License</a>. 
+         <a class="edit" href="{{ site.edit_url | append: page.path }}">Edit</a>.
+         <!-- {% if page.id == blank %}
+            Site generated {{ site.time | date: "%a, %b %d, %Y" }}
+         {% endif %} -->
+      </p>
+      <p>{{ page.id }}</p>
+   </nav>
+   <nav>
+      <p class="mode"></p>
+   </nav>
+   <!-- <style>
+      @import url('https://fonts.googleapis.com/css?family=Bree+Serif');
+   </style> -->
+</footer>
+
+<div id="snackbar">Loading...</div>
+<!-- <script src='/assets/js/slides.js'></script> -->
+<script src='/assets/js/clipboard.js'></script>
--- a/_includes/google_analytics.html
+++ b/_includes/google_analytics.html
@ -0,0 +1,11 @@
+{% if site.google_analytics_token %}
+<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
+<script>
+   (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+    (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+    m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+    })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+ga('create', '{{ site.google_analytics_token }}', 'auto');
+ga('send', 'pageview');
+</script>
+{% endif %}
--- a/_includes/head-meta.html
+++ b/_includes/head-meta.html
@ -0,0 +1,22 @@
+<meta charset="utf-8" />
+<meta http-equiv="X-UA-Compatible" content="IE=edge">
+
+<meta name="viewport" content="width=device-width, initial-scale=1">
+
+{% if page.description %}
+	<meta name="description" content="{{ page.description }}" />
+{% else if site.description %}
+	<meta name="description" content="{{ site.description }}" />
+{% endif %}
+
+<!-- favicons & more -->
+<link rel="shortcut icon" href="{{ site.baseurl }}/assets/favicon/favicon.ico">
+<link rel="apple-touch-icon" href="{{ site.baseurl }}/assets/favicon/iphone.png">
+<link rel="apple-touch-icon" sizes="180x180" href="{{ site.baseurl }}/assets/favicon/iphone-6plus.png">  
+<link rel="apple-touch-icon" sizes="152x152" href="{{ site.baseurl }}/assets/favicon/ipad-retina.png">  
+<link rel="apple-touch-icon" sizes="167x167" href="{{ site.baseurl }}/assets/favicon/ipad-pro.png">  
+
+<!-- feeds -->
+<link rel="alternate" type="application/rss+xml" title="RSS" href="{{ site.baseurl }}/feed.xml">
+
+<!-- TODO: should add more extensive yet sensible rel meta -->
--- a/_includes/head.html
+++ b/_includes/head.html
@ -0,0 +1,11 @@
+<head>
+	{% include head-meta.html %}
+	<title>
+		{% if page.title == "Home" %}
+			{{ site.title }} &middot; {{ site.tagline }}
+		{% else %}
+			{{ page.title }} &middot; {{ site.title }}
+		{% endif %}
+	</title>
+	<link rel="stylesheet" href="{{ site.baseurl }}/assets/css/style.css">
+</head>
--- a/_includes/header.html
+++ b/_includes/header.html
@ -0,0 +1,15 @@
+<header>
+	<nav>
+		<ul>
+			<li><a href="{{ site.baseurl | append: '/' }}">Home</a>
+			{% if jekyll.environment == 'local' %}
+				<li><a href="{{ site.baseurl | append: '/private/' }}">Private</a>
+			{% endif %}
+			{% for page in site.pages | sort: 'sort_order', 'title' %}
+				{% if page.categories contains 'global' %}
+					<li><a href="{{ site.baseurl | append: page.url }}">{{ page.title }}</a>
+				{% endif %}
+			{% endfor %}
+		</ul>
+	</nav>
+</header>
--- a/_includes/image.html
+++ b/_includes/image.html
@ -0,0 +1,17 @@
+{% capture imagePath %}{{ page.id | split: "/" | last }}/{{ include.name }}{% endcapture %}
+
+{% if include.frame == false %}
+	{% assign frame = false %}
+{% else %}
+	{% assign frame = true %}
+{% endif %}
+
+<figure class="figure {% if include.caption %}figure-caption{% endif %} {% if frame %}figure--frame{% endif %}">
+	<div class="figure__inner">
+		<img Xwidth="100%" class="figure__image" src="/assets/blog/{{ imagePath }}" {% if include.alt %} alt="{{ include.alt }}" {% endif %} {% if include.width %} width="{{ include.width }}" {% endif %}/>
+	
+		{% if include.caption %}
+			<figcaption class="figure__caption">{{ include.caption }} {% if include.source %}<a class="source" href="{{ include.source }}" title="{{ include.source }}">Source</a>.{% endif %}</figcaption>
+		{% endif %}
+	</div>
+</figure>
--- a/_includes/post_index.html
+++ b/_includes/post_index.html
@ -0,0 +1,35 @@
+{% if include.title == blank %}
+	<h1>{{ include.posts | size }} blogs since {{ include.posts | sort: 'date' | map: 'date' | compact | first | date: '%Y' }}</h1>
+{% else if %}
+	<h1>{{ include.title }}</h1>
+{% endif %}
+
+{% assign prev_year = 'first run' %}
+{% assign sorted_posts = include.posts | sort: "date" | reverse %}
+{% for post in sorted_posts %}
+
+	{% assign current_year = post.date | date: "%Y" %}
+
+	{% if current_year != prev_year %}
+		{% if prev_year != 'first run' %}
+			</ul>
+		{% endif %}
+		{% assign prev_year = current_year %}
+		<h2 class="year">{{ current_year | default: '<em>undated</em>' }}</h2>
+		<ul class="index">
+	{% endif %}
+
+	<li>
+		<a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a>
+		<span class="posted">{{ post.date | date: "%b %-d" }}</span>
+		{% if jekyll.environment == "local" %}
+			<span class="badge collection {{ post.collection }}">{{ post.collection }}</span>
+			{% if post.draft %}
+				<span class="badge draft">draft</span>
+			{% endif %}
+		{% endif %}
+	</li>
+
+	{% if current_year != date %}
+	{% endif %}
+{% endfor %}
--- a/_layouts/.DS_Store
+++ b/_layouts/.DS_Store
--- a/_layouts/base.html
+++ b/_layouts/base.html
@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="{{page.lang | default:"en"}}">
+	{% include head.html %}
+	<body>
+		{% include header.html %}
+		{{ content 
+			| replace: '<!--qed-->', ' <span class=qed>&#8718;</span>'
+			| replace: '\=\>', '&#8658;'
+		}}
+		{% include footer.html %}
+		{% include google_analytics.html %}
+		<!-- Page generated {{ site.time }} -->
+		<!-- Page ID {{ page.id }} -->
+	</body>
+</html>
--- a/_layouts/page.html
+++ b/_layouts/page.html
@ -0,0 +1,8 @@
+---
+layout: base
+---
+<main>
+	<article>
+	  {{ content }}
+	</article>
+</main>
--- a/_layouts/post.html
+++ b/_layouts/post.html
@ -0,0 +1,9 @@
+---
+layout: base
+---
+<main>
+	<article>
+		<h1>{{ page.title }}</h1>
+		{{ content }}
+	</article>
+</main>
--- a/_layouts/tags.html
+++ b/_layouts/tags.html
@ -0,0 +1,48 @@
+---
+layout: base
+---
+<main>
+
+	<h1>{{ page.tag }}</h1>
+
+	<table>
+		<tbody>
+
+			<tr>
+				<td width="60%" cellpadding=10>
+
+					{% assign prev_year = 'first run' %}
+					{% assign sorted_posts = page.posts | sort: "date" | reverse %}
+					{% for post in sorted_posts %}
+
+						{% assign current_year = post.date | date: "%Y" %}
+
+						{% if current_year != prev_year %}
+							{% if prev_year != 'first run' %}
+								</ul>
+							{% endif %}
+							{% assign prev_year = current_year %}
+							<h2 class="year">{{ current_year | default: '<em>undated</em>' }}</h2>
+							<ul class="index">
+						{% endif %}
+
+						<li><a href="{{ site.baseurl }}{{ post.url }}">{{ post.title }}</a><span class="posted">{{ post.date | date: "%b %-d" }}</span></li>
+
+						{% if current_year != date %}
+						{% endif %}
+
+					{% endfor %}
+
+				</td>
+
+				<td>
+					<div id="tag-cloud">
+					  {{ site | tag_cloud }}
+					</div>
+				</td>
+			</tr>
+
+		</tbody>
+	</table>
+</main>
+
--- a/_pages/about.md
+++ b/_pages/about.md
@ -0,0 +1,10 @@
+---
+layout: page
+title: About
+permalink: /about/
+sort_order: 0
+categories: global about
+---
+# About
+
+WIP
--- a/_pages/resources.md
+++ b/_pages/resources.md
@ -0,0 +1,11 @@
+---
+layout: page
+title: Resources
+permalink: /about/
+categories: home
+---
+# Resources
+
+- [Git](https://git.rzen.dev)
+- [Nexus](https://nexus.rzen.dev) (also [docker registry](https://docker.rzen.dev) and [maven repo](https://maven.rzen.dev))
+- [CI/CD](https://ci.rzen.dev)
--- a/_sass/_config.scss
+++ b/_sass/_config.scss
@ -0,0 +1,81 @@
+// config
+
+//   0° red
+//  60° yellow
+// 120° green
+// 180° cyan
+// 240° blue
+
+// Isabelline
+// https://html-color.codes/hex/f4f0ec
+// hsl(30, 26.67%, 94.12%)
+
+// base hue
+$hue: 30;
+
+// TODO
+$drop-caps: false;
+
+// layout
+$mobile-breakpoint-max-width: 500px;
+$tablet-breakpoint-max-width: 800px;
+$desktop-breakpoint-min-width: 801px;
+
+// color theming
+$link-color: hsl($hue,50,30);
+$link-active-color: lighten($link-color,10%);
+$link-hover-color: lighten($link-color,10%);
+$link-visited-color: darken($link-color,10%);
+
+$selection-color: hsl($hue,75,90);
+$selection-background-color: hsl($hue,100,30);
+
+$body-color: black;
+$body-background-color: hsl($hue,3,96); // hsl($hue,25,95);
+
+// see the bottom of _layouts/base.html
+// @import url('https://fonts.googleapis.com/css?family=Bree+Serif');
+
+$sans-serif: Helvetica, Arial, sans-serif;
+$serif: xGeorgia, Times, serif;
+
+$header-serif: "Bree Serif",$serif;
+$body-serif: "Bree Serif",$serif;
+$header-color: darken($body-background-color,80%);
+$header-link-color: darken($body-background-color,70%);
+
+$main-link-color: darken($body-background-color,80%);
+$main-heading-color: hsl($hue,50,30);
+$main-aside-color: hsl($hue,70,30);
+$main-blockquote-color: hsl($hue,70,30);
+$main-blockquote-before-color: hsl($hue,50,80);
+$main-index-color: hsl($hue,20,50);
+$main-dropcaps-color: hsl($hue,90,50);
+$main-dropcaps-font-size: 3em;
+$main-table-header-bg-color: darken($body-background-color,10%);
+
+
+$footer-color: hsl($hue,10,50);
+$footer-link-color: lighten($footer-color,10%);
+$footer-serif: $serif;
+
+
+// 
+$local-google-fonts: true;  // TODO
+
+/* latin-ext */
+@font-face {
+  font-family: 'Bree Serif';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Bree Serif Regular'), local('BreeSerif-Regular'), url(../fonts/BreeSerif-Regular-Pw.woff2) format('woff2');
+  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+}
+/* latin */
+@font-face {
+  font-family: 'Bree Serif';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Bree Serif Regular'), local('BreeSerif-Regular'), url(../fonts/BreeSerif-Regular.woff2) format('woff2');
+  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+}
--- a/_sass/_mixins.scss
+++ b/_sass/_mixins.scss
@ -0,0 +1,9 @@
+@function complement($color,$offset: 180) {
+  @return ($color+$offset)%360
+}
+
+@mixin border-radius($radius: 0.5em) {
+  -webkit-border-radius: $radius;
+  -moz-border-radius: $radius;
+  border-radius: $radius;
+}
--- a/_sass/_normalize.scss
+++ b/_sass/_normalize.scss
@ -0,0 +1,341 @@
+/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+   ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in iOS.
+ */
+
+html {
+  line-height: 1.15; /* 1 */
+  -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+   ========================================================================== */
+
+/**
+ * Remove the margin in all browsers.
+ */
+
+body {
+  margin: 0;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+
+/* Grouping content
+   ========================================================================== */
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+  box-sizing: content-box; /* 1 */
+  height: 0; /* 1 */
+  overflow: visible; /* 2 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+   ========================================================================== */
+
+/**
+ * Remove the gray background on active links in IE 10.
+ */
+
+a {
+  background-color: transparent;
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57-
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+  border-bottom: none; /* 1 */
+  text-decoration: underline; /* 2 */
+  text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+  font-family: monospace, monospace; /* 1 */
+  font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+  font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/* Embedded content
+   ========================================================================== */
+
+/**
+ * Remove the border on images inside links in IE 10.
+ */
+
+img {
+  border-style: none;
+}
+
+/* Forms
+   ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers.
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit; /* 1 */
+  font-size: 100%; /* 1 */
+  line-height: 1.15; /* 1 */
+  margin: 0; /* 2 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input { /* 1 */
+  overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select { /* 1 */
+  text-transform: none;
+}
+
+/**
+ * Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+  -webkit-appearance: button;
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type="button"]::-moz-focus-inner,
+[type="reset"]::-moz-focus-inner,
+[type="submit"]::-moz-focus-inner {
+  border-style: none;
+  padding: 0;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type="button"]:-moz-focusring,
+[type="reset"]:-moz-focusring,
+[type="submit"]:-moz-focusring {
+  outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+  padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ *    `fieldset` elements in all browsers.
+ */
+
+legend {
+  box-sizing: border-box; /* 1 */
+  color: inherit; /* 2 */
+  display: table; /* 1 */
+  max-width: 100%; /* 1 */
+  padding: 0; /* 3 */
+  white-space: normal; /* 1 */
+}
+
+/**
+ * Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+  vertical-align: baseline;
+}
+
+/**
+ * Remove the default vertical scrollbar in IE 10+.
+ */
+
+textarea {
+  overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10.
+ * 2. Remove the padding in IE 10.
+ */
+
+[type="checkbox"],
+[type="radio"] {
+  box-sizing: border-box; /* 1 */
+  padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type="search"] {
+  -webkit-appearance: textfield; /* 1 */
+  outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding in Chrome and Safari on macOS.
+ */
+
+[type="search"]::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button; /* 1 */
+  font: inherit; /* 2 */
+}
+
+/* Interactive
+   ========================================================================== */
+
+/*
+ * Add the correct display in Edge, IE 10+, and Firefox.
+ */
+
+details {
+  display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+  display: list-item;
+}
+
+/* Misc
+   ========================================================================== */
+
+/**
+ * Add the correct display in IE 10+.
+ */
+
+template {
+  display: none;
+}
+
+/**
+ * Add the correct display in IE 10.
+ */
+
+[hidden] {
+  display: none;
+}
--- a/_sass/_opine.scss
+++ b/_sass/_opine.scss
@ -0,0 +1,451 @@
+// print media exceptions
+@media print {
+	.mode, header nav, footer a.edit {
+		display: none;
+	}
+
+	main article aside {
+		margin-right: 0 !important;
+	}
+}
+
+// placeholder for responsive mode indication
+footer nav .mode {
+	font-size: 70%;
+	text-transform: uppercase;
+	color: lighten($footer-color, 50%);
+	&:before { content: '~'; }
+}
+
+// desktop
+@media all and (min-width: 801px) {
+	.mode:before {
+		content: 'Desktop' !important;
+	}
+}
+
+// tablet & mobile
+@media all and (max-width: 800px) {
+	body {
+		text-align: left !important;
+	}
+
+	main, header, footer {
+		width: 90% !important;
+		min-width: 300px !important;
+		margin: 0;
+	}
+
+	main article blockquote {
+		&:before {
+		    content: '' !important;
+	   	}
+	}
+
+	main ul.index li.year {
+		float: none !important;
+		text-align: left !important;
+		margin: .5em 0 0 0 !important;
+	}
+
+	main article aside {
+		margin-right: 0 !important;
+	}
+
+	// for tablet & mobile move year to top of ul of posts
+	main {
+		h2.year {
+			// clear: both;
+			float: none !important;
+			// width: 4.5em;
+			margin: 0 !important;
+			text-align: left !important;
+			font-size: 1.5em !important;
+			color: $main-heading-color !important;
+		}
+
+		ul.index {
+			margin-top: 0 !important;
+		}
+	}
+
+	.mode:before {
+		content: 'Tablet' !important;
+	}
+}
+
+// mobile
+@media all and (max-width: 500px) {
+	body {
+		text-align: left !important;
+	}
+
+	main, header, footer {
+		// font-size: 200%;
+		width: 95% !important;
+		min-width: 100px !important;
+		margin: 0;
+	}
+
+	.mode:before {
+		content: 'Mobile' !important;
+	}
+
+	main article aside {
+		margin-right: 0 !important;
+	}
+
+	footer nav p span.copy {
+		position: relative;
+		margin-left: 0;
+	}
+
+}
+
+::selection {
+	color: $selection-color;
+	background-color: $selection-background-color;
+}
+
+// size the width for comfortable reading
+main, header, footer {
+	width: 70%;
+	max-width: 700px;
+	margin: 0 auto;
+	clear: both;
+}
+
+body {
+	font-family: $serif;
+	font-size: 1.3em;
+	color: $body-color;
+	background-color: $body-background-color;
+}
+
+header {
+	nav {
+		color: $header-color;
+		font-family: $header-serif;
+		margin: .5em 0;
+		float: right;
+		
+		// site menu shows posts in "global" category
+		ul {
+			padding: 0;
+			margin: 0;
+			li {
+				color: $header-link-color;
+				list-style: none;
+				padding-left: .5rem;
+				display: inline-block;
+				
+				&:before { content: '\2022'; padding-right: .5rem; }
+				&:first-child:before { content: ''; padding-right: 0; }
+
+				a {
+					&, &:hover, &:active, &:visited {
+						text-decoration: none;
+						color: darken($header-link-color,20%);
+					}
+				}
+			}
+		}
+	}
+}
+
+// div.column {
+// 	width: 30%;
+// 	float: left;
+// 	padding: .5rem;
+// 	margin: .5rem;
+// 	border: 1px solid #ccc;
+// }
+
+// link styling
+a {
+	color: darken($link-color,15%);
+	&:hover, &:active, &:visited {
+		color: $link-color;
+	}
+}
+
+// main area of the page
+main {
+	p {
+		margin: 1em 0;
+		line-height: 1.2em; 
+	
+		code {
+			// TODO: need better styling
+			font-size: .9em;
+			background-color: white;
+			border: solid 1px #ccc;
+			border-radius: 3px;
+			padding: 0 .2em;
+		}
+	}
+
+	// figure is a composition of the image and caption
+	figure {
+		margin: 1em 0;
+		figcaption {
+			font-size: .8em;
+			text-align: center;
+			padding: .5rem;
+		}
+
+		img {
+			border-radius: 4px;
+			width: 100%;
+		}
+	}
+
+	// for slideshows show the first figure, hide rest
+	div.slideshow figure {
+		display: none;
+		&:first-child {
+			display: block;
+		}
+	}
+
+	// drop caps
+	// TODO: this needs work
+	@if $drop-caps {
+		h1, h2, h3, h4, h5 {
+			+ p:first-letter {
+				color: $main-dropcaps-color;
+				float: left;
+				font-family: $header-serif;
+				font-size: $main-dropcaps-font-size;
+				line-height: 60px;
+				padding-top: 4px;
+				padding-right: 8px;
+				padding-left: 3px;
+			}
+		}
+	}
+
+	h1,h2,h3,h4,h5 {
+		margin: 1em 0 .5em 0;
+		color: $main-heading-color;
+		font-family: $header-serif;
+		text-align: left;
+	}
+
+	// h4 should sit right on top of the paragraph
+	h4 {
+		margin-bottom: 0;
+		color: $body-color;
+	}
+	h4 + p { margin-top: .2em }  // .2em to match line height spacing
+
+	// ul.posts {
+	// 	padding-left: 0;
+	// 	li {
+	// 		list-style: none;
+	// 		padding-left: 0;
+	// 		margin-left: 0;
+	// 		margin-top: .5rem;
+	// 		margin-bottom: .5rem;
+	// 	}
+	// }
+
+	// styling for the main article
+	article {
+
+		// styling for in-article unordered lists
+		ul {
+			padding-left: 0;
+			li {
+				list-style: none;
+				padding-left: 1em;
+				padding-bottom: .2em;
+				margin-left: 0;
+				
+				// mdash for unordered list items
+				&::before {
+					content: "\2014";
+					margin-left: -1em;
+					margin-right: .2em;
+				}
+
+				// custom checkboxes for task list items
+				&.task-list-item {
+					padding-left: 1em;
+
+					&::before {
+						content: none;
+					}
+					& input::before {
+						content: "\2610";
+						padding-right: .3em;
+					}
+					& input[checked]::before {
+						content: "\2611";
+					}
+					& input {
+						appearance: none;
+						-moz-appearance: none;
+						-webkit-appearance: none;
+						margin-left: -1.2em;
+						height: 1em;
+					}
+				}
+
+
+			}
+		}
+		
+		// TODO: probably needs work
+		blockquote {
+			clear: both;
+			margin: .5rem 0;
+			padding: 0;
+			margin-left: 2em;
+			position: relative;
+			font-size: 1.2em;
+			font-style: italic;
+			
+			color: $main-blockquote-color;
+
+			&:before {
+			    content: '\201c';
+			    position: absolute;
+			    top: -.15em;
+			    left: -.7em;
+			    font-size: 4em;
+			    color: $main-blockquote-before-color;
+		   	}
+
+		   	:first-child { margin-top: 0; }
+		   	:last-child { margin-bottom: 0; }
+		}
+
+		// inset side note
+		aside {
+			clear: both;
+			float: right;
+			margin: 0 -20% 0 1rem;
+			padding: 0.5em 1rem;
+			position: relative;
+			font-size: .9em;
+			text-align: left;
+			width: 40%;
+			color: $main-aside-color;
+			border-left: 1px solid $main-aside-color;
+		}
+
+		> table {
+			width: 100%;
+			&, th, td {
+				border-collapse: collapse;
+				border: 1px solid $main-table-header-bg-color;
+			}
+			thead {
+				th {
+					font-weight: bold;
+					text-align: center;
+					background-color: $main-table-header-bg-color;
+					font-family: $sans-serif;
+					color: $body-color;
+					font-size: 80%;
+				}
+			}
+			th, td { padding: 7px; }
+		}
+
+		dt { font-weight: bold; }
+		dd { margin: 0 0 .5em 0; }
+
+		// styling for the QED brick
+		.qed { color: #ccc; }
+	}
+
+	// styling for years in the index timeline of posts
+	// TODO: hoist color to _config.sass
+	// TODO: shold better scope selector
+	h2.year {
+		clear: both;
+		color: hsl($hue,10,80);
+		float: left;
+		width: 4.5em;
+		margin: -.2em 0 0 -5em;
+		padding: 5px 0 0 0;
+		font-family: $header-serif;
+		font-size: 2em;
+		font-weight: normal;
+		text-align: right;
+	}
+
+	// styling for index of posts
+	ul.index {
+		padding-left: 0;
+
+		li {
+			padding: .5em 0 .3em 0;
+			list-style-type: none;
+			color: $main-index-color;
+			
+			a {
+				text-decoration: none;
+				&:hover {
+					text-decoration: underline;
+				}
+			}
+
+			// space posted date off post title
+			span.posted {
+				font-size: .8em;
+				margin-left: 1.2em;
+				&:before {
+					content: "\2014";
+					margin-left: -1em;
+					margin-right: .2em;
+				}
+			}
+		}
+	}
+}
+
+span.badge {
+	border-radius: 1em;
+	display: inline-block;
+	padding: 2px .5em;
+	margin-left: 1em;
+	font-size: 50%;
+	font-weight: bold;
+	color: white;
+	text-transform: uppercase;
+	font-family: $sans-serif;
+	
+	&.draft      { background: linear-gradient(hsl(0,90,60), hsl(0,90,40)); }
+	&.collection { background: linear-gradient(hsl(210,60,60), hsl(210,60,40)); }
+	&.private    { background: linear-gradient(hsl(20,10,40), hsl(20,10,20)); }
+	&.blog       { background: linear-gradient(hsl(280,90,60), hsl(280,90,40)); }
+}
+
+
+
+// site footer
+footer {
+	color: $footer-color;
+	font-size: 80%;
+	margin-top: 2em;
+	font-family: $footer-serif;
+	&, a, a:active, a:hover, a:visited { color: $footer-link-color }
+
+	// dont underline links in the footer
+	nav a {
+		text-decoration: none;
+		&:hover {
+			text-decoration: underline;
+		}
+	}
+
+	// hang copyright symbol
+	span.copy {
+		position: absolute;
+		margin-left: -1.2rem;
+	}
+
+}
--- a/_sass/_snackbar.scss
+++ b/_sass/_snackbar.scss
@ -0,0 +1,45 @@
+// from https://www.w3schools.com/howto/howto_js_snackbar.asp
+#snackbar {
+	visibility: hidden;
+	min-width: 250px;
+	margin-left: -125px; /* Divide value of min-width by 2 */
+	background: linear-gradient(hsl($hue,60,30), hsl($hue,60,20));
+	// background: linear-gradient(#930, #620);
+	// background: linear-gradient(#555, #333);
+	color: #fff;
+	text-align: center;
+	border-radius: 8px;
+	padding: 16px;
+	position: fixed;
+	z-index: 1;
+	left: 50%;
+	bottom: 30px;
+	font-family: $sans-serif;
+}
+
+#snackbar.show {
+	visibility: visible;
+	-moz-animation: fadein 0.5s, fadeout 0.5s 2.5s;
+	-webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
+	animation: fadein 0.5s, fadeout 0.5s 2.5s;
+}
+
+@-webkit-keyframes fadein {
+	from {bottom: 0; opacity: 0;} 
+	to {bottom: 30px; opacity: 1;}
+}
+
+@keyframes fadein {
+	from {bottom: 0; opacity: 0;}
+	to {bottom: 30px; opacity: 1;}
+}
+
+@-webkit-keyframes fadeout {
+	from {bottom: 30px; opacity: 1;} 
+	to {bottom: 0; opacity: 0;}
+}
+
+@keyframes fadeout {
+	from {bottom: 30px; opacity: 1;}
+	to {bottom: 0; opacity: 0;}
+}
--- a/_sass/_syntax.scss
+++ b/_sass/_syntax.scss
@ -0,0 +1,73 @@
+/***************
+  Darkly Pygments Theme
+  (c) 2014 Sourcey
+  http://sourcey.com
+***************/
+
+.rouge-gutter {
+  user-select: none;
+  -moz-user-select: none;
+  -khtml-user-select: none;
+  -webkit-user-select: none;
+  -o-user-select: none;
+}
+
+.highlight {
+  white-space: pre; 
+  overflow: auto;
+  word-wrap: normal; /* horizontal scrolling */
+  -moz-border-radius: 6px; 
+  -webkit-border-radius: 6px; 
+  border-radius: 6px;
+  padding: .5rem .5rem; 
+  background: #343642;
+  color: #C1C2C3;
+  
+  // &::-webkit-scrollbar {
+  //     background: transparent;  /* optional: just make scrollbar invisible */
+  //     width: 0px;  /* remove scrollbar space */
+  //     height: 0px;
+  // }
+  /* optional: show position indicator in red */
+  // &::-webkit-scrollbar-thumb {
+  //     //background: #FF0000;
+  // }
+
+
+  margin: 2rem 0;
+  
+  tab-size: 2rem;
+  
+  font-size: 1rem;
+  
+  .lineno {
+    text-align: right;
+    color: #777;
+    padding-right: .5rem;
+  }
+
+  pre {
+    margin: 0;
+    tab-size: 4;
+  }
+}
+.highlight .hll { background-color: #ffc; }
+.highlight .gd { color: #2e3436; background-color: #0e1416; }
+.highlight .gr { color: #eeeeec; background-color: #c00; }
+.highlight .gi { color: #babdb6; background-color: #1f2b2d; }
+.highlight .go { color: #2c3032; background-color: #2c3032; }
+.highlight .kt { color: #e3e7df; }
+.highlight .ni { color: #888a85; }
+.highlight .c,.highlight .cm,.highlight .c1,.highlight .cs { color: #8D9684; }
+.highlight .err,.highlight .g,.highlight .l,.highlight .n,.highlight .x,.highlight .p,.highlight .ge,
+.highlight .gp,.highlight .gs,.highlight .gt,.highlight .ld,.highlight .s,.highlight .nc,.highlight .nd,
+.highlight .ne,.highlight .nl,.highlight .nn,.highlight .nx,.highlight .py,.highlight .ow,.highlight .w,.highlight .sb,
+.highlight .sc,.highlight .sd,.highlight .s2,.highlight .se,.highlight .sh,.highlight .si,.highlight .sx,.highlight .sr,
+.highlight .s1,.highlight .ss,.highlight .bp { color: #C1C2C3; }
+.highlight .k,.highlight .kc,.highlight .kd,.highlight .kn,.highlight .kp,.highlight .kr,
+.highlight .nt { color: #729fcf; }
+.highlight .cp,.highlight .gh,.highlight .gu,.highlight .na,.highlight .nf { color: #E9A94B ; }
+.highlight .m,.highlight .nb,.highlight .no,.highlight .mf,.highlight .mh,.highlight .mi,.highlight .mo,
+.highlight .il { color: #8ae234; }
+.highlight .o { color: #989DAA; }
+.highlight .nv,.highlight .vc,.highlight .vg,.highlight .vi { color: #fff; }
--- a/assets/.DS_Store
+++ b/assets/.DS_Store
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@ -0,0 +1,9 @@
+---
+---
+
+@import "mixins";
+@import "config";
+@import "normalize";
+@import "opine";
+@import "snackbar";
+@import "syntax";
--- a/assets/docker-compose.yaml
+++ b/assets/docker-compose.yaml
@ -0,0 +1,30 @@
+# end user version of docker-compose
+version: '3'
+services:
+  jekyll-serve:
+    container_name: jekyll-serve
+    image: jekyll/jekyll
+    command: jekyll serve --future --draft --force_polling --livereload
+    environment:      
+      JEKYLL_ENV: local
+    ports:
+      - 4000:4000
+      - 35729:35729
+    volumes:
+      - .:/srv/jekyll
+
+  jekyll:
+    container_name: jekyll
+    image: jekyll/jekyll
+    entrypoint: jekyll
+    environment:      
+      JEKYLL_ENV: local
+    volumes:
+      - .:/srv/jekyll
+
+  bundle:
+    container_name: jekyll
+    image: jekyll/jekyll
+    entrypoint: bundle
+    volumes:
+      - .:/srv/jekyll
--- a/assets/favicon/README.md
+++ b/assets/favicon/README.md
@ -0,0 +1,4 @@
+README
+======
+
+Source: https://favicon.io/favicon-generator/
--- a/assets/favicon/android-chrome-192x192.png
+++ b/assets/favicon/android-chrome-192x192.png
--- a/assets/favicon/android-chrome-512x512.png
+++ b/assets/favicon/android-chrome-512x512.png
--- a/assets/favicon/apple-touch-icon.png
+++ b/assets/favicon/apple-touch-icon.png
--- a/assets/favicon/favicon-16x16.png
+++ b/assets/favicon/favicon-16x16.png
--- a/assets/favicon/favicon-32x32.png
+++ b/assets/favicon/favicon-32x32.png
--- a/assets/favicon/favicon.ico
+++ b/assets/favicon/favicon.ico
--- a/assets/favicon/site.webmanifest
+++ b/assets/favicon/site.webmanifest
@ -0,0 +1 @@
+{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
--- a/assets/fonts/BreeSerif-Regular-Pw.woff2
+++ b/assets/fonts/BreeSerif-Regular-Pw.woff2
--- a/assets/fonts/BreeSerif-Regular.woff2
+++ b/assets/fonts/BreeSerif-Regular.woff2
--- a/assets/js/clipboard.js
+++ b/assets/js/clipboard.js
@ -0,0 +1,28 @@
+// by github.com/rzen
+// attach to code blocks, copy to clipboard on click
+window.addEventListener('load', function () {
+	// TODO: move to a js module
+	let showSnackbar = text => {
+		let sbEl = document.getElementById("snackbar");
+
+		sbEl.className = 'show';
+		sbEl.innerText = text;
+		setTimeout(_ => sbEl.className = sbEl.className.replace('show', ''), 3000);
+	}
+
+	let getCodeEl = el => el.querySelector('.rouge-code pre');
+
+	let makeClipboardCopyFn = el => ev => {
+		navigator.clipboard.writeText((getCodeEl(el) || el).innerText)
+			.finally(_ => showSnackbar('Copied to clipboard!'));
+	}
+
+	let configCodeBlock = (el) => {
+		if (!getCodeEl(el)) return;  // skip inline code (TODO: should we?)
+		el.title = 'Click to copy';
+		el.style.cursor = 'pointer';
+		el.addEventListener('click', makeClipboardCopyFn(el));
+	}
+
+	document.querySelectorAll('.highlighter-rouge').forEach(el => configCodeBlock(el));
+});
--- a/assets/js/slides.js
+++ b/assets/js/slides.js
@ -0,0 +1,40 @@
+window.addEventListener('load', function () {
+	var slideIndex = 1;
+	showSlides(slideIndex);
+
+	// Next/previous controls
+	function plusSlides(n) {
+	  showSlides(slideIndex += n);
+	}
+
+	// Thumbnail image controls
+	function currentSlide(n) {
+	  showSlides(slideIndex = n);
+	}
+
+	function showSlides(n) {
+	  var i;
+	  var slides = document.getElementsByClassName("slide");
+	  var dots = document.getElementsByClassName("dot");
+	  if (n > slides.length) {slideIndex = 1} 
+	  if (n < 1) {slideIndex = slides.length}
+	  for (i = 0; i < slides.length; i++) {
+	      slides[i].style.display = "none"; 
+	  }
+	  // for (i = 0; i < dots.length; i++) {
+	  //     dots[i].className = dots[i].className.replace(" active", "");
+	  // }
+	  slides[slideIndex-1].style.display = "block"; 
+	  // dots[slideIndex-1].className += " active";
+	}
+
+	var slides = document.getElementsByClassName("slide");
+	for (i = 0; i < slides.length; i++) {
+		slides[i].style.cursor = 'pointer';
+		slides[i].addEventListener('click', function (el) {
+			plusSlides(1);
+			console.log(el)
+		}); 
+	}
+
+});
--- a/assets/js/snackbar.js
+++ b/assets/js/snackbar.js
@ -0,0 +1,19 @@
+// WIP
+Snackbar = {
+	snackBar: null,
+
+	init: function () {
+		this.snackBar = document.createElement('div');
+		this.snackBar.id = 'snackbar';
+	},
+
+	showSnackbar: function (text) {
+		let sbEl = document.getElementById("snackbar");
+
+		sbEl.className = 'show';
+		sbEl.innerText = text;
+		setTimeout(_ => sbEl.className = sbEl.className.replace('show', ''), 3000);
+	}
+}
+
+document.addEventListener('load', Snackbar.init);
--- a/docker-compose.yaml
+++ b/docker-compose.yaml
@ -0,0 +1,52 @@
+version: '3'
+services:
+  jekyll-serve:
+    container_name: jekyll-serve
+    image: jekyll/jekyll
+    command: jekyll serve --future --draft --force_polling --livereload
+    # command: bash -c "bundle install && bundle exec jekyll serve --watch --incremental --future --draft --force_polling --livereload"
+    environment:      
+      JEKYLL_ENV: local
+    # network_mode: host
+    ports:
+      - 4000:4000
+      - 35729:35729
+    volumes:
+      - .:/srv/jekyll
+
+  jekyll:
+    container_name: jekyll
+    image: jekyll/jekyll
+    entrypoint: jekyll
+    environment:      
+      JEKYLL_ENV: local
+    volumes:
+      - .:/srv/jekyll
+
+  gem-build:
+    container_name: jekyll-gem-build
+    image: jekyll/jekyll
+    command: gem build jekyll-theme-isabelline.gemspec
+    volumes:
+      - .:/srv/jekyll
+
+  gem-push:
+    container_name: jekyll-gem-push
+    image: jekyll/jekyll
+    command: gem push jekyll-theme-isabelline-${gem_version}.gem
+    volumes:
+      - .:/srv/jekyll
+
+  gem:
+    container_name: jekyll-gem
+    image: jekyll/jekyll
+    entrypoint: gem
+    volumes:
+      - .:/srv/jekyll
+
+  bundle:
+    container_name: jekyll
+    image: jekyll/jekyll
+    entrypoint: bundle
+    volumes:
+      - .:/srv/jekyll
--- a/index.html
+++ b/index.html
@ -0,0 +1,10 @@
+---
+layout: base
+title: Home
+---
+
+{% assign all_entries = site.blog | concat: site.posts | concat: site.links | concat: site.private | sort: "date" %}
+
+<main>
+	{% include post_index.html posts=all_entries %}
+</main>
--- a/jekyll-theme-isabelline.gemspec
+++ b/jekyll-theme-isabelline.gemspec
@ -0,0 +1,29 @@
+# frozen_string_literal: true
+
+Gem::Specification.new do |spec|
+  spec.name          = "jekyll-theme-isabelline"
+  spec.version       = "0.1.1"
+  spec.authors       = ["Rouslan Zenetl"]
+  spec.email         = ["rzenetl@gmail.com"]
+
+  spec.summary       = "Simple clean theme for long form blogging."
+  spec.homepage      = "https://github.com/rzen/jekyll-theme-isabelline"
+  spec.license       = "MIT"
+
+  spec.metadata["plugin_type"] = "theme"
+
+  spec.files         = `git ls-files -z`.split("\x0").select do |f|
+    print f
+    f.match(%r!^(assets|_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))!i)
+    # f.match(%r!^(assets|_(layouts|includes|sass|blog|)|LICENSE|README)!i)
+  end
+
+  # spec.files = `git ls-files -z`.split("\x0").select do |f|
+  #   f.match(%r!^(assets|_(includes|layouts|sass)/|(LICENSE|README)((\.(txt|md|markdown)|$)))!i)
+  # end
+
+  spec.add_runtime_dependency "jekyll", ">= 3.5", "< 5.0"  # TODO
+
+  spec.add_development_dependency "bundler"
+  # spec.add_development_dependency "rake", "~> 12.0"
+end
--- a/private.html
+++ b/private.html
@ -0,0 +1,10 @@
+---
+layout: base
+title: Private
+---
+
+<main>
+	{% if jekyll.environment == 'local' %}
+		{% include post_index.html posts=site.private title="Private Posts" %}
+	{% endif %}
+</main>
				`@ -0,0 +1 @@`
				`{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}`