Atom-one-pgyments NPM

Atom One Pygments

A tool for generating Pygments and Chroma stylesheets using Atom's lovely One Dark and One Light Syntax themes.

How it works

NPM scripts are used to copy the LESS stylesheet files from One Dark Syntax and One Light Syntax into a temp folder, at which point each of them are converted to vanilla CSS using the LESS compiler, and minified with clean-css before being output to the dist directory.

Supports code snippets generated with Pygments 2.2.0 and earlier, and includes the user-select css selection rule on the linenos class in an effort to help prevent users from copying line numbers when selecting code snippets.

Usage

Clone the repository using git clone
Install NPM dependencies with npm i
Run npm run build to generate stylesheets

The above will generate two minified stylesheets in the dist directory, aptly named dark.css and light.css, for use in highlighting code.

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 using a different wrapper class with Pygments, the wrapper name can be changed in pygments.less before building. Additional customizations are also possible as outlined in the file. Get creative.

Contributing

Please feel free to submit an issue if spot any bugs or need help understanding how to use this tool. Enhancement requests should come in the form of a pull request demonstrating your suggested changes.

Credits

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

License

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.

syntax highlight pygments atom

6 years ago

6 years ago

6 years ago

7 years ago