Skip to content

Instantly share code, notes, and snippets.

@BenGitsCode
Forked from abe33/atom_config.md
Created May 18, 2016 04:44
Show Gist options
  • Save BenGitsCode/8f8389b301c843b4cc4764dad215a9e4 to your computer and use it in GitHub Desktop.
Save BenGitsCode/8f8389b301c843b4cc4764dad215a9e4 to your computer and use it in GitHub Desktop.

My Atom Config

Atom Editor Screenshot

Theme:

  • atom-dark-ui
  • atom-solarized-dark
  • plus custom styles.less rules

Installed packages:

  • atom-color-highlight
  • bezier-curve-editor
  • block-travel
  • coffeedocs
  • coffee-compile
  • coffee-lint
  • color-picker
  • crosshairs
  • font-viewer
  • highlight-selected
  • mark
  • minimap
  • minimap-color-highlight
  • minimap-find-and-replace
  • minimap-git-diff
  • minimap-highlight-selected
  • project-manager
  • project-palette-finder
  • travis-ci-status
  • term2
  • git-blame
  • zentabs
  • language-haml
  • language-jade
  • Stylus
  • Sublime-Style-Column-Selection
  • cut-line
  • red-wavy-line
  • scroll-past-end
  • emmet
  • figlet
// Solarized colors
//
// @base05: rgb(0, 26, 27);
// @base04a: lighten(rgb(0, 34, 41), 10%);
// @base04: rgb(0, 34, 41);
// @base03: rgb(0, 43, 54);
// @base02: rgb(7, 54, 66);
// @base01a: rgb(6, 74, 87);
// @base01: rgb(88, 110, 117);
// @base00: rgb(101, 123, 131);
// @base0: rgb(131, 148, 150);
// @base1: rgb(147, 161, 161);
// @base2: rgb(238, 232, 213);
// @base3: rgb(253, 246, 227);
// @yellow: rgb(181, 137, 0);
// @orange: rgb(203, 75, 22);
// @red: rgb(220, 50, 47);
// @magenta: rgb(211, 54, 130);
// @violet: rgb(108, 113, 196);
// @blue: rgb(38, 139, 210);
// @cyan: rgb(42, 161, 152);
// @green: rgb(133, 153, 0);
@base05: #1c1f26;
@base04a: #232830;
@base04: #2B303B;
@base03: #343D46;
@base02: #4F5B66;
@base01a: lighten(@base02, 10%);
@base01: #65737E;
@base00: lighten(@base01, 20%);
@base0: #A7ADBA;
@base1: #C0C5CE;
@base2: #DFE1E8;
@base3: #EFF1F5;
@yellow: #EBCB8B;
@orange: #D08770;
@red: #AB7967;
@magenta: #BF616A;
@violet: #B48EAD;
@blue: #8FA1B3;
@cyan: #96B5B4;
@green: #A3BE8C;
// Dark UI Customized
// ######## ### ######## ######
// ## ## ## ## ## ## ##
// ## ## ## ## ## ##
// ## ## ## ######## ######
// ## ######### ## ## ##
// ## ## ## ## ## ## ##
// ## ## ## ######## ######
//
// .tab-bar {
// background: @base05;
//
// .tab {
// box-shadow: inset -1px 1px 0 @base03, 4px -4px 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base04, @base05);
// }
//
// .tab:before {
// box-shadow: inset 1px 1px 0 @base03, -4px -4px 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base04, @base05);
// }
//
// .tab:after {
// box-shadow: inset 0px 1px 0 @base03, 4px 0 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base04, @base05);
// }
//
// .tab.active {
// box-shadow: inset -1px 1px 0 @base01a, 4px -4px 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base02, @base04);
// }
//
// .tab.active:before {
// box-shadow: inset 1px 1px 0 @base01a, -4px -4px 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base02, @base04);
// }
//
// .tab.active:after {
// box-shadow: inset 0px 1px 0 @base01a, 4px 0px 4px rgba(0, 0, 0, 0.1);
// background-image: -webkit-linear-gradient(top, @base02, @base04);
// }
//
// .close-icon {
// right: 0 !important;
// }
// }
// .tab-bar:after {
// background: @base04;
// border-bottom-color: @base05;
// border-top-color: @base02;
// }
//
// ######## ######## ######## ######## ## ## #### ######## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ######## ###### ###### ## ## ## ###### ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ######## ######## ### #### ######## ### ###
.list-tree li.list-nested-item.status-ignored > .list-item, .list-group li:not(.list-nested-item).status-ignored, .list-tree li:not(.list-nested-item).status-ignored, .list-group li.list-nested-item.status-ignored > .list-item, .list-tree li.list-nested-item.status-ignored > .list-item {
color: @base03;
}
.list-group li:not(.list-nested-item), .list-tree li:not(.list-nested-item), .list-group li.list-nested-item > .list-item, .list-tree li.list-nested-item > .list-item {
color: @base01;
}
.list-tree li.list-nested-item.status-modified > .list-item, .list-group li:not(.list-nested-item).status-modified, .list-tree li:not(.list-nested-item).status-modified, .list-group li.list-nested-item.status-modified > .list-item, .list-tree li.list-nested-item.status-modified > .list-item {
color: @yellow;
}
.list-tree li.list-nested-item.status-added > .list-item, .list-group li:not(.list-nested-item).status-added, .list-tree li:not(.list-nested-item).status-added, .list-group li.list-nested-item.status-added > .list-item, .list-tree li.list-nested-item.status-added > .list-item {
color: @green;
}
.workspace, .tree-view {
background: @base05;
}
.list-group .selected:before, .list-tree .selected:before {
background: @base03;
}
.tree-view:focus, .item-views {
background: @base04a;
}
// ###### ## ## ######## ###### ####### ########
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ##
// ## ## ## ######## ###### ## ## ########
// ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ###### ####### ## ## ###### ####### ## ##
.line.cursor-line, .line-number.cursor-line-no-selection {
background: rgba(255, 255, 255, 0.1);
}
.pane.active .editor .highlight-selected .marker .region {
border-color: @blue;
}
.editor.is-focused .line.cursor-line {
background: rgba(255, 255, 255, 0.1);
}
// ## ## #### ## ## #### ## ## ### ########
// ### ### ## ### ## ## ### ### ## ## ## ##
// #### #### ## #### ## ## #### #### ## ## ## ##
// ## ### ## ## ## ## ## ## ## ### ## ## ## ########
// ## ## ## ## #### ## ## ## ######### ##
// ## ## ## ## ### ## ## ## ## ## ##
// ## ## #### ## ## #### ## ## ## ## ##
.minimap {
.lines {
word-spacing: -0.1em;
}
.highlight-selected .marker .region {
opacity: 0.7;
}
.minimap-scroller {
background: @blue;
}
}
// ######## ######## ######## ## ## #### ## ## ### ##
// ## ## ## ## ### ### ## ### ## ## ## ##
// ## ## ## ## #### #### ## #### ## ## ## ##
// ## ###### ######## ## ### ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## #### ######### ##
// ## ## ## ## ## ## ## ## ### ## ## ##
// ## ######## ## ## ## ## #### ## ## ## ## ########
.term {
border: none;
}
.terminal {
background: @base03 !important;
border-color: @base03;
font-size: 12px;
line-height: 18px;
-webkit-font-smoothing: auto;
font-family: Menlo;
}
// ######## ######## #### ######## ####### ########
// ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ##
// ###### ## ## ## ## ## ## ########
// ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ##
// ######## ######## #### ## ####### ## ##
.panes {
background: @base03;
}
.editor .search-results .marker .region, .editor .find-result .region {
border-color: @green;
}
.minimap-wrapper .search-results .marker .region {
background: @green;
}
.comment {
color: lighten(#5F5A60, 10%);
}
.editor {
&, .editor-contents {
font-family: Monaco;
}
.line {
.fold-marker:after {
font-size: 1.6em;
color: @magenta;
}
}
.invisible-character {
color: fadeout(@base02, 50%);
}
.punctuation.string.begin, .punctuation.string.end {
color: @orange !important;
}
// Ruby & CoffeeScript string interpolation punctuation
.punctuation.embedded, .punctuation.section.embedded, .source.ruby .meta.embedded .punctuation.section.embedded, .source.ruby .meta.embedded .punctuation.section.embedded .source.ruby {
color: @orange;
}
// Content of interpolations use the base color
.source.coffee.embedded, .meta.embedded.ruby, .variable.interpolation.sass, .property-value.sass {
color: @base1;
}
// Ruby do block arguments
.meta.line.ruby.haml {
color: @green;
.source.ruby {
color: @base1;
&.embedded.html {
color: @blue;
}
}
}
// Styles Ruby hash key: with the same style as :key
// .symbol.hashkey {
// color: @cyan;
//
// .punctuation {
// color: @cyan;
// }
// }
// Styles all Haml entities (%tag, #id, .class) in blue
.entity.name.tag.haml {
color: @blue;
}
// Styles Haml filters (:ruby, :coffee) in red
*:not(.tag) > .entity.name.tag.haml:not(.class):not(.id) {
color: @magenta;
}
// Styles regexp with an unused color, violet
// .string.regexp {
// color: @violet;
// }
// Styles Literate CoffeeScript comment using a low contrast color
.source.litcoffee {
color: @base01;
.raw.block {
color: @base1;
}
}
// Styles numbers with magenta
.numeric {
color: @magenta;
}
.constant.other.symbol {
color: @orange;
}
// Styles variables affectation and CoffeeScript/Ruby @properties
.variable.sass, .variable-usage.sass, .storage.modifier, .punctuation.separator.variable.ruby, .variable.other.block.ruby, .definition.variable.ruby {
color: #cc6666;
}
// Sass @import param
.variable.url.sass {
color: @cyan;
}
// CSS/Sass/less units (px, %, em, etc.)
.unit {
color: @green;
}
.operator.assignment {
color: @green;
}
.punctuation.section, .meta.brace {
color: saturate(@magenta, 20%);
}
// .coffee {
// .variable.instance, .variable.assignment {
// color: @blue;
// }
// }
.markdown.heading {
color: @base1;
.name {
color: @magenta;
}
}
}
// ######## #### ## ######## #### ###### ####### ## ## ######
// ## ## ## ## ## ## ## ## ## ### ## ## ##
// ## ## ## ## ## ## ## ## #### ## ##
// ###### ## ## ###### ## ## ## ## ## ## ## ######
// ## ## ## ## ## ## ## ## ## #### ##
// ## ## ## ## ## ## ## ## ## ## ### ## ##
// ## #### ######## ######## #### ###### ####### ## ## ######
@octicons: 'Octicons Regular';
@fontawesome: 'FontAwesome';
.pane ul.tab-bar li.tab .title[data-name]:before {
top: -1px;
}
[data-name]:before {
margin-right: 5px;
position: relative;
top: 1px;
font-family: @octicons;
font-weight: normal;
font-style: normal;
display: inline-block;
line-height: 1;
-webkit-font-smoothing: antialiased;
text-decoration: none;
font-size: 16px !important;
width: 16px !important;
height: 16px !important;
}
// Coffeescript files
[data-name$='.coffee']:before,
[data-name$='.litcoffee']:before,
[data-name$='.coffee.md']:before,
[data-name='Cakefile']:before {
content: '\f010' !important;
font-family: @octicons !important;
color: @green !important;
}
// Meta configuration files
[data-name$='.gitignore']:before,
[data-name$='.gitattributes']:before,
[data-name$='.gitkeep']:before,
[data-name$='.npmignore']:before,
[data-name$='.npmrc']:before,
[data-name$='.rspec']:before,
[data-name$='.pairs']:before,
[data-name$='.spectacular']:before,
[data-name='Procfile']:before,
[data-name='.htaccess']:before,
[data-name$='.ruby-version']:before {
content: '\f02f' !important;
font-family: @octicons !important;
color: saturate(@magenta, 30%) !important;
}
// GIT repo
[data-name$='.git']:before {
content: '\f00a';
}
// Source map file
[data-name$='.map']:before {
content: '\f060';
color: @orange;
}
// Lock files
[data-name$='.lock']:before {
content: '\f06a' !important;
color: @yellow !important;
}
// Ruby files
[data-name$='.rb']:before,
[data-name$='.ru']:before,
[data-name$='.rake']:before,
[data-name$='.gemspec']:before,
[data-name='Gemfile']:before,
[data-name='Rakefile']:before,
[data-name='Guardfile']:before,
[data-name='Capfile']:before {
color: @magenta !important;
content: '\f047';
}
// Stylesheets
[data-name$='.styl']:before,
[data-name$='.css']:before,
[data-name$='.sass']:before,
[data-name$='.scss']:before,
[data-name$='.less']:before {
// content: '\f058';
font-family: @fontawesome !important;
content: '\f13c' !important;
color: @blue !important;
}
// Archives
[data-name$='.zip']:before,
[data-name$='.rar']:before,
[data-name$='.gz']:before {
content: '\f013';
color: @cyan;
}
// Templates
[data-name$='.jade']:before,
[data-name$='.haml']:before,
[data-name$='.erb']:before,
[data-name$='.twig']:before,
[data-name$='.hbs']:before {
font-family: @fontawesome;
content: '\f13b';
// content: '\f05f';
color: @yellow;
}
// In project configuration files
[data-name$='.json']:before,
[data-name$='.cson']:before,
[data-name$='.yml']:before {
content: '\f07c' !important;
color: @violet !important;
}
// DS_Store
[data-name$='.DS_Store']:before,
[data-name*='.sublime-']:before {
content: '\f02f';
}
// License files
[data-name*='LICENSE']:before,
[data-name^='CHANGELOG']:before,
[data-name^='README']:before,
[data-name^='Readme']:before,
[data-name^='License']:before,
[data-name^='History']:before {
color: #78b4c4;
}
// PDF files
[data-name$='.pdf']:before {
content: '\f014';
color: @orange;
}
// Log files
.file-icon-log:before,
[data-name$='.log']:before {
content: '\f091';
color: @orange;
}
// Database & dumps
[data-name$='.sqlite']:before,
[data-name$='.csv']:before,
[data-name$='.sqlite3']:before,
[data-name$='.dump']:before {
content: '\f096';
color: @cyan;
}
// Php files
[data-name$='.php']:before {
color: @cyan !important;
}
// Fonts files
[data-name$='.woff']:before,
[data-name$='.ttf']:before,
[data-name$='.otf']:before,
[data-name$='.eot']:before {
content: '\f05e';
color: @blue;
}
// HTML files
[data-name$='.html']:before {
color: #5cb5db;
content: "\f0b6";
}
// Ctags files
[data-name='.ctags']:before,
[data-name='.tags']:before,
[data-name='.gemtags']:before,
[data-name='tags']:before,
[data-name='TAGS']:before {
content: '\f015';
color: @blue;
}
// JS files
[data-name$='.js']:before
{
content: '\f011';
color: #90c276;
}
// Images files
[data-name$='.jpg']:before,
[data-name$='.png']:before,
[data-name$='.gif']:before,
[data-name$='.psd']:before,
[data-name$='.svg']:before,
[data-name$='.ico']:before {
content: '\f012';
color: @green !important;
}
// Videos files
[data-name$='.mpg']:before,
[data-name$='.avi']:before,
[data-name$='.mov']:before,
[data-name$='.flv']:before,
[data-name$='.swf']:before,
[data-name$='.ogg']:before {
content: '\f057';
color: @orange;
}
// Markdown files
[data-name$='.md']:before,
[data-name$='.markdown']:before {
content: '\f0c9'
}
// Todos
[data-name*='todo']:before {
content: '\f076';
color: @cyan;
}
// Shell scripts
[data-path*='bin/']:before,
[data-name$='.sh']:before,
[data-name$='.bat']:before {
content: '\f0c8';
color: @magenta !important;
}
// Solarized colors
@base05: rgb(0, 26, 27);
@base04: rgb(0, 34, 41);
@base03: rgb(0, 43, 54);
@base02: rgb(7, 54, 66);
@base01a: rgb(6, 74, 87);
@base01: rgb(88, 110, 117);
@base00: rgb(101, 123, 131);
@base0: rgb(131, 148, 150);
@base1: rgb(147, 161, 161);
@base2: rgb(238, 232, 213);
@base3: rgb(253, 246, 227);
@yellow: rgb(181, 137, 0);
@orange: rgb(203, 75, 22);
@red: rgb(220, 50, 47);
@magenta: rgb(211, 54, 130);
@violet: rgb(108, 113, 196);
@blue: rgb(38, 139, 210);
@cyan: rgb(42, 161, 152);
@green: rgb(133, 153, 0);
// Dark UI Customized
// ######## ### ######## ######
// ## ## ## ## ## ## ##
// ## ## ## ## ## ##
// ## ## ## ######## ######
// ## ######### ## ## ##
// ## ## ## ## ## ## ##
// ## ## ## ######## ######
.tab-bar {
background: @base05;
.tab {
box-shadow: inset -1px 1px 0 @base03, 4px -4px 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base04, @base05);
}
.tab:before {
box-shadow: inset 1px 1px 0 @base03, -4px -4px 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base04, @base05);
}
.tab:after {
box-shadow: inset 0px 1px 0 @base03, 4px 0 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base04, @base05);
}
.tab.active {
box-shadow: inset -1px 1px 0 @base01a, 4px -4px 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base02, @base04);
}
.tab.active:before {
box-shadow: inset 1px 1px 0 @base01a, -4px -4px 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base02, @base04);
}
.tab.active:after {
box-shadow: inset 0px 1px 0 @base01a, 4px 0px 4px rgba(0, 0, 0, 0.1);
background-image: -webkit-linear-gradient(top, @base02, @base04);
}
.close-icon {
right: 0 !important;
}
}
.tab-bar:after {
background: @base04;
border-bottom-color: @base05;
border-top-color: @base02;
}
// ######## ######## ######## ######## ## ## #### ######## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ######## ###### ###### ## ## ## ###### ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ######## ######## ### #### ######## ### ###
.list-tree li.list-nested-item.status-ignored > .list-item, .list-group li:not(.list-nested-item).status-ignored, .list-tree li:not(.list-nested-item).status-ignored, .list-group li.list-nested-item.status-ignored > .list-item, .list-tree li.list-nested-item.status-ignored > .list-item {
color: @base01;
}
.list-tree li.list-nested-item.status-modified > .list-item, .list-group li:not(.list-nested-item).status-modified, .list-tree li:not(.list-nested-item).status-modified, .list-group li.list-nested-item.status-modified > .list-item, .list-tree li.list-nested-item.status-modified > .list-item {
color: @yellow;
}
.list-tree li.list-nested-item.status-added > .list-item, .list-group li:not(.list-nested-item).status-added, .list-tree li:not(.list-nested-item).status-added, .list-group li.list-nested-item.status-added > .list-item, .list-tree li.list-nested-item.status-added > .list-item {
color: @green;
}
.workspace, .tree-view {
background: @base04;
}
.list-group .selected:before, .list-tree .selected:before {
background: @base02;
}
.tree-view:focus, .item-views {
background: @base03;
}
// ###### ## ## ######## ###### ####### ########
// ## ## ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ##
// ## ## ## ######## ###### ## ## ########
// ## ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ## ## ## ##
// ###### ####### ## ## ###### ####### ## ##
.line.cursor-line, .line-number.cursor-line-no-selection {
background: rgba(255, 255, 255, 0.1);
}
.pane.active .editor .highlight-selected .marker .region {
border-color: @blue;
}
// ## ## #### ## ## #### ## ## ### ########
// ### ### ## ### ## ## ### ### ## ## ## ##
// #### #### ## #### ## ## #### #### ## ## ## ##
// ## ### ## ## ## ## ## ## ## ### ## ## ## ########
// ## ## ## ## #### ## ## ## ######### ##
// ## ## ## ## ### ## ## ## ## ## ##
// ## ## #### ## ## #### ## ## ## ## ##
.minimap {
.lines {
word-spacing: -1px;
}
.highlight-selected .marker .region {
opacity: 0.7;
}
}
// ######## ######## ######## ## ## #### ## ## ### ##
// ## ## ## ## ### ### ## ### ## ## ## ##
// ## ## ## ## #### #### ## #### ## ## ## ##
// ## ###### ######## ## ### ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## #### ######### ##
// ## ## ## ## ## ## ## ## ### ## ## ##
// ## ######## ## ## ## ## #### ## ## ## ## ########
.term {
border: none;
}
.terminal {
background: @base03 !important;
border-color: @base03;
font-size: 12px;
line-height: 18px;
-webkit-font-smoothing: auto;
font-family: Menlo;
}
// ######## ######## #### ######## ####### ########
// ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ##
// ###### ## ## ## ## ## ## ########
// ## ## ## ## ## ## ## ## ##
// ## ## ## ## ## ## ## ## ##
// ######## ######## #### ## ####### ## ##
.panes {
background: @base03;
}
.editor {
&, .editor-contents {
font-family: Monaco;
}
.atom-color-highlight {
z-index: 1;
}
.select-list {
z-index: 3;
}
.line.fold {
.fold-marker {
font-size: 20px;
line-height: 0;
}
}
// Ruby & CoffeeScript string interpolation punctuation
.punctuation.embedded, .punctuation.section.embedded, .source.ruby .meta.embedded .punctuation.section.embedded, .source.ruby .meta.embedded .punctuation.section.embedded .source.ruby {
color: @orange;
}
// Content of interpolations use the base color
.source.coffee.embedded, .meta.embedded.ruby, .variable.interpolation.sass, .property-value.sass {
color: @base1;
}
// Ruby do block arguments
.meta.line.ruby.haml {
color: @green;
.source.ruby {
color: @base1;
&.embedded.html {
color: @blue;
}
}
}
// Styles Ruby hash key: with the same style as :key
.symbol.hashkey {
color: @cyan;
.punctuation {
color: @cyan;
}
}
// Styles all Haml entities (%tag, #id, .class) in blue
.entity.name.tag.haml {
color: @blue;
}
// Styles Haml filters (:ruby, :coffee) in red
*:not(.tag) > .entity.name.tag.haml:not(.class):not(.id) {
color: @red;
}
// Styles regexp with an unused color, violet
.string.regexp {
color: @violet;
}
// Styles Literate CoffeeScript comment using a low contrast color
.source.litcoffee {
color: @base01;
.raw.block {
color: @base1;
}
}
// Styles numbers with magenta
.numeric {
color: @magenta;
}
// Styles variables affectation and CoffeeScript/Ruby @properties
.variable.sass, .variable-usage.sass, .storage.modifier, .punctuation.separator.variable.ruby, .variable.other.block.ruby, .definition.variable.ruby {
color: @blue;
}
// Sass @import param
.variable.url.sass {
color: @cyan;
}
// CSS/Sass/less units (px, %, em, etc.)
.unit {
color: @green;
}
.operator.assignment {
color: @green;
}
.punctuation.section {
color: @red;
}
.coffee {
.variable.instance, .variable.assignment {
color: @blue;
}
}
.markdown.heading {
color: @base1;
.name {
color: @magenta;
}
}
}
// ######## #### ## ######## #### ###### ####### ## ## ######
// ## ## ## ## ## ## ## ## ## ### ## ## ##
// ## ## ## ## ## ## ## ## #### ## ##
// ###### ## ## ###### ## ## ## ## ## ## ## ######
// ## ## ## ## ## ## ## ## ## #### ##
// ## ## ## ## ## ## ## ## ## ## ### ## ##
// ## #### ######## ######## #### ###### ####### ## ## ######
@octicons: 'Octicons Regular';
@fontawesome: 'FontAwesome';
[data-name]:before {
margin-right: 5px;
position: relative;
top: 1px;
font-family: @octicons;
font-weight: normal;
font-style: normal;
display: inline-block;
line-height: 1;
-webkit-font-smoothing: antialiased;
text-decoration: none;
font-size: 16px !important;
width: 16px !important;
height: 16px !important;
}
// Coffeescript files
[data-name$='.coffee']:before,
[data-name$='.litcoffee']:before,
[data-name$='.coffee.md']:before,
[data-name='Cakefile']:before {
content: '\f010' !important;
font-family: @octicons !important;
color: @green !important;
}
// Meta configuration files
[data-name$='.gitignore']:before,
[data-name$='.gitattributes']:before,
[data-name$='.gitkeep']:before,
[data-name$='.npmignore']:before,
[data-name$='.npmrc']:before,
[data-name$='.rspec']:before,
[data-name$='.pairs']:before,
[data-name$='.spectacular']:before,
[data-name='Procfile']:before,
[data-name='.htaccess']:before,
[data-name$='.ruby-version']:before {
content: '\f02f';
color: @magenta !important;
}
// GIT repo
[data-name$='.git']:before {
content: '\f00a';
}
// Source map file
[data-name$='.map']:before {
content: '\f060';
color: @orange;
}
// Lock files
[data-name$='.lock']:before {
content: '\f06a' !important;
color: @yellow !important;
}
// Ruby files
[data-name$='.rb']:before,
[data-name$='.ru']:before,
[data-name$='.rake']:before,
[data-name$='.gemspec']:before,
[data-name='Gemfile']:before,
[data-name='Rakefile']:before,
[data-name='Guardfile']:before,
[data-name='Capfile']:before {
color: @red;
content: '\f047';
}
// Stylesheets
[data-name$='.styl']:before,
[data-name$='.css']:before,
[data-name$='.sass']:before,
[data-name$='.scss']:before,
[data-name$='.less']:before {
// content: '\f058';
font-family: @fontawesome !important;
content: '\f13c' !important;
color: @blue !important;
}
// Archives
[data-name$='.zip']:before,
[data-name$='.rar']:before,
[data-name$='.gz']:before {
content: '\f013';
color: @cyan;
}
// Templates
[data-name$='.jade']:before,
[data-name$='.haml']:before,
[data-name$='.erb']:before,
[data-name$='.twig']:before,
[data-name$='.hbs']:before {
font-family: @fontawesome;
content: '\f13b';
// content: '\f05f';
color: @yellow;
}
// In project configuration files
[data-name$='.json']:before,
[data-name$='.cson']:before,
[data-name$='.yml']:before {
content: '\f07c' !important;
color: @violet !important;
}
// DS_Store
[data-name$='.DS_Store']:before,
[data-name*='.sublime-']:before {
content: '\f02f';
}
// License files
[data-name*='LICENSE']:before,
[data-name^='CHANGELOG']:before,
[data-name^='README']:before,
[data-name^='Readme']:before,
[data-name^='License']:before,
[data-name^='History']:before {
color: #78b4c4;
}
// PDF files
[data-name$='.pdf']:before {
content: '\f014';
color: @orange;
}
// Log files
.file-icon-log:before,
[data-name$='.log']:before {
content: '\f091';
color: @orange;
}
// Database & dumps
[data-name$='.sqlite']:before,
[data-name$='.csv']:before,
[data-name$='.sqlite3']:before,
[data-name$='.dump']:before {
content: '\f096';
color: @cyan;
}
// Php files
[data-name$='.php']:before {
color: @cyan !important;
}
// Fonts files
[data-name$='.woff']:before,
[data-name$='.ttf']:before,
[data-name$='.otf']:before,
[data-name$='.eot']:before {
content: '\f05e';
color: @blue;
}
// HTML files
[data-name$='.html']:before {
color: #5cb5db;
content: "\f0b6";
}
// Ctags files
[data-name='.ctags']:before,
[data-name='.tags']:before,
[data-name='.gemtags']:before,
[data-name='tags']:before,
[data-name='TAGS']:before {
content: '\f015';
color: @blue;
}
// JS files
[data-name$='.js']:before
{
content: '\f011';
color: #90c276;
}
// Images files
[data-name$='.jpg']:before,
[data-name$='.png']:before,
[data-name$='.gif']:before,
[data-name$='.psd']:before,
[data-name$='.svg']:before,
[data-name$='.ico']:before {
content: '\f012';
color: @green !important;
}
// Videos files
[data-name$='.mpg']:before,
[data-name$='.avi']:before,
[data-name$='.mov']:before,
[data-name$='.flv']:before,
[data-name$='.swf']:before,
[data-name$='.ogg']:before {
content: '\f057';
color: @orange;
}
// Markdown files
[data-name$='.md']:before,
[data-name$='.markdown']:before {
content: '\f0c9'
}
// Todos
[data-name*='todo']:before {
content: '\f076';
color: @cyan;
}
// Shell scripts
[data-path*='bin/']:before,
[data-name$='.sh']:before,
[data-name$='.bat']:before {
content: '\f0c8';
color: @magenta !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment