Notebook

About this template

A technical blog for one writer: a home page with the latest posts and featured series, a post layout with syntax-highlighted code blocks, copy buttons, heading links, an outline that follows your reading and series navigation, plus an archive by year, a tag browser, instant search, projects, an about and now page and a newsletter sign-up. Graph-paper styling with a light and a dark theme, including the code.

Features

• Code blocks with a language label, a copy button and a syntax theme for light and dark mode
• Table of contents that highlights the section you are reading, plus heading links that copy the section's address
• Reading progress bar and a reading time counted from the text
• Series box and older/newer post links built from one post index
• Archive grouped by year with jump links
• Tag browser with shareable ?tag= links (any case, unknown tags ignored)
• Instant search over titles, summaries, tags and series, with highlighted matches and a "/" shortcut from any page
• Dark mode that remembers the choice, with no flash on load
• Validated newsletter forms, an RSS address with a copy button and an accessible mobile menu
• Graph-paper design with hand-made SVG illustrations, scroll reveals that respect reduced motion and a back-to-top button

Pages included

• Homeindex.html
• Postpost.html
• Archivearchive.html
• Tagstags.html
• Seriesseries.html
• Searchsearch.html
• Aboutabout.html
• Projectsprojects.html
• Subscribesubscribe.html
• 404404.html

Quick start

unzip notebook.zip && cd notebookopen index.html        # that's it # optional, after adding new Tailwind classes:npm install && npm run build

Changelog