-
-
Notifications
You must be signed in to change notification settings - Fork 633
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
32 changed files
with
5,612 additions
and
1,144 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,46 +1,348 @@ | ||
<!doctype html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Your Blog Name</title> | ||
<meta name="description" content="I am writing about my experiences as a naval navel-gazer."> | ||
<link rel="stylesheet" href="/eleventy-base-blog/css/index.css"> | ||
<link rel="stylesheet" href="/eleventy-base-blog/css/prism-base16-monokai.dark.css"> | ||
<link rel="alternate" href="/eleventy-base-blog/feed/feed.xml" type="application/atom+xml" title="Your Blog Name"> | ||
<link rel="alternate" href="/eleventy-base-blog/feed/feed.json" type="application/json" title="Your Blog Name"> | ||
</head> | ||
<body> | ||
<header> | ||
<h1 class="home"><a href="/eleventy-base-blog/">Your Blog Name</a></h1> | ||
<ul class="nav"> | ||
<li class="nav-item"><a href="/eleventy-base-blog/">Home</a></li> | ||
<li class="nav-item"><a href="/eleventy-base-blog/posts/">Archive</a></li> | ||
<li class="nav-item"><a href="/eleventy-base-blog/about/">About Me</a></li> | ||
</ul> | ||
</header> | ||
|
||
<main class="tmpl-home"> | ||
|
||
<!-- Delete this message --> | ||
<div class="warning"> | ||
<ol> | ||
<li>Edit the <code>_data/metadata.json</code> with your blog’s information.</li> | ||
<li>(Optional) Edit <code>.eleventy.js</code> with your <a href="https://www.11ty.dev/docs/config/">configuration preferences</a>.</li> | ||
<li>Delete this message from <code>_includes/layouts/base.njk</code>.</li> | ||
</ol> | ||
<p><em>This is an <a href="https://www.11ty.dev/">Eleventy project</a> created from the <a href="https://github.com/11ty/eleventy-base-blog"><code>eleventy-base-blog</code> repo</a>.</em></p> | ||
</div> | ||
<!-- Stop deleting --> | ||
|
||
<h1 id="content-not-found.">Content not found. <a class="direct-link" href="#content-not-found.">#</a></h1> | ||
<head> | ||
<meta charset="utf-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<title>Eleventy Base Blog v8</title> | ||
<meta name="description" content="I am writing about my experiences as a naval navel-gazer."> | ||
<link rel="alternate" href="/eleventy-base-blog/feed/feed.xml" type="application/atom+xml" title="Eleventy Base Blog v8"> | ||
<link rel="alternate" href="/eleventy-base-blog/feed/feed.json" type="application/json" title="Eleventy Base Blog v8"> | ||
|
||
<style>/* Message Box */ | ||
.message-box { | ||
--color-message-box: #ffc; | ||
|
||
display: block; | ||
background-color: var(--color-message-box); | ||
color: var(--color-gray-90); | ||
padding: 1em 0.625em; /* 16px 10px /16 */ | ||
} | ||
.message-box ol { | ||
margin-top: 0; | ||
} | ||
|
||
@media (prefers-color-scheme: dark) { | ||
.message-box { | ||
--color-message-box: #082840; | ||
} | ||
} | ||
* { box-sizing: border-box; } | ||
/* Defaults */ | ||
:root { | ||
--font-family: -apple-system, system-ui, sans-serif; | ||
--font-family-monospace: Consolas, Menlo, Monaco, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Courier New, Courier, monospace; | ||
} | ||
|
||
/* Theme colors */ | ||
:root { | ||
--color-gray-20: #e0e0e0; | ||
--color-gray-50: #C0C0C0; | ||
--color-gray-90: #333; | ||
|
||
--background-color: #fff; | ||
|
||
--text-color: var(--color-gray-90); | ||
--text-color-link: #082840; | ||
--text-color-link-active: #5f2b48; | ||
--text-color-link-visited: #17050F; | ||
|
||
--syntax-tab-size: 2; | ||
} | ||
|
||
@media (prefers-color-scheme: dark) { | ||
:root { | ||
--color-gray-20: #e0e0e0; | ||
--color-gray-50: #C0C0C0; | ||
--color-gray-90: #dad8d8; | ||
|
||
/* --text-color is assigned to --color-gray-_ above */ | ||
--text-color-link: #1493fb; | ||
--text-color-link-active: #6969f7; | ||
--text-color-link-visited: #a6a6f8; | ||
|
||
--background-color: #15202b; | ||
} | ||
} | ||
|
||
|
||
/* Global stylesheet */ | ||
* { | ||
box-sizing: border-box; | ||
} | ||
|
||
html, | ||
body { | ||
padding: 0; | ||
margin: 0 auto; | ||
font-family: var(--font-family); | ||
color: var(--text-color); | ||
background-color: var(--background-color); | ||
} | ||
html { | ||
overflow-y: scroll; | ||
} | ||
body { | ||
max-width: 40em; | ||
} | ||
|
||
/* https://www.a11yproject.com/posts/how-to-hide-content/ */ | ||
.visually-hidden { | ||
clip: rect(0 0 0 0); | ||
clip-path: inset(50%); | ||
height: 1px; | ||
overflow: hidden; | ||
position: absolute; | ||
white-space: nowrap; | ||
width: 1px; | ||
} | ||
|
||
p:last-child { | ||
margin-bottom: 0; | ||
} | ||
p { | ||
line-height: 1.5; | ||
} | ||
|
||
li { | ||
line-height: 1.5; | ||
} | ||
|
||
a[href] { | ||
color: var(--text-color-link); | ||
} | ||
a[href]:visited { | ||
color: var(--text-color-link-visited); | ||
} | ||
a[href]:hover, | ||
a[href]:active { | ||
color: var(--text-color-link-active); | ||
} | ||
|
||
main { | ||
padding: 1rem; | ||
} | ||
main :first-child { | ||
margin-top: 0; | ||
} | ||
|
||
header { | ||
border-bottom: 1px dashed var(--color-gray-20); | ||
} | ||
header:after { | ||
content: ""; | ||
display: table; | ||
clear: both; | ||
} | ||
|
||
.links-nextprev { | ||
list-style: none; | ||
border-top: 1px dashed var(--color-gray-20); | ||
padding: 1em 0; | ||
} | ||
|
||
table { | ||
margin: 1em 0; | ||
} | ||
table td, | ||
table th { | ||
padding-right: 1em; | ||
} | ||
|
||
pre, | ||
code { | ||
font-family: var(--font-family-monospace); | ||
} | ||
pre:not([class*="language-"]) { | ||
margin: .5em 0; | ||
line-height: 1.375; /* 22px /16 */ | ||
-moz-tab-size: var(--syntax-tab-size); | ||
-o-tab-size: var(--syntax-tab-size); | ||
tab-size: var(--syntax-tab-size); | ||
-webkit-hyphens: none; | ||
-ms-hyphens: none; | ||
hyphens: none; | ||
direction: ltr; | ||
text-align: left; | ||
white-space: pre; | ||
word-spacing: normal; | ||
word-break: normal; | ||
} | ||
code { | ||
word-break: break-all; | ||
} | ||
|
||
/* Header */ | ||
header { | ||
display: flex; | ||
gap: 1em .5em; | ||
flex-wrap: wrap; | ||
align-items: center; | ||
padding: 1em; | ||
} | ||
.home-link { | ||
font-size: 1em; /* 16px /16 */ | ||
font-weight: 700; | ||
margin-right: 2em; | ||
} | ||
.home-link:link:not(:hover) { | ||
text-decoration: none; | ||
} | ||
|
||
/* Nav */ | ||
.nav { | ||
display: flex; | ||
padding: 0; | ||
margin: 0; | ||
list-style: none; | ||
} | ||
.nav-item { | ||
display: inline-block; | ||
margin-right: 1em; | ||
} | ||
.nav-item a[href]:not(:hover) { | ||
text-decoration: none; | ||
} | ||
.nav a[href][aria-current="page"] { | ||
text-decoration: underline; | ||
} | ||
|
||
/* Posts list */ | ||
.postlist { | ||
list-style: none; | ||
padding: 0; | ||
padding-left: 1.5rem; | ||
} | ||
.postlist-item { | ||
display: flex; | ||
flex-wrap: wrap; | ||
align-items: baseline; | ||
counter-increment: start-from -1; | ||
margin-bottom: 1em; | ||
} | ||
.postlist-item:before { | ||
display: inline-block; | ||
pointer-events: none; | ||
content: "" counter(start-from, decimal-leading-zero) ". "; | ||
line-height: 100%; | ||
text-align: right; | ||
margin-left: -1.5rem; | ||
} | ||
.postlist-date, | ||
.postlist-item:before { | ||
font-size: 0.8125em; /* 13px /16 */ | ||
color: var(--color-gray-90); | ||
} | ||
.postlist-date { | ||
word-spacing: -0.5px; | ||
} | ||
.postlist-link { | ||
font-size: 1.1875em; /* 19px /16 */ | ||
font-weight: 700; | ||
flex-basis: calc(100% - 1.5rem); | ||
padding-left: .25em; | ||
padding-right: .5em; | ||
text-underline-position: from-font; | ||
text-underline-offset: 0; | ||
text-decoration-thickness: 1px; | ||
} | ||
.postlist-item-active .postlist-link { | ||
font-weight: bold; | ||
} | ||
|
||
/* Tags */ | ||
.post-tag { | ||
display: inline-flex; | ||
align-items: center; | ||
justify-content: center; | ||
text-transform: capitalize; | ||
font-style: italic; | ||
} | ||
.postlist-item > .post-tag { | ||
align-self: center; | ||
} | ||
|
||
/* Tags list */ | ||
.post-metadata { | ||
display: inline-flex; | ||
flex-wrap: wrap; | ||
gap: .5em; | ||
list-style: none; | ||
padding: 0; | ||
margin: 0; | ||
} | ||
.post-metadata time { | ||
margin-right: 1em; | ||
} | ||
|
||
/* Direct Links / Markdown Headers */ | ||
.header-anchor { | ||
text-decoration: none; | ||
font-style: normal; | ||
font-size: 1em; | ||
margin-left: .1em; | ||
} | ||
a[href].header-anchor, | ||
a[href].header-anchor:visited { | ||
color: transparent; | ||
} | ||
a[href].header-anchor:focus, | ||
a[href].header-anchor:hover { | ||
text-decoration: underline; | ||
} | ||
a[href].header-anchor:focus, | ||
:hover > a[href].header-anchor { | ||
color: #aaa; | ||
} | ||
|
||
h2 + .header-anchor { | ||
font-size: 1.5em; | ||
}</style> | ||
</head> | ||
<body> | ||
<a href="#skip" class="visually-hidden">Skip to main content</a> | ||
|
||
<header> | ||
<a href="/eleventy-base-blog/" class="home-link">Eleventy Base Blog v8</a> | ||
<nav> | ||
<h2 class="visually-hidden">Top level navigation menu</h2> | ||
<ul class="nav"> | ||
<li class="nav-item"><a href="/eleventy-base-blog/">Home</a></li> | ||
<li class="nav-item"><a href="/eleventy-base-blog/blog/">Archive</a></li> | ||
<li class="nav-item"><a href="/eleventy-base-blog/about/">About Me</a></li> | ||
</ul> | ||
</nav> | ||
</header> | ||
|
||
<main id="skip"> | ||
<!-- Delete this message, it will also remove the component CSS from the bundle --> | ||
<div class="message-box"> | ||
<ol> | ||
<li>Edit the <code>_data/metadata.js</code> with your blog’s information.</li> | ||
<li>(Optional) Edit <code>eleventy.config.js</code> with your <a href="https://www.11ty.dev/docs/config/">configuration preferences</a>.</li> | ||
<li>Delete this message from <code>_includes/layouts/home.njk</code>.</li> | ||
</ol> | ||
<p><em>This is an <a href="https://www.11ty.dev/">Eleventy project</a> created from the <a href="https://github.com/11ty/eleventy-base-blog"><code>eleventy-base-blog</code> repo</a>.</em></p> | ||
</div> | ||
<!-- Stop deleting --> | ||
|
||
<h1 id="content-not-found" tabindex="-1">Content not found. <a class="header-anchor" href="#content-not-found">#</a></h1> | ||
<p>Go <a href="/eleventy-base-blog/">home</a>.</p> | ||
<!-- | ||
Read more: https://www.11ty.dev/docs/quicktips/not-found/ | ||
This will work for both GitHub pages and Netlify: | ||
* https://help.github.com/articles/creating-a-custom-404-page-for-your-github-pages-site/ | ||
* https://www.netlify.com/docs/redirects/#custom-404 | ||
--> | ||
|
||
|
||
</main> | ||
</main> | ||
|
||
<footer></footer> | ||
<footer></footer> | ||
|
||
<!-- Current page: /eleventy-base-blog/404.html --> | ||
</body> | ||
<!-- Current page: /eleventy-base-blog/404.html --> | ||
</body> | ||
</html> |
Oops, something went wrong.