mirror of
https://github.com/jakejarvis/jarv.is.git
synced 2025-04-27 14:16:20 -04:00
Jake Jarvis
124d55a99e
styles on AMP pages still won't be scoped to div#content like vanilla pages, though
273 lines
11 KiB
HTML
273 lines
11 KiB
HTML
<!doctype html>
|
||
<html ⚡ lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
{{ hugo.Generator }}
|
||
<script async src="https://cdn.ampproject.org/v0.js"></script>
|
||
<script async custom-element="amp-iframe" src="https://cdn.ampproject.org/v0/amp-iframe-0.1.js"></script>
|
||
{{ if .HasShortcode "video" }}<script async custom-element="amp-video" src="https://cdn.ampproject.org/v0/amp-video-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "youtube" }}<script async custom-element="amp-youtube" src="https://cdn.ampproject.org/v0/amp-youtube-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "tweet" }}<script async custom-element="amp-twitter" src="https://cdn.ampproject.org/v0/amp-twitter-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "facebook" }}<script async custom-element="amp-facebook" src="https://cdn.ampproject.org/v0/amp-facebook-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "gist" }}<script async custom-element="amp-gist" src="https://cdn.ampproject.org/v0/amp-gist-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "instagram" }}<script async custom-element="amp-gist" src="https://cdn.ampproject.org/v0/amp-instagram-0.1.js"></script>{{ end }}
|
||
{{ if .HasShortcode "vimeo" }}<script async custom-element="amp-gist" src="https://cdn.ampproject.org/v0/amp-vimeo-0.1.js"></script>{{ end }}
|
||
<title>{{ .Title }} – {{ .Site.Title }}</title>
|
||
{{ with .OutputFormats.Get "html" }}<link rel="canonical" href="{{ .Permalink }}">{{ end }}
|
||
<meta name="description" content="{{ with .Description }}{{ . }}{{ else }}{{ .Site.Params.description }}{{ end }}">
|
||
{{ with .Site.Author.name }}<meta name="author" content="{{ . }}">{{ end }}
|
||
<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1">
|
||
{{ partial "head/open-graph" . }}
|
||
|
||
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
|
||
<style amp-custom>
|
||
@font-face {
|
||
font-family: "Inter";
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
font-display: swap;
|
||
src: url("{{ "vendor/inter/inter-regular-subset.woff2" | absURL }}") format("woff2"),
|
||
url("{{ "vendor/inter/inter-regular-subset.woff" | absURL }}") format("woff");
|
||
unicode-range: U+0000-00FF, U+2000-206F, U+20A0-20CF,
|
||
U+2190-21FF, U+2200-22FF, U+2122;
|
||
}
|
||
@font-face {
|
||
font-family: "Inter";
|
||
font-style: normal;
|
||
font-weight: 500;
|
||
font-display: swap;
|
||
src: url("{{ "vendor/inter/inter-medium-subset.woff2" | absURL }}") format("woff2"),
|
||
url("{{ "vendor/inter/inter-medium-subset.woff" | absURL }}") format("woff");
|
||
unicode-range: U+0000-00FF, U+2000-206F, U+20A0-20CF,
|
||
U+2190-21FF, U+2200-22FF, U+2122;
|
||
}
|
||
@font-face {
|
||
font-family: "Inter";
|
||
font-style: normal;
|
||
font-weight: 700;
|
||
font-display: swap;
|
||
src: url("{{ "vendor/inter/inter-bold-subset.woff2" | absURL }}") format("woff2"),
|
||
url("{{ "vendor/inter/inter-bold-subset.woff" | absURL }}") format("woff");
|
||
unicode-range: U+0000-00FF, U+2000-206F, U+20A0-20CF,
|
||
U+2190-21FF, U+2200-22FF, U+2122;
|
||
}
|
||
@font-face {
|
||
font-family: "Hack";
|
||
font-style: normal;
|
||
font-weight: 400;
|
||
font-display: swap;
|
||
src: url("{{ "vendor/hack/hack-regular-subset.woff2" | absURL }}") format("woff2"),
|
||
url("{{ "vendor/hack/hack-regular-subset.woff" | absURL }}") format("woff");
|
||
}
|
||
|
||
body {
|
||
font-family: "Inter", sans-serif;
|
||
font-feature-settings: "kern", "liga", "calt", "clig", "ss01";
|
||
font-kerning: normal;
|
||
font-variant-ligatures: normal;
|
||
font-size: 0.92em;
|
||
letter-spacing: -0.011em;
|
||
background: #ffffff;
|
||
color: #222222;
|
||
-webkit-text-size-adjust: 100%;
|
||
}
|
||
a {
|
||
color: #0e6dc2;
|
||
}
|
||
hr {
|
||
margin: 1.25em auto;
|
||
height: 2px;
|
||
border: 0;
|
||
background-color: #d2d2d2;
|
||
}
|
||
strong {
|
||
letter-spacing: 0.001em;
|
||
}
|
||
blockquote {
|
||
border-left: 5px solid #0e6dc2;
|
||
margin-left: 0.5em;
|
||
padding-left: 1em;
|
||
}
|
||
article {
|
||
line-height: 1.8;
|
||
padding: 0 20px;
|
||
}
|
||
h1.title {
|
||
text-align: center;
|
||
font-size: 2em;
|
||
line-height: 1.3;
|
||
margin-top: 0.6em;
|
||
margin-bottom: 0.25em;
|
||
}
|
||
p.meta {
|
||
text-align: center;
|
||
margin: 0.25em;
|
||
color: #757575;
|
||
}
|
||
p.meta a {
|
||
text-decoration: none;
|
||
color: #444444;
|
||
}
|
||
p.center, p.image, p.caption {
|
||
text-align: center;
|
||
}
|
||
p.caption {
|
||
margin-top: -1em;
|
||
font-size: 0.9em;
|
||
color: #5e5e5e;
|
||
}
|
||
h2 {
|
||
padding-bottom: 0.25em;
|
||
border-bottom: 1px solid #e3e3e3;
|
||
}
|
||
header {
|
||
width: 100%;
|
||
background-color: #fbfbfb;
|
||
border-bottom: 1px solid #e3e3e3;
|
||
}
|
||
nav {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 5px 20px;
|
||
}
|
||
nav a {
|
||
text-decoration: none;
|
||
}
|
||
nav a#logo {
|
||
display: flex;
|
||
align-items: center;
|
||
color: #333333;
|
||
padding: 12px 0;
|
||
}
|
||
nav a#logo svg {
|
||
height: 45px;
|
||
width: 30px;
|
||
}
|
||
nav a#logo span {
|
||
margin-left: 16px;
|
||
font-size: 1.35em;
|
||
font-weight: 500;
|
||
}
|
||
nav ul {
|
||
list-style: none;
|
||
display: flex;
|
||
align-items: center;
|
||
font-size: 1.5em;
|
||
line-height: 1;
|
||
padding: 0;
|
||
}
|
||
nav ul li {
|
||
width: 60px;
|
||
text-align: right;
|
||
}
|
||
footer {
|
||
display: flex;
|
||
justify-content: space-between;
|
||
padding: 20px;
|
||
border-top: 1px solid #e3e3e3;
|
||
color: #555;
|
||
line-height: 1.8;
|
||
}
|
||
footer a {
|
||
text-decoration: none;
|
||
}
|
||
footer div {
|
||
vertical-align: middle;
|
||
height: 100%;
|
||
}
|
||
div.left {
|
||
text-align: left;
|
||
}
|
||
div.right {
|
||
text-align: right;
|
||
}
|
||
div.highlight, code {
|
||
font-family: "Hack", monospace;
|
||
background: #fbfbfb;
|
||
font-size: 0.95em;
|
||
letter-spacing: 0;
|
||
page-break-inside: avoid;
|
||
}
|
||
p code {
|
||
border: 1px solid #dddddd;
|
||
padding: 0.2em;
|
||
}
|
||
div.highlight {
|
||
border: 1px solid #dddddd;
|
||
border-left: 3px solid #0e6dc2;
|
||
line-height: 1.6;
|
||
max-width: 100%;
|
||
overflow-x: scroll;
|
||
object-fit: scale-down;
|
||
margin: 1em 0;
|
||
}
|
||
div.highlight pre {
|
||
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.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.err, div.highlight span.nt, div.highlight span.o, div.highlight span.ow, div.highlight span.kn { color: #e8003d; }
|
||
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.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.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; }
|
||
div.highlight span.lnt { color: #999999; user-select: none; }
|
||
|
||
{{/* Page-specific styles set via front matter */}}
|
||
{{- with .Params.css }}
|
||
{{- replace . " !important" "" | safeCSS -}}
|
||
{{ end -}}
|
||
</style>
|
||
|
||
{{ partialCached "head/favicons" (dict "pngSizes" "192 48 32 16" "icoSizes" "16 32 48") }}
|
||
|
||
<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>
|
||
<body>
|
||
<header>
|
||
<nav>
|
||
<a id="logo" href="{{ .Site.BaseURL }}" title="{{ .Site.Title }}">
|
||
{{ partialCached "page/logo" . }}
|
||
<span id="name">{{ .Site.Title }}</span>
|
||
</a>
|
||
|
||
<ul>
|
||
<li><a href="{{ .Site.BaseURL }}" title="Home">🏠</a></li>
|
||
<li><a href="{{ "notes/" | absURL }}" title="Notes">📝</a></li>
|
||
<li><a href="mailto:jake@jarv.is" title="Email Me">💌</a></li>
|
||
</ul>
|
||
</nav>
|
||
</header>
|
||
|
||
<article>
|
||
<h1 class="title">{{ .Title | markdownify }}</h1>
|
||
<p class="meta">
|
||
by <a class="author" href="{{ .Site.BaseURL }}" rel="me author">{{ .Site.Author.name }}</a>
|
||
on <a class="date" href="{{ (.OutputFormats.Get "html").Permalink }}">{{ .Date.Format "January 2, 2006" }}</a>
|
||
</p>
|
||
|
||
{{ .Content }}
|
||
</article>
|
||
|
||
<footer>
|
||
<div class="left">Content by <a href="{{ .Site.BaseURL }}">{{ .Site.Author.name }}</a>, licensed under <a class="no-underline" href="{{ .Site.Params.licenseURL }}" {{ with .Site.Params.licenseFull }} title="{{ . }}" {{ end }}target="_blank" rel="noopener">{{ .Site.Params.license }}</a>.</div>
|
||
<div class="right"><a class="back-to-top" href="#top">↑ Back to top.</a></div>
|
||
</footer>
|
||
|
||
{{ if eq hugo.Environment "production" }}
|
||
<amp-pixel src="https://s.jarv.is/image.gif" layout="nodisplay"></amp-pixel>
|
||
{{ end }}
|
||
</body>
|
||
</html>
|
||
|
||
{{"<!--" | safeHTML}} {{ hugo.Environment }} {{"-->" | safeHTML}}
|
||
{{"<!--" | safeHTML}} {{ hugo.Version }} {{"-->" | safeHTML}}
|