diff --git a/_includes/note.pug b/_includes/note.pug new file mode 100644 index 0000000..b6416e7 --- /dev/null +++ b/_includes/note.pug @@ -0,0 +1,22 @@ +doctype html +html(lang='en') + head + include /head.pug + + //- Styles + link(rel='stylesheet', href='/public/styles/post.css') + link(rel='stylesheet', href='https://unpkg.com/prismjs@1.20.0/themes/prism.css') + body + include /header.pug + + main.line-numbers + h1= title + p.meta + time.pubtime(datetime=page.date.toISOString())= page.date.toDateString() + if location + | ,  + = location + hr + article(class=(asciiDoctor ? "asciidoctor" : ""))!= content + + include /footer.pug diff --git a/gulpfile.js b/gulpfile.js new file mode 100644 index 0000000..eb40700 --- /dev/null +++ b/gulpfile.js @@ -0,0 +1,48 @@ +const { watch, src, dest, parallel, series } = require("gulp") +const asciidoctor = require("@asciidoctor/gulp-asciidoctor") +const grayMatter = require("gulp-gray-matter") +const tap = require("gulp-tap") +const rename = require("gulp-rename") + +function convertAdoc () { + return src("notes/**/*.adoc") + .pipe(grayMatter()) + .pipe(asciidoctor({ + standalone: false + })) + .pipe(tap(function(file) { + file.contents = Buffer.concat([ + new Buffer("---\nasciiDoctor: true\ntemplateEngineOverride: false\n---\n"), + file.contents + ]) + })) + .pipe(dest("notes")) +} + +function extractFrontMatterFromAdoc () { + return src("notes/**/*.adoc") + .pipe(grayMatter()) + .pipe(tap(function(file) { + file.contents = new Buffer(JSON.stringify(file.data)) + })) + .pipe(rename(function(path) { + path.extname = ".11tydata.json"; + })) + .pipe(dest("notes")) +} + +function processAdoc (cb) { + parallel( + convertAdoc, + extractFrontMatterFromAdoc)(cb) +} + +function watchAdoc () { + watch('notes/**/*.adoc', processAdoc) +}; + +exports.processAdoc = processAdoc; + +exports.default = parallel( + processAdoc, + watchAdoc) diff --git a/index.pug b/index.pug index e9e6231..cc763dc 100644 --- a/index.pug +++ b/index.pug @@ -1,8 +1,5 @@ --- eleventyExcludeFromCollections: true -pagination: - data: collections.all - size: 2 title: "Vlad Faust Blog" titleNoAppend: true description: "Vlad Faust's personal blog" @@ -20,11 +17,18 @@ html(lang='en') include /header.pug main - h2 Recent posts + h2 Articles ul.posts - each post in collections.all.reverse().filter((post) => !post.data.hidden) + each post in collections.post.reverse().filter((post) => !post.data.hidden) li span.date= post.date.toDateString() a.title(href=post.url)= post.data.title + h2 Notes + ul.notes + each note in collections.note.reverse().filter((note) => !note.data.hidden) + li + span.date= note.date.toDateString() + a.title(href=note.url)= note.data.title + include /footer.pug diff --git a/notes/.gitignore b/notes/.gitignore new file mode 100644 index 0000000..29b54d4 --- /dev/null +++ b/notes/.gitignore @@ -0,0 +1,2 @@ +*.html +*.11tydata.json diff --git a/notes/notes.json b/notes/notes.json new file mode 100644 index 0000000..280ae2a --- /dev/null +++ b/notes/notes.json @@ -0,0 +1,4 @@ +{ + "tags": "note", + "layout": "note.pug" +} diff --git a/package.json b/package.json index d768f2c..2c60bc5 100644 --- a/package.json +++ b/package.json @@ -6,15 +6,19 @@ "private": "true", "scripts": { "debug": "DEBUG=* npx @11ty/eleventy", - "dev": "npx @11ty/eleventy --serve", - "build": "npx @11ty/eleventy" + "dev": "npx concurrently \"npx gulp\" \"npx @11ty/eleventy --serve\"", + "build": "npx gulp processAdoc && npx @11ty/eleventy" }, "keywords": [], "author": "Vlad Faust ", "license": "None", "devDependencies": { - "@11ty/eleventy": "^0.11.0", "@11ty/eleventy-plugin-syntaxhighlight": "^3.0.1", + "@asciidoctor/gulp-asciidoctor": "^2.2.5", + "asciidoctor.js": "1.5.9", + "gulp-gray-matter": "^3.0.1", + "gulp-rename": "^2.0.0", + "gulp-tap": "^2.0.0", "markdown-it-anchor": "^5.3.0", "markdown-it-attrs": "^3.0.3", "markdown-it-container": "^3.0.0", diff --git a/posts/posts.json b/posts/posts.json index 63c6976..f6347e1 100644 --- a/posts/posts.json +++ b/posts/posts.json @@ -1,3 +1,4 @@ { + "tags": "post", "layout": "post.pug" } diff --git a/public/styles/post.css b/public/styles/post.css index 3ee01ea..50e9dc0 100644 --- a/public/styles/post.css +++ b/public/styles/post.css @@ -64,7 +64,8 @@ article > h2, article > h3, article > h4, article > h5, -article > h6 +article > h6, +article.asciidoctor .paragraph { margin-left: 1rem; margin-right: 1rem; @@ -96,17 +97,36 @@ blockquote { background-color: rgba(0, 0, 0, 0.025); } -pre[class*="language-"] { +pre[class*="language-"], pre.highlight { width: 100%; box-sizing: border-box; max-width: 100vw; } +pre.highlight { + background-color: rgba(0, 0, 0, 0.1); + padding: 1rem; + overflow: auto; +} + code { background-color: rgba(0, 0, 0, 0.15); /* padding: 0 0.25rem; */ } +article.asciidoctor .exampleblock { + width: 100%; + box-sizing: border-box; + max-width: 100vw; + padding: 0.5rem 1rem; + background-color: rgba(0, 0, 0, 0.05); +} + +article.asciidoctor .listingblock > .title { + font-style: italic; + margin-bottom: -0.5rem; +} + details { max-width: 100vw; margin-top: 1rem;