Oaxaca syntax theme

A minimal syntax theme for Atom.

Current syntax support: CSS, HTML, Handlebars, Javascript, JSON, Less, Sass.

JS syntax screenshot

Screenshot: UI theme - One Dark. Font - Source Code Pro.

Contributing

Contributions are very welcome 🌟

An Atom syntax theme is essentially just CSS. You will be writing in Less (a CSS pre-processor), but the build process is already set up for you so it's super easy.

The only file you will need to touch is base.less - take a look to see just how easy it is to add new syntax highlighting.

Process

Fork the Oaxaca syntax theme repository.
Make your changes.
Make a pull request.
Your pull request will then be reviewed, merged and released!

Setting up Atom for theme development

Working on a theme locally is really easy in Atom. Follow the steps below and the theme will live reload as you work on it:

First, install Oaxaca syntax theme - apm link /local/path/to/oaxaca-syntax-theme.
Then enable Oaxaca as your syntax theme in Atom - Atom > Preferences > Themes.
Then open /local/path/to/oaxaca-syntax-theme in dev mode - View > Developer > Open in dev mode.

Atom is built with web technologies and has Chrome dev tools baked in. This is exceptionally helpful for syntax development as it allows us to easily inspect an element within Atom and grab the associated classes. We can then target those classes in our CSS. The OSX shortcut to open dev tools in Atom is ⌘+⌥+i. Then hit the magnifying glass icon to inspect elements.

Committing

This repository uses Commitizen to guide you through the process of writing commit messages that follow Angular's commit message conventions.

First, install Commitizen and dependencies with npm install. Then git add your changes and commit with npm run commit. You will then be prompted for various pieces of information about the changes you have made.

Take a look at the existing commits if you're a little unsure.

Thank you!