treat ALL images as assets (as they should have been all along...)

.markdownlintrc

@@ -10,7 +10,7 @@
   "no-blanks-blockquote": true,
   "no-empty-links": false,
   "no-hard-tabs": false,
-  "no-inline-html": { "allowed_elements": [ "img", "span", "sup" ] },
+  "no-inline-html": { "allowed_elements": [ "p", "a", "img", "h2", "h3", "span", "sup" ] },
   "no-multiple-blanks": false,
   "no-trailing-punctuation": false,
   "single-h1": false,

config.toml

@@ -11,6 +11,7 @@ pygmentsUseClasses = true
 pygmentsCodeFences = true
 pygmentsCodeFencesGuessSyntax = false
 
+enableInlineShortcodes = true
 enableRobotsTXT = true
 
 disableKinds = ["taxonomy", "taxonomyTerm"]
@@ -26,7 +27,7 @@ disableAliases = true
   domain = "jarv.is"
   mainSection = "notes"
   pageMaxWidth = 910
-  defaultImage = "/me_large.jpg"
+  defaultImage = "img/me_large.jpg"
   github = "jakejarvis/jarv.is"
   facebookAppID = "3357248167622283"
   copyrightFirstYear = "2001"

content/_index.md

@@ -1,10 +1,13 @@
 ---
 title: "Jake Jarvis – Front-End Web Developer in Boston, MA"
-date: 2020-04-21 11:46:51-0400
+date: 2020-04-21 12:50:17-0400
 type: home
 ---
 
-<img id="me" src="/me.jpg" width="160" height="160" alt="Photo of Jake Jarvis">
+{{< portrait.inline >}}
+{{ $photoImg := resources.Get "img/me.jpg" }}
+<img id="me" src="{{ $photoImg.Permalink }}" width="{{ div $photoImg.Width 2 }}" height="{{ div $photoImg.Height 2 }}" alt="Photo of Jake Jarvis">
+{{</ portrait.inline >}}
 
 <h2>Hi there! I'm Jake. <span class="wave">&#x1F44B;</span></h2>
 <h3>I'm a frontend web developer based in <a href="https://www.youtube-nocookie.com/embed/rLwbzGyC6t4?hl=en&amp;fs=1&amp;showinfo=1&amp;rel=0&amp;iv_load_policy=3" title="&quot;Boston Accent Trailer - Late Night with Seth Meyers&quot; on YouTube" id="boston" target="_blank" rel="noopener">Boston</a>.</h3>

layouts/_default/single.amp.html

@@ -206,12 +206,12 @@
         display: block;
         margin-left: 1.5em;
       }
-      div.highlight span.k, div.highlight span.kc, div.highlight span.kd, div.highlight span.kp, div.highlight span.kr, div.highlight span.kt, div.highlight span.no { color: #03748a; }
+      div.highlight span.k, div.highlight span.kc, div.highlight span.kd, div.highlight span.kp, div.highlight span.kr, div.highlight span.kt, div.highlight span.no { color: #0e6dc2; }
       div.highlight span.n, div.highlight span.bp, div.highlight span.nb, div.highlight span.ni, div.highlight span.fm, div.highlight span.nl, div.highlight span.nn, div.highlight span.py, div.highlight span.nv, div.highlight span.vc, div.highlight span.vg, div.highlight span.vi, div.highlight span.vm, div.highlight span.p { color: #111111; }
-      div.highlight span.na, div.highlight span.nc, div.highlight span.nd, div.highlight span.ne, div.highlight span.nf, div.highlight span.nx { color: #068200; }
+      div.highlight span.na, div.highlight span.nc, div.highlight span.nd, div.highlight span.ne, div.highlight span.nf, div.highlight span.nx { color: #337a15; }
-      div.highlight span.err, div.highlight span.nt, div.highlight span.o, div.highlight span.ow, div.highlight span.kn { color: #e8003d; }
+      div.highlight span.err, div.highlight span.nt, div.highlight span.o, div.highlight span.ow, div.highlight span.kn { color: #d43d2e; }
-      div.highlight span.l, div.highlight span.se, div.highlight span.m, div.highlight span.mb, div.highlight span.mf, div.highlight span.mh, div.highlight span.mi, div.highlight span.il, div.highlight span.mo { color: #8145ec; }
+      div.highlight span.l, div.highlight span.se, div.highlight span.m, div.highlight span.mb, div.highlight span.mf, div.highlight span.mh, div.highlight span.mi, div.highlight span.il, div.highlight span.mo { color: #8d4eff; }
-      div.highlight span.ld, div.highlight span.s, div.highlight span.sa, div.highlight span.sb, div.highlight span.sc, div.highlight span.dl, div.highlight span.sd, div.highlight span.s2, div.highlight span.sh, div.highlight span.si, div.highlight span.sx, div.highlight span.sr, div.highlight span.s1, div.highlight span.ss { color: #b35c00; }
+      div.highlight span.ld, div.highlight span.s, div.highlight span.sa, div.highlight span.sb, div.highlight span.sc, div.highlight span.dl, div.highlight span.sd, div.highlight span.s2, div.highlight span.sh, div.highlight span.si, div.highlight span.sx, div.highlight span.sr, div.highlight span.s1, div.highlight span.ss { color: #bd5500; }
       div.highlight span.c, div.highlight span.ch, div.highlight span.cm, div.highlight span.c1, div.highlight span.cs, div.highlight span.cp, div.highlight span.cpf { color: #6b6859; }
       div.highlight span.ge { font-style: italic; }
       div.highlight span.gs { font-weight: bold; }
@@ -224,10 +224,8 @@
     </style>
 
     {{ partialCached "head/favicons" (dict "pngSizes" "192 48 32 16" "icoSizes" "16 32 48") }}
-
+    {{ partialCached "head/feeds" . }}
     <link rel="manifest" href="{{ "site.webmanifest" | absURL }}">
-    <link rel="alternate" type="application/rss+xml" href="{{ "feed.xml" | absURL }}" title="{{ .Site.Title }} (RSS)">
-
     {{ partial "head/schema-person" . }}
     {{ partial "head/schema-article" . }}
   </head>

layouts/index.headers

@@ -10,6 +10,10 @@
 /vendor/*
   Cache-Control: public, max-age=31536000, immutable
 
+# Kinda long cache (one week) for favicons, etc.
+/img/*
+  Cache-Control: public, max-age=604800, immutable
+
 # Proper MIME type for Atom feed
 /*.atom
   Content-Type: application/atom+xml

layouts/index.manifest.json

@@ -1,14 +1,16 @@
+{{- $android512 := resources.Get "img/android-chrome-512x512.png" -}}
+{{- $android192 := resources.Get "img/android-chrome-192x192.png" -}}
 {
   "name": "{{ .Site.Title }}",
   "short_name": "{{ .Site.Params.domain }}",
   "icons": [
     {
-      "src": "{{ "android-chrome-512x512.png" | absURL }}",
+      "src": "{{ $android512.Permalink }}",
       "sizes": "512x512",
       "type": "image/png"
     },
     {
-      "src": "{{ "android-chrome-192x192.png" | absURL }}",
+      "src": "{{ $android192.Permalink }}",
       "sizes": "192x192",
       "type": "image/png"
     }

layouts/partials/functions/social-images.html

@@ -1,32 +1,24 @@
 {{/* Default image */}}
-{{- $defaultImagePath := (path.Join "content" $.Site.Params.defaultImage) }}
+{{- $defaultImage := resources.Get $.Site.Params.defaultImage }}
-{{ $.Scratch.Set "defaultImage_url" (replace $defaultImagePath "content/" "") }}
+{{- $.Scratch.Set "defaultImage_url" $defaultImage.Permalink }}
-{{ with (imageConfig $defaultImagePath) }}
+{{- $.Scratch.Set "defaultImage_width" $defaultImage.Width }}
-  {{- $.Scratch.Set "defaultImage_width" .Width }}
+{{- $.Scratch.Set "defaultImage_height" $defaultImage.Height }}
-  {{- $.Scratch.Set "defaultImage_height" .Height }}
-{{ end -}}
 
-{{/* Article image (with fallback to default image */}}
+{{/* Article image */}}
 {{- with .Params.image }}
-  {{- $imagePath := (path.Join "content" $.File.Dir .) }}
+  {{- $socialImage := $.Page.Resources.GetMatch . }}
-
+  {{- $.Scratch.Set "socialImage_url" $socialImage.Permalink }}
-  {{- $.Scratch.Set "socialImage_url" (replace $imagePath "content/" "") }}
+  {{- $.Scratch.Set "socialImage_width" $socialImage.Width }}
-  {{- with (imageConfig $imagePath) }}
+  {{- $.Scratch.Set "socialImage_height" $socialImage.Height }}
-    {{- $.Scratch.Set "socialImage_width" .Width }}
-    {{- $.Scratch.Set "socialImage_height" .Height }}
-  {{- end }}
 {{ else }}
-  {{- $.Scratch.Set "socialImage_url" (replace $defaultImagePath "content/" "") }}
+  {{/* fallback to default image set above */}}
-  {{- with (imageConfig $defaultImagePath) }}
+  {{- $.Scratch.Set "socialImage_url" $defaultImage.Permalink }}
-    {{- $.Scratch.Set "socialImage_width" .Width }}
+  {{- $.Scratch.Set "socialImage_width" $defaultImage.Width }}
-    {{- $.Scratch.Set "socialImage_height" .Height }}
+  {{- $.Scratch.Set "socialImage_height" $defaultImage.Height }}
-  {{- end }}
 {{ end -}}
 
 {{/* Site logo */}}
-{{- $logoImagePath := (path.Join "content" "logo.png") }}
+{{- $logoImage := resources.Get "img/logo.png" }}
-{{ $.Scratch.Set "logoImage_url" (replace $logoImagePath "content/" "") }}
+{{- $.Scratch.Set "logoImage_url" $logoImage.Permalink }}
-{{ with (imageConfig $logoImagePath) }}
+{{- $.Scratch.Set "logoImage_width" $logoImage.Width }}
-  {{- $.Scratch.Set "logoImage_width" .Width }}
+{{- $.Scratch.Set "logoImage_height" $logoImage.Height }}
-  {{- $.Scratch.Set "logoImage_height" .Height }}
-{{ end -}}

layouts/partials/head/favicons.html

@@ -1,10 +1,16 @@
-<link rel="apple-touch-icon" href="{{ "apple-touch-icon.png" | absURL }}" sizes="180x180">
+{{- $appleIcon := resources.Get "img/apple-touch-icon.png" }}
-<link rel="mask-icon" href="{{ "safari-pinned-tab.svg" | absURL }}" color="#009cdf">
+<link rel="apple-touch-icon" href="{{ $appleIcon.Permalink }}" sizes="{{ $appleIcon.Width }}x{{ $appleIcon.Height }}">
 
-{{ range (split .pngSizes " ") -}}
+{{- $safariIcon := resources.Get "img/safari-pinned-tab.svg" }}
-<link rel="icon" href="{{ (printf "favicon-%v.png" .) | absURL }}" sizes="{{ . }}x{{ . }}">
+<link rel="mask-icon" href="{{ $safariIcon.Permalink }}" color="#009cdf">
-{{ end -}}
 
-{{ $s := slice -}}
+{{/* TODO: automate shrinking to given sizes based on one super big favicon */}}
-{{ range (split .icoSizes " ") }}{{ $s = $s | append (printf "%vx%v" . .) }}{{ end -}}
+{{- range (split .pngSizes " ") }}
-<link rel="shortcut icon" href="{{ "favicon.ico" | absURL }}" sizes="{{ delimit $s " " }}">
+  {{- $faviconPng := resources.Get (printf "img/favicon-%v.png" .) }}
+  <link rel="icon" href="{{ $faviconPng.Permalink }}" sizes="{{ . }}x{{ . }}">
+{{- end }}
+
+{{- $s := slice }}
+{{- range (split .icoSizes " ") }}{{ $s = $s | append (printf "%vx%v" . .) }}{{ end }}
+{{- $faviconIco := resources.Get "img/favicon.ico" }}
+<link rel="shortcut icon" href="{{ $faviconIco.Permalink }}" sizes="{{ delimit $s " " }}">

layouts/partials/head/mobile.html

@@ -1,5 +1,3 @@
 <meta name="apple-mobile-web-app-capable" content="yes">
 <meta name="apple-mobile-web-app-status-bar-style" content="default">
 <meta name="apple-mobile-web-app-title" content="{{ .Site.Title }}">
-<meta name="msapplication-TileColor" content="#0e6dc2">
-<meta name="theme-color" content="#0e6dc2">

layouts/partials/head/styles.html

@@ -4,7 +4,7 @@
 {{/* Page-specific styles set via front matter, scoped via SCSS */}}
 {{ with .Params.css }}
   {{- $sass := printf "div#content { %s }" . }}
-  {{- $target := path.Join $.File.Dir "inline.scss" }}
+  {{- $target := path.Join $.File.Dir "css/inline.scss" }}
 
   {{- $css := $sass | resources.FromString $target | resources.ToCSS | resources.PostCSS (dict "config" "postcss.config.js") -}}
 

netlify.toml

@@ -150,22 +150,45 @@
   to = "/vendor/emoji/emoji.min.js"
   status = 301
 
-# More miscellaneous mirrors:
+# More miscellaneous mirrors/redirects:
+[[redirects]]
+  from = "/favicon.ico"
+  to = "/img/favicon.ico"
+  status = 200
+[[redirects]]
+  from = "/favicon-*"
+  to = "/img/favicon-:splat"
+  status = 301
 [[redirects]]
   from = "/apple-touch-icon-*"
-  to = "/apple-touch-icon.png"
+  to = "/img/apple-touch-icon.png"
-  status = 200
+  status = 301
+[[redirects]]
+  from = "/safari-pinned-tab.svg"
+  to = "/img/safari-pinned-tab.svg"
+  status = 301
+[[redirects]]
+  from = "/android-chrome-*"
+  to = "/img/android-chrome-:splat"
+  status = 301
 [[redirects]]
   from = "/me_lg.jpg"
-  to = "/me_large.jpg"
+  to = "/img/me_large.jpg"
-  status = 200
+  status = 301
+[[redirects]]
+  from = "/me_large.jpg"
+  to = "/img/me_large.jpg"
+  status = 301
+[[redirects]]
+  from = "/me.jpg"
+  to = "/img/me.jpg"
+  status = 301
+[[redirects]]
+  from = "/logo.png"
+  to = "/img/logo.png"
+  status = 301
 
 # H A C K E R M A N ( ͡° ͜ʖ ͡°)
-[[redirects]]
-  from = "*/wp-login.php"
-  to = "/403.html"
-  status = 403
-  force = true
 [[redirects]]
   from = "*/wp-admin/*"
   to = "/403.html"
@@ -177,12 +200,12 @@
   status = 403
   force = true
 [[redirects]]
-  from = "/login"
+  from = "*/wp-login.php*"
   to = "/403.html"
   status = 403
   force = true
 [[redirects]]
-  from = "*/login.php"
+  from = "*/login.php*"
   to = "/403.html"
   status = 403
   force = true

static/browserconfig.xml

@@ -1,10 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-<browserconfig>
-    <msapplication>
-        <tile>
-            <square150x150logo src="https://jarv.is/mstile-150x150.png"/>
-            <square310x310logo src="https://jarv.is/mstile-310x310.png"/>
-            <TileColor>#0e6dc2</TileColor>
-        </tile>
-    </msapplication>
-</browserconfig>

yarn.lock

@@ -5205,9 +5205,9 @@ sort-keys@^2.0.0:
     is-plain-obj "^1.0.0"
 
 source-map-support@~0.5.12:
-  version "0.5.17"
+  version "0.5.18"
-  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.17.tgz#29fe1b3c98b9dbd5064ada89052ee8ff070cb46c"
+  resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.18.tgz#f5f33489e270bd7f7d7e7b8debf283f3a4066960"
-  integrity sha512-bwdKOBZ5L0gFRh4KOxNap/J/MpvX9Yxsq9lFDx65s3o7F/NiHy7JRaGIS8MwW6tZPAq9UXE207Il0cfcb5yu/Q==
+  integrity sha512-9luZr/BZ2QeU6tO2uG8N2aZpVSli4TSAOAqFOyTO51AJcD9P99c0K1h6dD6r6qo5dyT44BR5exweOaLLeldTkQ==
   dependencies:
     buffer-from "^1.0.0"
     source-map "^0.6.0"