All Projects → tejasbubane → hakyll-css

tejasbubane / hakyll-css

Licence: MIT license
Drop-in CSS themes for syntax highlighting in Hakyll

Programming Languages

CSS
56736 projects

Projects that are alternatives of or similar to hakyll-css

hakyll-shortcut-links
✂️ Hakyll shortcut-links in markdown files
Stars: ✭ 12 (-55.56%)
Mutual labels:  hakyll
hakyll-nix-template
Hakyll + Nix starter template
Stars: ✭ 20 (-25.93%)
Mutual labels:  hakyll
hakyll-images
Hakyll utilities to work with images
Stars: ✭ 13 (-51.85%)
Mutual labels:  hakyll
hakyll-bootstrap
Basic Hakyll + Bootstrap site
Stars: ✭ 26 (-3.7%)
Mutual labels:  hakyll
curry-club-augsburg.de
Our Website
Stars: ✭ 17 (-37.04%)
Mutual labels:  hakyll

Pandoc CSS for Hakyll

Drop-in CSS for code highlighting in Hakyll. Extracted from pandoc (skylighting) thanks to this blog.

Long story

Hakyll is a Haskell library for generating static sites which uses Pandoc for code syntax highlighting. But Hakyll by default does not include any CSS for highlighting your code. So even if pandoc adds CSS classes to the generated HTML, you won't be able to see any highlighting. This is probably because Hakyll wants users to have control of how to style their blog.

But the problem is CSS for pandoc is not easily available that is when I stumbled upon this blogpost.

Interstingly pandoc uses Skylighting internally which comes bundled with a bunch of themes. But those themes are not readily available as CSS files in the repo - they are generated from code. That blogpost explained how to generate CSS from Skylighting. So I went ahead and generated them for all available themes! 🎉

Usage

Look at the screenshots below, pick up css file for the one you like and drop into your css.

Screenshots

Here's how they look:

  1. breezeDark

    breezeDark theme screenshot

  2. espresso

    espresso theme screenshot

  3. haddock

    haddock theme screenshot

  4. kate

    kate theme screenshot

  5. monochrome

    monochrome theme screenshot

  6. pygments

    pygments theme screenshot

  7. tango

    tango theme screenshot

  8. zenburn

    zenburn theme screenshot

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].