Merge pull request #221 from github/github-code-theme

Creating GitHub_Dark and GitHub_Light.

.atom/config.json

@@ -4,8 +4,8 @@
   },
   "core": {
     "themes": [
-      "Atom - Dark",
-      "IR_Black"
+      "atom-dark-ui",
+      "atom-dark-syntax"
     ]
   }
 }

.atom/packages/README.md

@@ -1 +0,0 @@
-All packages in this directory will be automatically loaded

Rakefile

@@ -90,7 +90,12 @@ task "create-dot-atom" do
   end
 
   `rm -rf "#{DOT_ATOM_PATH}"`
-  `cp -r #{dot_atom_template_path} #{DOT_ATOM_PATH}`
+  `mkdir "#{DOT_ATOM_PATH}"`
+
+  `cp "#{dot_atom_template_path}/user.coffee" "#{DOT_ATOM_PATH}"`
+  `cp "#{dot_atom_template_path}/user.css" "#{DOT_ATOM_PATH}"`
+  `cp -r "#{dot_atom_template_path}/packages" "#{DOT_ATOM_PATH}"`
+  `cp -r "#{ATOM_SRC_PATH}/themes" "#{DOT_ATOM_PATH}"`
 end
 
 desc "Clone default bundles into vendor/bundles directory"

src/app/atom-theme.coffee

@@ -3,9 +3,16 @@ Theme = require 'theme'
 
 module.exports =
 class AtomTheme extends Theme
+
+  loadStylesheet: (stylesheetPath)->
+    @stylesheets[stylesheetPath] = fs.read(stylesheetPath)
+
   load: ->
-    json = fs.read(fs.join(@path, "package.json"))
-    for stylesheetName in JSON.parse(json).stylesheets
-      stylesheetPath = fs.join(@path, stylesheetName)
-      @stylesheets[stylesheetPath] = fs.read(stylesheetPath)
+    if /\.css$/.test(@path)
+      @loadStylesheet @path
+    else
+      json = fs.read(fs.join(@path, "package.json"))
+      for stylesheetName in JSON.parse(json).stylesheets
+        stylesheetPath = fs.join(@path, stylesheetName)
+        @loadStylesheet stylesheetPath
     super

src/app/atom.coffee

@@ -50,7 +50,7 @@ _.extend atom,
       .filter (name) -> not _.contains(disabledPackages, name)
 
   loadThemes: ->
-    themeNames = config.get("core.themes") ? ['Atom - Dark', 'IR_Black']
+    themeNames = config.get("core.themes") ? ['atom-dark-ui', 'atom-dark-syntax']
     themeNames = [themeNames] unless _.isArray(themeNames)
     @loadTheme(themeName) for themeName in themeNames
     @loadUserStylesheet()
@@ -64,7 +64,7 @@ _.extend atom,
       applyStylesheet(userStylesheetPath, fs.read(userStylesheetPath), 'userTheme')
 
   getAtomThemeStylesheets: ->
-    themeNames = config.get("core.themes") ? ['Atom - Dark', 'IR_Black']
+    themeNames = config.get("core.themes") ? ['atom-dark-ui', 'atom-dark-syntax']
     themeNames = [themeNames] unless _.isArray(themeNames)
 
   open: (args...) ->

src/app/theme.coffee

@@ -11,7 +11,7 @@ class Theme
     if fs.exists(name)
       path = name
     else
-      path = fs.resolve(config.themeDirPaths..., name, ['', '.tmTheme'])
+      path = fs.resolve(config.themeDirPaths..., name, ['', '.tmTheme', '.css'])
 
     throw new Error("No theme exists named '#{name}'") unless path
 

static/editor.css

@@ -82,7 +82,7 @@
 
 .editor .cursor {
   position: absolute;
-  border-left: 2px solid;
+  border-left: 1px solid;
 }
 
 .editor:not(.focused) .cursor,

themes/Atom - Dark/wrap-guide.css

@@ -1,3 +0,0 @@
-.wrap-guide {
-  background: rgba(150, 150, 150, .30);
-}

themes/Atom - Light/wrap-guide.css

@@ -1,3 +0,0 @@
-.wrap-guide {
-  background: rgba(150, 150, 150, .30);
-}

themes/atom-dark-syntax.css

@@ -0,0 +1,269 @@
+.editor, .editor .gutter {
+  background-color: #1d1f21;
+  color: #c5c8c6;
+}
+
+.editor.focused .cursor {
+  border-color: #FFFFFF;
+}
+
+.editor.focused .selection .region {
+  background-color: #333333;
+}
+
+.editor.focused .line-number.cursor-line-no-selection, .editor.focused .line.cursor-line {
+  background-color: rgba(255, 255, 255, 0.14);
+}
+
+.comment {
+  color: #7C7C7C;
+}
+
+.entity {
+  color: #FFD2A7;
+}
+
+.keyword {
+  color: #96CBFE;
+}
+
+.keyword.control {
+  color: #96CBFE;
+}
+
+.keyword.operator {
+  color: #EDEDED;
+}
+
+.entity.name.type {
+  text-decoration: underline;
+  color: #FFFFB6;
+}
+
+.support {
+  color: #FFFFB6;
+}
+
+.storage {
+  color: #CFCB90;
+}
+
+.storage.modifier {
+  color: #96CBFE;
+}
+
+.constant {
+  color: #99CC99;
+}
+
+.string {
+  color: #A8FF60;
+}
+
+.constant.numeric {
+  color: #FF73FD;
+}
+
+.punctuation {
+}
+
+.variable {
+  color: #C6C5FE;
+}
+
+.invalid.deprecated {
+  text-decoration: underline;
+  color: #FD5FF1;
+}
+
+.invalid.illegal {
+  color: #FD5FF1;
+  background-color: rgba(86, 45, 86, 0.75);
+}
+
+.text .source {
+  background-color: rgba(177, 179, 186, 0.03);
+}
+
+.entity.other.inherited-class {
+  color: #9B5C2E;
+}
+
+.source .string .source {
+  color: #EDEDED;
+}
+
+.source .string .source .punctuation.section.embedded {
+  color: #00A0A0;
+}
+
+.string .constant {
+  color: #00A0A0;
+}
+
+.string.regexp {
+  color: #E9C062;
+}
+
+.string.regexp .constant.character.escape, .string.regexp .source.ruby.embedded, .string.regexp .string.regexp.arbitrary-repitition {
+  color: #FF8000;
+}
+
+.string.regexp.group {
+  color: #C6A24F;
+  background-color: rgba(255, 255, 255, 0.06);
+}
+
+.string.regexp.character-class {
+  color: #B18A3D;
+}
+
+.string .variable {
+  color: #8A9A95;
+}
+
+.support.function {
+  color: #DAD085;
+}
+
+.support.constant {
+  color: #FFD2A7;
+}
+
+.meta.preprocessor.c {
+  color: #8996A8;
+}
+
+.meta.preprocessor.c .keyword {
+  color: #AFC4DB;
+}
+
+.meta.cast {
+  color: #676767;
+}
+
+.meta.sgml.html .meta.doctype, .meta.sgml.html .meta.doctype .entity, .meta.sgml.html .meta.doctype .string, .meta.xml-processing, .meta.xml-processing .entity, .meta.xml-processing .string {
+  color: #494949;
+}
+
+.meta.tag, .meta.tag .entity {
+  color: #96CBFE;
+}
+
+.source .entity.name.tag, .source .entity.other.attribute-name, .meta.tag.inline, .meta.tag.inline .entity {
+  color: #96CBFE;
+}
+
+.entity.other.attribute-name {
+  color: #FFD7B1;
+}
+
+.entity.name.tag.namespace, .entity.other.attribute-name.namespace {
+  color: #E18964;
+}
+
+.meta.selector.css .entity.name.tag {
+  text-decoration: underline;
+  color: #96CBFE;
+}
+
+.meta.selector.css .entity.other.attribute-name.tag.pseudo-class {
+  color: #8F9D6A;
+}
+
+.meta.selector.css .entity.other.attribute-name.id {
+  color: #8B98AB;
+}
+
+.meta.selector.css .entity.other.attribute-name.class {
+  color: #62B1FE;
+}
+
+.support.type.property-name.css {
+  color: #EDEDED;
+}
+
+.meta.property-group .support.constant.property-value.css, .meta.property-value .support.constant.property-value.css {
+  color: #F9EE98;
+}
+
+.meta.preprocessor.at-rule .keyword.control.at-rule {
+  color: #8693A5;
+}
+
+.meta.property-value .support.constant.named-color.css, .meta.property-value .constant {
+  color: #87C38A;
+}
+
+.meta.constructor.argument.css {
+  color: #8F9D6A;
+}
+
+.meta.diff, .meta.diff.header {
+  color: #F8F8F8;
+  background-color: #0E2231;
+}
+
+.markup.deleted {
+  color: #F8F8F8;
+  background-color: #420E09;
+}
+
+.markup.changed {
+  color: #F8F8F8;
+  background-color: #4A410D;
+}
+
+.markup.inserted {
+  color: #F8F8F8;
+  background-color: #253B22;
+}
+
+.markup.italic {
+  color: #E9C062;
+}
+
+.markup.bold {
+  color: #E9C062;
+}
+
+.markup.underline {
+  text-decoration: underline;
+  color: #E18964;
+}
+
+.markup.quote {
+  color: #E1D4B9;
+  background-color: rgba(254, 224, 156, 0.07);
+}
+
+.markup.heading, .markup.heading .entity {
+  color: #FEDCC5;
+  background-color: #632D04;
+}
+
+.markup.list {
+  color: #E1D4B9;
+}
+
+.markup.raw {
+  color: #578BB3;
+  background-color: rgba(177, 179, 186, 0.03);
+}
+
+.markup .comment {
+  color: #F67B37;
+}
+
+.meta.separator {
+  color: #60A633;
+  background-color: #242424;
+}
+
+.meta.line.entry.logfile, .meta.line.exit.logfile {
+  background-color: rgba(238, 238, 238, 0.16);
+}
+
+.meta.line.error.logfile {
+  background-color: #751012;
+}

themes/atom-dark-ui/atom.css

@@ -16,11 +16,15 @@ html, body,
 }
 
 #root-view #panes .row > * + * {
-  border-left: 5px solid #515151;
+  -webkit-box-shadow:
+    -2px 0 rgba(0, 0, 0, 0.3),
+    -1px 0 rgba(255, 255, 255, 0.2);
 }
 
 #root-view #panes .column > * + * {
-  border-top: 5px solid #515151;
+  -webkit-box-shadow:
+    0 -2px rgba(0, 0, 0, 0.3),
+    0 -1px rgba(255, 255, 255, 0.2);
 }
 
 .error {

themes/atom-dark-ui/tabs.css

@@ -2,7 +2,8 @@
   background: #333333;
   border-bottom: 4px solid #424242;
   font: caption;
-  box-shadow: inset 0 -1px 0 #2e2e2e;
+  box-shadow: inset 0 -1px 0 #2e2e2e, 0 1px 0 #191919;
+  margin-bottom: 1px;
 }
 
 .tab {

themes/atom-dark-ui/tree-view.css

@@ -1,6 +1,6 @@
 .tree-view {
   background: #1e1e1e;
-  border-right: 2px solid #191919;
+  border-right: 1px solid #191919;
 }
 
 .tree-view .entry {

themes/atom-dark-ui/wrap-guide.css

@@ -0,0 +1,3 @@
+.wrap-guide {
+  background: rgba(150, 150, 150, 0.1);
+}

themes/atom-light-syntax.css

@@ -0,0 +1,168 @@
+.editor, .editor .gutter {
+  background-color: #FFFFFF;
+  color: #555;
+}
+
+.editor.focused .cursor {
+  border-color: #000;
+}
+
+.editor.focused .selection .region {
+  background-color: #afc4da;
+}
+
+.editor.focused .line-number.cursor-line-no-selection, .editor.focused .line.cursor-line {
+  background-color: rgba(255, 255, 134, 0.34);
+}
+
+.editor .comment {
+  color: #999988;
+  font-style: italic;
+}
+
+.editor .string {
+  color: #D14;
+}
+
+.editor .constant.numeric {
+  color: #D14;
+}
+
+.editor .constant.language {
+  color: #606aa1;
+}
+
+.editor .constant.character, .editor .constant.other {
+  color: #606aa1;
+}
+
+.editor .constant.symbol {
+  color: #990073;
+}
+
+.editor .variable {
+  color: #008080;
+}
+
+/* Keywords */
+.editor .keyword {
+  color: #222;
+  font-weight: bold;
+}
+
+.editor .keyword.unit {
+  color: #445588;
+}
+
+.editor .keyword.special-method {
+  color: #0086B3;
+}
+
+.editor .storage {
+  color: #222;
+}
+
+.editor .storage.type {
+  color: #222;
+}
+
+.editor .entity.name.class {
+  text-decoration: underline;
+  color: #606aa1;
+}
+
+.editor .entity.other.inherited-class {
+  text-decoration: underline;
+  color: #606aa1;
+}
+
+.editor .entity.name.function {
+  color: #900;
+}
+
+.editor .variable.parameter {
+  color: #606aa1;
+}
+
+.editor .entity.name.tag {
+  color: #008080;
+}
+
+.editor .entity.other.attribute-name {
+  color: #458;
+  font-weight: bold;
+}
+
+.editor .support.function {
+  color: #458;
+}
+
+.editor .support.constant {
+  color: #458;
+}
+
+.editor .support.type {
+  color: #458;
+}
+
+.editor .support.class {
+  color: #008080;
+}
+
+.editor .invalid {
+  color: #F8F8F0;
+  background-color: #00A8C6;
+}
+
+.editor .invalid.deprecated {
+  color: #F8F8F0;
+  background-color: #8FBE00;
+}
+
+.editor .meta.structure.dictionary.json > .string.quoted.double.json,
+.editor .meta.structure.dictionary.json > .string.quoted.double.json .punctuation.string {
+  color: #000080;
+}
+
+.editor .meta.structure.dictionary.value.json > .string.quoted.double.json {
+  color: #d14;
+}
+
+.editor .meta.diff, .editor .meta.diff.header {
+  color: #75715E;
+}
+
+.editor .meta.function span {
+  color: #990000;
+  font-weight: bold;
+}
+
+.editor .markup.deleted {
+  color: #00A8C6;
+}
+
+.editor .markup.inserted {
+  color: #A6E22E;
+}
+
+.editor .markup.changed {
+  color: #E6DB74;
+}
+
+.editor .constant.numeric.line-number.find-in-files .- .match {
+  color: rgba(143, 190, 0, 0.63);
+}
+
+.editor .entity.name.filename.find-in-files {
+  color: #E6DB74;
+}
+
+/* CSS Styles */
+.editor .css.support.property-name {
+  font-weight: bold;
+  color: #333;
+}
+
+.editor .css.constant {
+  color: #099;
+}

themes/atom-light-ui/atom.css

@@ -5,11 +5,15 @@ html, body,
 }
 
 #root-view #panes .row > * + * {
-  border-left: 1px solid #989898;
+  -webkit-box-shadow:
+    -2px 0 rgba(0, 0, 0, 0.3),
+    -1px 0 rgba(255, 255, 255, 0.2);
 }
 
 #root-view #panes .column > * + * {
-  border-top: 1px solid #989898;
+  -webkit-box-shadow:
+    0 -2px rgba(0, 0, 0, 0.3),
+    0 -1px rgba(255, 255, 255, 0.2);
 }
 
 .error {

themes/atom-light-ui/tabs.css

@@ -2,7 +2,8 @@
   background: #e3e3e3;
   border-bottom: 4px solid #e5e5e5;
   font: caption;
-  box-shadow: inset 0 -1px 0 #959595;
+  box-shadow: inset 0 -1px 0 #959595, 0 1px 0 #989898;
+  margin-bottom: 1px;
 }
 
 .tab {

themes/atom-light-ui/wrap-guide.css

@@ -0,0 +1,3 @@
+.wrap-guide {
+  background: rgba(150, 150, 150, 0.3);
+}