Set up a basic page hierarchy
This commit is contained in:
parent
29fca76702
commit
9001771f1c
10 changed files with 54 additions and 20 deletions
17
.eleventy.js
17
.eleventy.js
|
|
@ -5,6 +5,19 @@ module.exports = function (config) {
|
|||
files: './_site/assets/*.css'
|
||||
})
|
||||
|
||||
config.addFilter("toISODate", (dateObj) =>
|
||||
DateTime.fromJSDate(dateObj).toISODate())
|
||||
config.addPassthroughCopy("src/assets/ibm-plex/IBM-Plex-Mono/fonts/**/*")
|
||||
|
||||
// template filters
|
||||
config.addFilter('toJSON', obj => JSON.stringify(obj))
|
||||
config.addFilter('toISODate', date => DateTime.fromJSDate(date).toISODate())
|
||||
|
||||
// returns classes to be used on <body>, given a page's url
|
||||
config.addFilter('pageClasses', url => {
|
||||
const segments = url.split('/').filter(s => s)
|
||||
return segments.length ? segments.join(' ') : 'home'
|
||||
})
|
||||
|
||||
return {
|
||||
markdownTemplateEngine: "njk"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
"build:eleventy": "eleventy --input=src/",
|
||||
"build:sass": "mkdir -p _site/assets/ && sassc src/assets/style.scss > _site/assets/style.css",
|
||||
"build": "pnpm build:sass && pnpm build:eleventy",
|
||||
"watch:eleventy": "eleventy --serve --input=src/ --incremental",
|
||||
"watch:eleventy": "eleventy --serve --input=src/",
|
||||
"watch:sass": "ls src/**/*.{scss,sass} 2>/dev/null | entr pnpm build:sass",
|
||||
"start": "scripts/serve.sh"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
# Page header
|
||||
6
src/_data/page.js
Normal file
6
src/_data/page.js
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
module.exports = config => {
|
||||
return {
|
||||
"title": "arnes.space",
|
||||
"baseUrl": "https://arnes.space"
|
||||
}
|
||||
}
|
||||
5
src/_includes/posts.njk
Normal file
5
src/_includes/posts.njk
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
{% extends "root.njk" %}
|
||||
|
||||
{% block navigation %}
|
||||
<a href="{{ "/" | url }}">← Home</a>
|
||||
{% endblock %}
|
||||
|
|
@ -1,23 +1,20 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>{{ title }}</title>
|
||||
<title>{{ page.title }}</title>
|
||||
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>🌌</text></svg>">
|
||||
<link rel="stylesheet" href="assets/style.css" />
|
||||
<link rel="stylesheet" href="{{ '/assets/style.css' | url }}" />
|
||||
</head>
|
||||
<body>
|
||||
<main class="home">
|
||||
<main class="{{ page.url | pageClasses }}">
|
||||
<header></header>
|
||||
<nav>
|
||||
<h1>arnes.space</h1>
|
||||
<h2>Recent Posts</h2>
|
||||
<ul>
|
||||
{%- for post in collections.post -%}
|
||||
<li{% if page.url == post.url %} aria-current="page"{% endif %}>{{ post.date | toISODate }} -- <a href="{{post.url}}">{{ post.data.title }}</a></li>
|
||||
{%- endfor -%}
|
||||
</ul>
|
||||
<h1>{{ page.title }}</h1>
|
||||
{% block navigation %}
|
||||
{% endblock %}
|
||||
</nav>
|
||||
<article>
|
||||
{{ content | safe }}
|
||||
|
|
@ -20,7 +20,8 @@ html, body {
|
|||
|
||||
body {
|
||||
background: #fefefe;
|
||||
font-family: 'IBM Plex Mono', 'Menlo', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', Courier, monospace;
|
||||
color: #222;
|
||||
font-family: monospace;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
|
@ -93,6 +94,10 @@ nav {
|
|||
article {
|
||||
grid-area: content;
|
||||
|
||||
h2 {
|
||||
padding: 16px 0
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 0 0 0 16px;
|
||||
margin: 0 0 32px;
|
||||
|
|
|
|||
|
|
@ -1,4 +0,0 @@
|
|||
---
|
||||
layout: layout.njk
|
||||
---
|
||||
# Hello, World!
|
||||
10
src/index.njk
Normal file
10
src/index.njk
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
{% extends "root.njk" %}
|
||||
|
||||
{% block navigation %}
|
||||
<h2>Recent Posts</h2>
|
||||
<ul>
|
||||
{%- for post in (collections.posts | reverse) -%}
|
||||
<li{% if page.url == post.url %} aria-current="page"{% endif %}><time datetime="{{post.date}}">{{ post.date | toISODate }}</time> -- <a href="{{post.url}}">{{ post.data.title }}</a></li>
|
||||
{%- endfor -%}
|
||||
</ul>
|
||||
{% endblock %}
|
||||
|
|
@ -1 +1,4 @@
|
|||
{"tags": "post"}
|
||||
{
|
||||
"tags": "posts",
|
||||
"layout": "posts.njk"
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue