Oliver Pattison opattison

## jekyll-css-yaml-colors.css
---
white:
  hsl: 'hsla(138, 10%, 98%, 1)'
  hex: '#f9fafa'
black:
  hsl: 'hsla(138, 16%, 10%, 1)'
  hex: '#151e18'
green:
  hsl: 'hsla(138, 39%, 54%, 1)'
  hex: '#5cb777'

## key_with_multiple_lines_preserved.yaml
# How to preserve multiple YAML lines with newlines (for example, to pass through a Markdown filter in Jekyll)
# via: http://stackoverflow.com/questions/3790454/in-yaml-how-do-i-break-a-string-over-multiple-lines
key: |+
  Hello.

  World.

# Output if processed with Markdown:
# '<p>hello</p><p>world</p>'

## figure.rb
# Title: Figure/image tag plugin for Jekyll
# Author: Oliver Pattison | http://oliverpattison.org
# Description: Create figure/img HTML blocks with optional classes and captions. This is a YAML-dependent Liquid tag plugin for Jekyll for those who fear link rot.
#
# Download/source/issues: https://github.com/opattison/jekyll-figure-image-tag
# Documentation: https://github.com/opattison/jekyll-figure-image-tag/blob/master/README.md
#
# Note: designed specifically for implementations with YAML front matter-based images, captions and alt text.
# Create YAML collections in a post like this:
#

## gallery.html
<!doctype html>
<html lang="en">
<body>
  <article class="gallery" role="main">
    <section class="photos">
      {% for image in page.image %} <!-- Loop through the photos from the YAML frontmatter from an empty Jekyll post -->
      <figure>
        <img src="{{ page.image[forloop.index0] }}" alt="{{ page.image-alt[forloop.index0] }}"> <!-- Insert the src, the alt text for each image, using the forloop.index0 liquid helper -->
      </figure>
      <figcaption>{{ page.image-caption[forloop.index0] }}</figcaption> <!-- and the figcaption too -->

## 2016-02-13-example.md

      
              3 files
            
          
              0 forks
            
          
              0 comments
            
          
              1 star
            
          
                opattison
                / 2016-02-13-example.md
            
            
              Last active
              April 25, 2016 20:34
            
              
                Jekyll srcset imgix implementation with include file, srcset/sizes in config, YAML-provided images, and temporarily assigned variables
              
          
  title
  image
  
  
  example srcset implementation
  
  
  src
  alt
  
  
  /images/example.jpg
  Don’t forget alt text.
  
  
{% assign image = page.image[0] %}
{% include srcset.html %}

  
## atom-git-color-override.less
// include in user `styles.less` “your stylesheet”

 @color-status-modified: hsl(22, 50%, 44%);
 @color-status-added: hsl(144, 50%, 35%);
 @color-status-ignored: hsl(200, 3%, 55%);

// Custom git override styles for Atom tree view
.tree-view {
  .status-modified,
  .list-tree li.list-nested-item.status-modified > .list-item {

## 2016-03-17-hosting-cost.md

      
              1 file
            
          
              0 forks
            
          
              1 comment
            
          
              0 stars
            
          
                opattison
                / 2016-03-17-hosting-cost.md
            
            
              Last active
              March 18, 2016 02:05
            
          
    Chatting with Michael Lee about my [previous post on what Jekyll is and why I use it]({% post_url 2016-03-16-consider-jekyll %}), I realized more should be said about how affordable static sites can be. From my own experience, here are some cost estimates for hosting a small site (in US dollars):

GitHub Pages: completely free (fewer Jekyll Ruby plugins allowed than a normal Jekyll deployment, but enables automatic deploying).
Amazon S3: starting at $0.03 to a few dollars per month for higher traffic (rate depends on usage). [^1]
S3 with Route53 for DNS routing: starting at $0.53 to a few dollars per month.
S3, Route53 and CloudFront: starting at $0.70 to a few dollars per month. My own site costs around $1.50 per month with this setup in early 2016.
[Shared hosting](https://en.wikipe


## jekyll-css-yaml-includes.css
---
# No YAML required. Blank front matter so that CSS files can be included via Liquid templating.
# Make sure that the breaks are included at the start of the file so that Jekyll knows to process the Liquid includes.
---

{% include reset.css %}
{% include base.css %}
{% include project.css %}

## Rakefile
require 'stringex'

# rake command that generates a new post and opens in default text editor
desc "Generates a new note"
task :post, :title do |t, name|
  if name.title
    title = name.title
  else
    title = get_stdin("Enter a title: ")
  end

## aws-s3-policy-with-ip-limit.json
{
  "Version": "2008-10-17",
  "Statement": [
    {
      "Sid": "AddPermissions",
      "Effect": "Allow",
      "Principal": {
        "AWS": "*"
      },
      "Action": "s3:GetObject",
	---
	white:
	hsl: 'hsla(138, 10%, 98%, 1)'
	hex: '#f9fafa'
	black:
	hsl: 'hsla(138, 16%, 10%, 1)'
	hex: '#151e18'
	green:
	hsl: 'hsla(138, 39%, 54%, 1)'
	hex: '#5cb777'
	# How to preserve multiple YAML lines with newlines (for example, to pass through a Markdown filter in Jekyll)
	# via: http://stackoverflow.com/questions/3790454/in-yaml-how-do-i-break-a-string-over-multiple-lines
	key: \|+
	Hello.

	World.

	# Output if processed with Markdown:
	# '<p>hello</p><p>world</p>'
	# Title: Figure/image tag plugin for Jekyll
	# Author: Oliver Pattison \| http://oliverpattison.org
	# Description: Create figure/img HTML blocks with optional classes and captions. This is a YAML-dependent Liquid tag plugin for Jekyll for those who fear link rot.
	#
	# Download/source/issues: https://github.com/opattison/jekyll-figure-image-tag
	# Documentation: https://github.com/opattison/jekyll-figure-image-tag/blob/master/README.md
	#
	# Note: designed specifically for implementations with YAML front matter-based images, captions and alt text.
	# Create YAML collections in a post like this:
	#
	<!doctype html>
	<html lang="en">
	<body>
	<article class="gallery" role="main">
	<section class="photos">
	{% for image in page.image %} <!-- Loop through the photos from the YAML frontmatter from an empty Jekyll post -->
	<figure>
	<img src="{{ page.image[forloop.index0] }}" alt="{{ page.image-alt[forloop.index0] }}"> <!-- Insert the src, the alt text for each image, using the forloop.index0 liquid helper -->
	</figure>
	<figcaption>{{ page.image-caption[forloop.index0] }}</figcaption> <!-- and the figcaption too -->
	// include in user `styles.less` “your stylesheet”

	@color-status-modified: hsl(22, 50%, 44%);
	@color-status-added: hsl(144, 50%, 35%);
	@color-status-ignored: hsl(200, 3%, 55%);

	// Custom git override styles for Atom tree view
	.tree-view {
	.status-modified,
	.list-tree li.list-nested-item.status-modified > .list-item {
	---
	# No YAML required. Blank front matter so that CSS files can be included via Liquid templating.
	# Make sure that the breaks are included at the start of the file so that Jekyll knows to process the Liquid includes.
	---

	{% include reset.css %}
	{% include base.css %}
	{% include project.css %}
	require 'stringex'

	# rake command that generates a new post and opens in default text editor
	desc "Generates a new note"
	task :post, :title do \|t, name\|
	if name.title
	title = name.title
	else
	title = get_stdin("Enter a title: ")
	end
	{
	"Version": "2008-10-17",
	"Statement": [
	{
	"Sid": "AddPermissions",
	"Effect": "Allow",
	"Principal": {
	"AWS": "*"
	},
	"Action": "s3:GetObject",