Atom One Chroma

Chroma compatible stylesheets using Atom's lovely One Dark Syntax and One Light Syntax Syntax themes.

Usage

Get the stylesheets on jsDelivr or consume the NPM package and access built stylesheets from dist.

How it works

NPM build script copies LESS stylesheet files from GitHub repositories for One Dark Syntax and One Light Syntax into a temp directory, at which point each of them are converted to vanilla CSS using LESS compiler, minified with clean-css and output to the dist directory.

Development

1. Clone this repository with git clone.
2. Install NPM dependencies with npm install.
3. Run npm run build to generate stylesheets.

See dist folder for light and dark Atom One stylesheets.

Note: By default, generated stylesheets assume your highlighted code sits in a container with class highlight, e.g.

<div class="highlight">
  <pre>
    <code>...</code>
  </pre>
</div>

If you are not using highlight as your wrapper class change the wrapper class name in styles.less before building.

Pygments support

Supports code snippets generated with Pygments 2.2.0 and earlier though future versions may be supported.

Credits

This tool was inspired by Richard Leland, Mihály Gyöngyösi and Alex Wood from their following creative works:

• https://github.com/mgyongyosi/OneDarkJekyll/
• https://github.com/richleland/pygments-css
• https://gist.github.com/awood/9651461

License

Copyright (C) 2017–2018 Josh Habdas [e-mail]

This work is free. You can redistribute it and/or modify it under the terms of the Do What The Fuck You Want To Public License, Version 2, as published by Sam Hocevar. See the COPYING file for more details.