diff --git a/docs/creating-a-theme.md b/docs/creating-a-theme.md index 3fa872934..5f6be8d1f 100644 --- a/docs/creating-a-theme.md +++ b/docs/creating-a-theme.md @@ -6,71 +6,76 @@ ## Overview -* Explain the difference between ui themes and syntax themes +Atom is built using web technologies, the interface is rendered using HTML and +it's styled via [LESS] (a superset of CSS). Don't worry if you haven't +heard of LESS before, it's just like CSS but with a few handy extensions. + +Since CSS is the basis of the theming system, we can load multiple themes within +Atom and it behaves just like a website. Themes loaded first are overridden by +themes which are loaded later (the order is controlled from within the Settings +pane). + +This flexibility is helpful for users which prefer a light interface with a dark +syntax theme. Atom only has interface and syntax themes currently but it's easy +see how one might want to create their own language specific syntax theme for +very specific styling. ## Getting Started -* What do I need to install? - * Atom - to edit text - * Git - to track and distribute your themes -* What do I need to know? - * CSS/LESS - as that's what themes are written in - * Devtools - so you can find the selector you're looking for. -* Is there an example I can start from? - * Yes, you can clone https://github.com/atom/solarized-dark-syntax +To create your own theme you'll need a few things: -# Create a minimal syntax theme +* A working install of [Atom], so you can work on your new theme. +* A working install of [git] to track changes. +* A [GitHub] account, so you can distribute your themes. -```bash -cd ~/.atom/packages -mkdir my-theme -cd my-theme -git init -mkdir stylesheets -apm init --theme -cat > index.less < stylesheets/base.less < stylesheets/overrides.less <