chameleon-dark-syntax theme
Atom syntax theme for HTML, CSS, LESS, SASS, SCSS, JavaScript and JSON. It is a syntax theme only, and will not affect the Atom UI (it works with both the Light UI scheme, and Dark UI scheme). Recommended using with seti-ui.
Installation
Run the following command:
apm install chameleon-dark-syntax
Then go to Atom > Preferences > Themes
and in the Syntax Themes
dropdown, select Chameleon Dark
from the list.
Optional customization for seti-ui theme
These are optional preferences to work with the seti-ui.
Go to Atom > Open Your Stylesheet
and in the css file, past the following styles:
.editor {
// change cursor to alien green
.cursor {
color: #00FF00;
}
}
// change seti-ui html tree icon to green
.name.icon[data-name*=".html"] {
&.icon-file-text:before {
color: #408000;
}
}
// change seti-ui styles tree icon to purple
.name.icon[data-name*=".less"],
.name.icon[data-name*=".sass"],
.name.icon[data-name*=".scss"],
.name.icon[data-name*=".css"] {
&.icon-file-text:before {
color: #C21BFF;
}
}
.tab-bar .tab {
// change seti-ui styles tab icon to purple
.title[data-name*=".css"]:before,
.title[data-name*=".less"]:before,
.title[data-name*=".sass"]:before,
.title[data-name*=".scss"]:before {
color: #C21BFF;
}
// change seti-ui html tab icon to green
.title[data-name*=".html"]:before {
color: #408000;
}
// change seti-ui selected tab to gray
&.active,
&.active:before {
border-bottom: solid 4px #555;
}
}
// change tree view selected to gray
.focusable-panel:focus .selected:before {
background: #555;
}