pocket-theme 0.4.1

checksums.yaml

@@ -0,0 +1,7 @@
+---
+SHA256:
+  metadata.gz: 8baf4bb1ce56c013d61adb04ab135d392e53cc65927826c948b53906947a2da5
+  data.tar.gz: cbbf91764ede4e776d58ddc2048ac2bdb7e91c3f3cb0f0fbce661ded785b6a93
+SHA512:
+  metadata.gz: 832aa499bc97709c28293abbca20cfcd02ad0fdd123338b32cd55a622d6fdfad03e6d7935a24a3ac79c5c4346b38a94f4c1be1a276127052a9902bc3192bf414
+  data.tar.gz: d98de9aaf50e0ca3db2d3738d187aefe2340a70a68eb4ce7a63c3004465c6efb34c5f0402b132f087f07605fc8e73a87fe49f3dae705e9679483f817922c6ebc

data/LICENSE.txt

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2021 leonp
+
+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,2 @@
+# The Pocket theme for Jekyll
+

data/_config.yml

@@ -0,0 +1,56 @@
+title: "The Pocket theme for Jekyll"
+description: "Pocket is a really simple, easy to read, rock solid and ultra fast blogging theme for Jekyll."
+author: Leon Paternoster
+lang: "en" # or fr, de, es etc.
+baseurl: "" # the subpath of your site, e.g. /blog
+url: "" # the base hostname & protocol for your site, e.g. http://example.com
+
+# Include styles inline or link to css file?
+# This has to be set to css: inline for the theme to inline styles
+# Set it to anything else, or remove it, to link to /css/style.css
+css: external
+
+plugins:
+  - jekyll-sitemap
+  - jekyll-feed
+
+# Build settings
+markdown: kramdown
+sass:
+  style: compressed
+permalink: /:title/
+
+# Defaults
+# Use {% if page.is_post %} etc.
+defaults:
+-
+    scope:
+        path: "/"      # empty string for all files
+    values:
+        is_home: true
+-
+    scope:
+        path: ""
+        type: posts
+    values:
+        is_post: true
+        layout: post
+-
+    scope:
+        path: ""
+        type: pages
+    values:
+        is_page: true
+
+
+# Exclude from processing.
+# The following items will not be processed, by default. Create a custom list
+# to override the default setting.
+exclude:
+- Gemfile
+- Gemfile.lock
+- node_modules
+- vendor/bundle/
+- vendor/cache/
+- vendor/gems/
+- vendor/ruby/

data/_includes/annual-list.html

@@ -0,0 +1,34 @@
+{% for post in site.posts limit:include.post-limit | default:500 %}
+
+    {% capture this_year %}{{ post.date | date: "%Y" }}{% endcapture %}
+    {% capture next_year %}{{ post.previous.date | date: "%Y" }}{% endcapture %}
+
+    {% if forloop.first %}
+
+    <h2 class="c-lh-title mt4 mb2 f4">{{ this_year }}</h2>
+
+    <ul class="ma0 pa0 list">
+
+    {% endif %}
+
+        <li><a class="db" href="{{ post.url }}">{{ post.title }}</a><time class="db mb2 f6">{{ post.date | date: "%-d %b" }}</time></li>
+
+    {% if forloop.last %}
+
+    </ul>
+
+    {% else %}
+
+        {% if this_year != next_year %}
+
+        </ul>
+
+        <h2 class="c-lh-title mt4 mb2 f4">{{next_year}}</h2>
+
+        <ul class="ma0 pa0 list">
+
+        {% endif %}
+
+    {% endif %}
+
+{% endfor %}

data/_includes/archive-list.html

@@ -0,0 +1,51 @@
+{% assign items = paginator.posts %}
+
+{% for item in items %}
+
+  <div class="mv4">
+
+    <div class="flex flex-column-reverse mb2">
+
+      <h2 class="f5 f4-ns c-lh-title ma0"><a class="db c-link no-underline underline-hover" href="{{ item.url }}">{{ item.title }}</a></h2>
+
+      <p class="ma0 f6 mt0 mb2"><time datetime="{{ item.date | date: '%Y-%m-%d' }}">{{ item.date | date: "%-d %b, %Y" }}</time></p>
+
+    </div>
+
+  </div>
+
+{% endfor %}
+
+{% if paginator.total_pages > 1 %}
+
+<div class="pt4">
+
+    <div class="b f6 cf">
+
+        {% if paginator.next_page %}
+
+            <div class="w-50 fl pr3">
+
+              <a href="{{ paginator.next_page_path | prepend: site.baseurl }}">&larr; Older</a>
+
+            </div>
+
+        {% endif %}
+
+      {% if paginator.previous_page %}
+
+          <div class="w-50 fr tr pl3">
+
+            <a href="{{ paginator.previous_page_path | prepend: site.baseurl }}">Newer &rarr;</a>
+
+          </div>
+
+      {% endif %}
+
+    </div>
+
+    <p class="f6 mt0 tc">{{page.pagination_info.curr_page}}/{{page.pagination_info.total_pages}}</p>
+
+</div>
+
+{% endif %}

data/_includes/footer.html

@@ -0,0 +1,21 @@
+        </main>
+
+        {% if site.description %}
+
+        <div class="ph3 ph4-ns pv3">
+
+            <footer class="center c-measure">
+
+                <p role="contentinfo" class="f6 c-lh-title ma0">{{ site.description }}</p>
+
+                <div><a href="/rss.xml" class="flex items-center pv2"><svg xmlns="http://www.w3.org/2000/svg" height="48px" viewBox="0 0 24 24" width="48px" fill="#FFB700" class="mr1"><path d="M0 0h24v24H0z" fill="none"/><circle cx="6.18" cy="17.82" r="2.18"/><path d="M4 4.44v2.83c7.03 0 12.73 5.7 12.73 12.73h2.83c0-8.59-6.97-15.56-15.56-15.56zm0 5.66v2.83c3.9 0 7.07 3.17 7.07 7.07h2.83c0-5.47-4.43-9.9-9.9-9.9z"/></svg><span class="f6">RSS feed</span></a></div>
+
+            </footer>
+
+        </div>
+
+        {% endif %}
+
+    </body>
+
+</html>

data/_includes/header.html

@@ -0,0 +1,9 @@
+{% include meta.html %}
+
+    <body class="ma0 pa0 c-bg c-foreground c-sans-serif c-lh-copy">
+
+        <p class="clip"><a href="#content">Skip to content</a></p>
+
+        <a href="/" class="f6 no-underline underline-hover db tc b c-link pa3 pa4-ns c-lh-title">{{ site.title }}</a>
+
+        <main class="mv4 mv5-ns" id="content">

data/_includes/meta.html

@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+
+<html lang="{{ site.lang }}">
+
+    <head>
+
+        {% if page.is_home %}
+        <title>{{ site.title }}</title>
+        <meta name="description" content="{{ site.description }}">
+        {% else %}
+        <title>{{ page.title }} &#8211; {{ site.title }}</title>
+        {% endif %}
+
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <meta charset="utf-8">
+
+        <link rel="alternate" type="application/rss+xml" title="{{ site.title }}" href="{{ site.url }}/feed.xml">
+
+        {% if site.css == 'inline' %}
+        <style>
+            {% capture inline-styles %}
+            {% include style.scss %}
+            {% endcapture %}
+            {{ inline-styles | scssify }}
+        </style>
+        {% else %}
+        <link href="/assets/style.css" rel="stylesheet">
+        {% endif %}
+
+    </head>

data/_includes/style.scss

@@ -0,0 +1,74 @@
+// Complete list of Tachyons partials in _sass folder
+// Order is important
+// First 5 should be normalize, media-queries, variables, colors, spacing
+// Because the other files refer to variables declared in these files
+// Comment out the modules you don't need (ex. the first 5)
+
+@import
+    "normalize",
+    "media-queries",
+    "variables",
+    "colors",
+    "spacing",
+    "aspect-ratios",
+    "background-position",
+    "background-size",
+    "borders",
+    "border-colors",
+    "border-radius",
+    "border-style",
+    "border-widths",
+    "box-shadow",
+    "box-sizing",
+    "clears",
+    "code",
+    "coordinates",
+    // Uncomment debug SASS files to debug
+    // "debug_children",
+    // "debug_grid",
+    // "debug",
+    "display",
+    "flexbox",
+    "floats",
+    "font-family",
+    "font-style",
+    "font-weight",
+    "forms",
+    "gradients",
+    "heights",
+    "hovers",
+    "images",
+    "letter-spacing",
+    "line-height",
+    "links",
+    "lists",
+    "max-widths",
+    // "module-template",
+    "negative-margins",
+    "nested",
+    "opacity",
+    "outlines",
+    "overflow",
+    "position",
+    "rotations",
+    "skins-pseudo",
+    "skins",
+    "tables",
+    // If you just want all the Tachyons modules delete the single modules
+    // and uncomment this
+    // "tachyons-4.8.1",
+    "text-align",
+    "text-decoration",
+    "text-transform",
+    "type-scale",
+    "typography",
+    "utilities",
+    "vertical-align",
+    "visibility",
+    "white-space",
+    "widths",
+    "word-break",
+    "z-index",
+    // Put your own selectors in c
+    "c"
+;

data/_layouts/archive.html

@@ -0,0 +1,34 @@
+{% include header.html %}
+
+<div class="ph3 ph4-ns">
+
+    <div class="c-measure center">
+
+        <div class="mb4">
+
+            <h1 class="f3 f2-ns c-lh-title ma0">{{ page.title }}</h1>
+
+            {% if page.intro %}
+
+            <p class="f5 f4-ns">{{ page.intro }}</p>
+
+            {% endif %}
+
+        </div>
+
+        <div class="c-hyphens">
+
+            {{ content }}
+
+        </div>
+
+        {% include annual-list.html %}
+
+    </div>
+
+</div>
+
+{% include footer.html %}
+
+
+

data/_layouts/default.html

@@ -0,0 +1,29 @@
+{% include header.html %}
+
+<div class="ph3 ph4-ns">
+
+    <div class="c-measure center c-article">
+
+        <div class="mb4">
+
+            <h1 class="f3 f2-ns c-lh-title ma0">{{ page.title }}</h1>
+
+            {% if page.intro %}
+
+            <p class="f5 f4-ns">{{ page.intro }}</p>
+
+            {% endif %}
+
+        </div>
+
+        <div class="c-hyphens">
+
+        {{ content}}
+
+        </div>
+
+    </div>
+
+</div>
+
+{% include footer.html %}

data/_layouts/home.html

@@ -0,0 +1,34 @@
+{% include header.html %}
+
+<div class="ph3 ph4-ns">
+
+    <div class="c-measure center">
+
+        <div class="mb4">
+
+            <h1 class="f3 f2-ns c-lh-title ma0">{{ page.title }}</h1>
+
+            {% if page.intro %}
+
+            <p class="f5 f4-ns">{{ page.intro }}</p>
+
+            {% endif %}
+
+        </div>
+
+        <div class="c-hyphens">
+
+            {{ content }}
+
+        </div>
+
+        {% include annual-list.html %}
+
+    </div>
+
+</div>
+
+{% include footer.html %}
+
+
+

data/_layouts/page.html

@@ -0,0 +1,29 @@
+{% include header.html %}
+
+<div class="ph3 ph4-ns">
+
+    <div class="c-measure center c-article">
+
+        <div class="mb4">
+
+            <h1 class="f3 f2-ns c-lh-title ma0">{{ page.title }}</h1>
+
+            {% if page.intro %}
+
+            <p class="f5 f4-ns">{{ page.intro }}</p>
+
+            {% endif %}
+
+        </div>
+
+        <div class="c-hyphens">
+
+        {{ content}}
+
+        </div>
+
+    </div>
+
+</div>
+
+{% include footer.html %}

data/_layouts/post.html

@@ -0,0 +1,44 @@
+{% include header.html %}
+
+<div class="ph3 ph4-ns">
+
+    <article class="c-measure center h-entry">
+
+        <div class="mb4">
+
+            <div class="flex flex-column-reverse">
+
+                <h1 class="f3 f2-ns c-lh-title ma0 p-name">{{ page.title }}</h1>
+
+                <p class="f6 mt0 mb2"><time class="dt-published" datetime="{{ page.date | date: '%Y-%m-%d' }}">{{ page.date | date: "%-d %b, %Y" }}</time>{% if page.author %} &middot; <span class="p-author">{{ page.author }}</span>{% elsif site.author %} &middot; <span class="p-author">{{ site.author }}</span>{% endif %}</p>
+
+            </div>
+
+            {% if page.intro %}
+
+            <p class="f5 f4-ns">{{ page.intro }}</p>
+
+            {% endif %}
+
+        </div>
+
+        <div class="c-hyphens e-content">
+
+        {{ content}}
+
+        </div>
+
+        <div class="clip">
+
+            <span class="u-url">{{site.url}}{{ page.url }}</span>
+            {% if page.in-reply-to %}<span class="u-in-reply-to">{{ page.in-reply-to }}</span>{% endif %}
+            {% if page.like-of %}<span class="u-like-of">{{ page.like-of }}</span>{% endif %}
+            {% if page.repost-of %}<span class="u-repost-of">{{ page.repost-of }}</span>{% endif %}
+
+        </div>
+
+    </article>
+
+</div>
+
+{% include footer.html %}

data/_sass/_aspect-ratios.scss

@@ -0,0 +1,142 @@
+
+// Converted Variables
+
+
+// Custom Media Query Variables
+
+
+/*
+
+   ASPECT RATIOS
+
+*/
+
+/* This is for fluid media that is embedded from third party sites like youtube, vimeo etc.
+ * Wrap the outer element in aspect-ratio and then extend it with the desired ratio i.e
+ * Make sure there are no height and width attributes on the embedded media.
+ * Adapted from: https://github.com/suitcss/components-flex-embed
+ *
+ * Example:
+ *
+ * <div class="aspect-ratio aspect-ratio--16x9">
+ *  <iframe class="aspect-ratio--object"></iframe>
+ * </div>
+ *
+ * */
+
+.aspect-ratio {
+  height: 0;
+  position: relative;
+}
+
+.aspect-ratio--16x9 { padding-bottom: 56.25%; }
+.aspect-ratio--9x16 { padding-bottom: 177.77%; }
+
+.aspect-ratio--4x3 {  padding-bottom: 75%; }
+.aspect-ratio--3x4 {  padding-bottom: 133.33%; }
+
+.aspect-ratio--6x4 {  padding-bottom: 66.6%; }
+.aspect-ratio--4x6 {  padding-bottom: 150%; }
+
+.aspect-ratio--8x5 {  padding-bottom: 62.5%; }
+.aspect-ratio--5x8 {  padding-bottom: 160%; }
+
+.aspect-ratio--7x5 {  padding-bottom: 71.42%; }
+.aspect-ratio--5x7 {  padding-bottom: 140%; }
+
+.aspect-ratio--1x1 {  padding-bottom: 100%; }
+
+.aspect-ratio--object {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 100;
+}
+
+@media #{$breakpoint-not-small}{
+    .aspect-ratio-ns {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-ns { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-ns { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-ns {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-ns {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-ns {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-ns {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-ns {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-ns {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-ns {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-ns {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-ns {  padding-bottom: 100%; }
+    .aspect-ratio--object-ns {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}
+
+@media #{$breakpoint-medium}{
+    .aspect-ratio-m {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-m { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-m { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-m {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-m {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-m {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-m {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-m {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-m {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-m {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-m {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-m {  padding-bottom: 100%; }
+    .aspect-ratio--object-m {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}
+
+@media #{$breakpoint-large}{
+    .aspect-ratio-l {
+      height: 0;
+      position: relative;
+    }
+    .aspect-ratio--16x9-l { padding-bottom: 56.25%; }
+    .aspect-ratio--9x16-l { padding-bottom: 177.77%; }
+    .aspect-ratio--4x3-l {  padding-bottom: 75%; }
+    .aspect-ratio--3x4-l {  padding-bottom: 133.33%; }
+    .aspect-ratio--6x4-l {  padding-bottom: 66.6%; }
+    .aspect-ratio--4x6-l {  padding-bottom: 150%; }
+    .aspect-ratio--8x5-l {  padding-bottom: 62.5%; }
+    .aspect-ratio--5x8-l {  padding-bottom: 160%; }
+    .aspect-ratio--7x5-l {  padding-bottom: 71.42%; }
+    .aspect-ratio--5x7-l {  padding-bottom: 140%; }
+    .aspect-ratio--1x1-l {  padding-bottom: 100%; }
+    .aspect-ratio--object-l {
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        width: 100%;
+        height: 100%;
+        z-index: 100;
+    }
+}