UI-THEME: Atom Dark Syntax Theme: Base16 Tomorrow Dark
Created
April 11, 2017 15:24
-
-
Save jmahc/38e836ba7caedbcf323218cb7feae065 to your computer and use it in GitHub Desktop.
atom settings
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* | |
* Your Stylesheet | |
* | |
* This stylesheet is loaded when Atom starts up and is reloaded automatically | |
* when it is changed and saved. | |
* | |
* Add your own CSS or Less to fully customize Atom. | |
* If you are unfamiliar with Less, you can read more about it here: | |
* http://lesscss.org | |
*/ | |
/* | |
* Examples | |
* (To see them, uncomment and save) | |
*/ | |
// style the background color of the tree view | |
// .tree-view { | |
// background-color: whitesmoke; | |
// } | |
// style the background and foreground colors on the atom-text-editor-element itself | |
// atom-text-editor { | |
// color: white; | |
// background-color: hsl(180, 24%, 12%); | |
// } | |
// To style other content in the text editor's shadow DOM, use the ::shadow expression | |
// atom-text-editor::shadow .cursor { | |
// border-color: red; | |
// } | |
// ==== Ligature fonts for atom | |
// JM 12/14/2016 | |
// Reference (original): https://medium.com/@docodemore/an-alternative-to-operator-mono-font-6e5d040e1c7e#.nm9fchwv1 | |
// Reference (improved): https://gist.github.com/MattMcFarland/e41ef709b1d82adea800563a86805559#gistcomment-1835618 | |
// @size16: 16px; | |
// @size24: 24px; | |
// @stringUnquotedColor: #CDD3DE; | |
// atom-text-editor { | |
// font-family: 'Fira Code'; | |
// font-style: normal; | |
// text-rendering: optimizeLegibility; | |
// // letter-spacing: 1.45px; | |
// | |
// &::shadow { | |
// .string.quoted, | |
// .string.regexp { | |
// -webkit-font-feature-settings: "liga" off, "calt" off; | |
// } | |
// .source.js.jsx > .keyword.control.flow.js, | |
// .storage, .type .function { | |
// vertical-align: baseline; | |
// font-family: 'flottflott'; | |
// height: inherit; | |
// font-size: @size24; | |
// line-height: @size16; | |
// } | |
// .source.js.jsx, | |
// .storage.type.function.arrow.js, | |
// .indent-guide, | |
// .variable { | |
// font-family: 'Fira Code'; | |
// font-style: normal; | |
// font-size: @size16; | |
// line-height: @size24; | |
// } | |
// .string.unquoted.js { | |
// color: @stringUnquotedColor; | |
// } | |
// .entity.name { | |
// font-weight: 500; | |
// } | |
// } | |
// } | |
// ==== Operator Mono font styles | |
// Originally referenced here: https://gist.github.com/brandondurham/3828ac42766f9f187c8e | |
atom { | |
&-workspace, | |
&-text-editor { | |
font-family: 'Operator Mono'; | |
font-size: 16px; | |
font-weight: 500; | |
line-height: 1.7; | |
text-rendering: optimizeLegibility; | |
} | |
&-text-editor { | |
&, | |
&::shadow { | |
// Commented out code | |
.comment, | |
// <Button `className` | |
.entity.other.attribute-name, | |
// console.log(...) | |
.syntax--support.syntax--console.syntax--js, | |
// let/const | |
// .syntax--storage.syntax--type.syntax--js:not(.syntax--extends), | |
// `this` | |
.syntax--this.syntax--js, | |
// `switch (Word)` or `case` or `default` | |
.syntax--control.syntax--switch.syntax--js, | |
// function () {...} | |
.syntax--storage.syntax--type.syntax--function.syntax--js, | |
// `extends` but NOT `default` -> extends default | |
// Assumes that `extends` is always followed by `default` | |
.syntax--keyword.syntax--control.syntax--module.syntax--js:nth-child(1), | |
// `class` class Home extends Component {...} | |
.syntax--storage.syntax--type.syntax--class.syntax--js { | |
font-style: italic; | |
} | |
} | |
// `null` | |
.syntax--null.syntax--js, | |
// `undefined` | |
.syntax--undefined.syntax--js { | |
font-weight: 500; | |
} | |
// CSS | |
.syntax--entity.syntax--other.syntax--attribute-name.syntax--class.syntax--css, | |
.syntax--entity.syntax--other.syntax--attribute-name.syntax--pseudo-element.syntax--css, | |
.syntax--entity.syntax--other.syntax--attribute-name.syntax--parent-selector.syntax--css { | |
font-style: normal; | |
} | |
&::shadow { | |
// class `Home` extends `Blah` | |
.entity.name { | |
font-weight: 500; | |
} | |
.string.quoted, | |
.string.regexp { | |
-webkit-font-feature-settings: "liga" off, "calt" off; | |
} | |
.string.unquoted.js { | |
color: #CDD3DE; | |
} | |
// `=>` | Arrow functions | |
.syntax--type.syntax--function.syntax--arrow.syntax--js, | |
// `===`, `!==`, etc. | Operators | |
.syntax--operator.syntax--comparison.syntax--js { | |
font-family: 'Fira Code'; | |
font-style: normal; | |
font-size: 15px; | |
line-height: 1.7; | |
} | |
} | |
} | |
// left pane / tree view | |
&-panel.tool-panel { | |
font-size: 0.88em; | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment