Skip to content

Repository for a template blog website built out using Eleventy static site generator and Stylus CSS preprocessor

License

Notifications You must be signed in to change notification settings

ar363/eleventy-stylus-blog-theme

Repository files navigation

Eleventy + Stylus Blog theme

Netlify Status Build Status Vercel Status

A theme repository that contains a blog built with Eleventy and Stylus

Features

  • 100% Lighthouse scores
  • Toggleable dark theme (PS. theme preference is also stored in localStorage)
  • Tags as taxonomy
  • Stylus CSS preprocessor
  • Integrated with Eleventy's official navigation plugin
  • Also generates Atom RSS Feed with Eleventy's official RSS plugin
  • Sitemap generation
  • Non-post pages support (eg. About page, Contact page)
  • Modular type scale implemented in with Stylus

Demos

Screenshots

Light theme light theme website homepage screenshot

Dark theme dark theme website homepage screenshot

Deploy this template to your own site

Get your site up and running with a few clicks

Prerequisites for local development

Node.js LTS

Getting started locally

  1. Clone this repo
git clone https://github.com/ar363/eleventy-stylus-blog-theme my-blog
  1. Navigate to the blog directory
cd my-blog
  1. Install dependencies
npm i
  1. Edit _data/site.js according to your site preferences

  2. Also optionally modify stylus/abstracts/variables.styl according to your preference

To watch for changes in Eleventy and Stylus, use npm run dev

To build without watching for changes, use npm run build