Merge remote-tracking branch 'origin/dev' into md-preview-redux

Conflicts:
	src/packages/markdown-preview/stylesheets/markdown-preview.css
	static/atom.css
	static/command-panel.css

Rakefile

@@ -83,7 +83,7 @@ task :clean do
 end
 
 desc "Run the specs"
-task :test => ["update-cef", "clone-default-bundles", "build"] do
+task :test => ["clean", "update-cef", "clone-default-bundles", "build"] do
   `pkill Atom`
   if path = application_path()
     cmd = "#{path}/Contents/MacOS/Atom --test --resource-path=#{ATOM_SRC_PATH} 2> /dev/null"

benchmark/benchmark-helper.coffee

@@ -7,7 +7,7 @@ Config = require 'config'
 Project = require 'project'
 
 require 'window'
-requireStylesheet "jasmine.css"
+requireStylesheet "jasmine.less"
 
 # Load TextMate bundles, which specs rely on (but not other packages)
 atom.loadTextMatePackages()
@@ -127,4 +127,3 @@ $.fn.textInput = (data) ->
   event = document.createEvent 'TextEvent'
   event.initTextEvent('textInput', true, true, window, data)
   this.each -> this.dispatchEvent(event)
-

native/v8_extensions/native.mm

@@ -166,8 +166,7 @@ namespace v8_extensions {
     }
     else if (name == "traverseTree") {
       std::string argument = arguments[0]->GetStringValue().ToString();
-      int rootPathLength = argument.size() + 1;
-      char rootPath[rootPathLength];
+      char rootPath[argument.size() + 1];
       strcpy(rootPath, argument.c_str());
       char * const paths[] = {rootPath, NULL};
 
@@ -191,12 +190,8 @@ namespace v8_extensions {
           continue;
         }
 
-        int pathLength = entry->fts_pathlen - rootPathLength;
-        char relative[pathLength + 1];
-        relative[pathLength] = '\0';
-        strncpy(relative, entry->fts_path + rootPathLength, pathLength);
         args.clear();
-        args.push_back(CefV8Value::CreateString(relative));
+        args.push_back(CefV8Value::CreateString(entry->fts_path));
         if (isFile) {
           onFile->ExecuteFunction(onFile, args);
         }

spec/app/theme-spec.coffee

@@ -20,8 +20,21 @@ describe "@load(name)", ->
       expect($(".editor").css("background-color")).toBe("rgb(20, 20, 20)")
 
   describe "AtomTheme", ->
+    describe "when the theme is a file", ->
+      it "loads and applies css", ->
+        expect($(".editor").css("padding-bottom")).not.toBe "1234px"
+        themePath = project.resolve('themes/theme-stylesheet.css')
+        theme = Theme.load(themePath)
+        expect($(".editor").css("padding-top")).toBe "1234px"
+
+      it "parses, loads and applies less", ->
+        expect($(".editor").css("padding-bottom")).not.toBe "1234px"
+        themePath = project.resolve('themes/theme-stylesheet.less')
+        theme = Theme.load(themePath)
+        expect($(".editor").css("padding-top")).toBe "4321px"
+
     describe "when the theme contains a package.json file", ->
-      it "loads and applies css from package.json in the correct order", ->
+      it "loads and applies stylesheets from package.json in the correct order", ->
         expect($(".editor").css("padding-top")).not.toBe("101px")
         expect($(".editor").css("padding-right")).not.toBe("102px")
         expect($(".editor").css("padding-bottom")).not.toBe("103px")
@@ -32,16 +45,8 @@ describe "@load(name)", ->
         expect($(".editor").css("padding-right")).toBe("102px")
         expect($(".editor").css("padding-bottom")).toBe("103px")
 
-    describe "when the theme is a CSS file", ->
-      it "loads and applies the stylesheet", ->
-        expect($(".editor").css("padding-bottom")).not.toBe "1234px"
-
-        themePath = project.resolve('themes/theme-stylesheet.css')
-        theme = Theme.load(themePath)
-        expect($(".editor").css("padding-top")).toBe "1234px"
-
     describe "when the theme does not contain a package.json file and is a directory", ->
-      it "loads all CSS files in the directory", ->
+      it "loads all stylesheet files in the directory", ->
         expect($(".editor").css("padding-top")).not.toBe "10px"
         expect($(".editor").css("padding-right")).not.toBe "20px"
         expect($(".editor").css("padding-bottom")).not.toBe "30px"

spec/app/window-spec.coffee

@@ -1,5 +1,6 @@
 $ = require 'jquery'
 fs = require 'fs'
+{less} = require 'less'
 
 describe "Window", ->
   projectPath = null
@@ -62,22 +63,46 @@ describe "Window", ->
       expect(atom.confirm).toHaveBeenCalled()
 
   describe "requireStylesheet(path)", ->
-    it "synchronously loads the stylesheet at the given path and installs a style tag for it in the head", ->
-      $('head style[id*="atom.css"]').remove()
+    it "synchronously loads css at the given path and installs a style tag for it in the head", ->
+      cssPath = project.resolve('css.css')
       lengthBefore = $('head style').length
-      requireStylesheet('atom.css')
+
+      requireStylesheet(cssPath)
       expect($('head style').length).toBe lengthBefore + 1
 
-      styleElt = $('head style[id*="atom.css"]')
-
-      fullPath = require.resolve('atom.css')
-      expect(styleElt.attr('id')).toBe fullPath
-      expect(styleElt.text()).toBe fs.read(fullPath)
+      element = $('head style[id*="css.css"]')
+      expect(element.attr('id')).toBe cssPath
+      expect(element.text()).toBe fs.read(cssPath)
 
       # doesn't append twice
-      requireStylesheet('atom.css')
+      requireStylesheet(cssPath)
       expect($('head style').length).toBe lengthBefore + 1
 
+      $('head style[id*="css.css"]').remove()
+
+    it  "synchronously loads and parses less files at the given path and installs a style tag for it in the head", ->
+      lessPath = project.resolve('sample.less')
+      lengthBefore = $('head style').length
+      requireStylesheet(lessPath)
+      expect($('head style').length).toBe lengthBefore + 1
+
+      element = $('head style[id*="sample.less"]')
+      expect(element.attr('id')).toBe lessPath
+      expect(element.text()).toBe """
+      #header {
+        color: #4d926f;
+      }
+      h2 {
+        color: #4d926f;
+      }
+
+      """
+
+      # doesn't append twice
+      requireStylesheet(lessPath)
+      expect($('head style').length).toBe lengthBefore + 1
+      $('head style[id*="sample.less"]').remove()
+
   describe ".disableStyleSheet(path)", ->
     it "removes styling applied by given stylesheet path", ->
       cssPath = require.resolve(fs.join("fixtures", "css.css"))

spec/fixtures/sample-with-error.less

@@ -0,0 +1 @@
+#header {

spec/fixtures/sample.less

@@ -0,0 +1,8 @@
+@color: #4D926F;
+
+#header {
+  color: @color;
+}
+h2 {
+  color: @color;
+}

spec/fixtures/themes/theme-stylesheet.less

@@ -0,0 +1,5 @@
+@padding: 4321px;
+
+.editor {
+  padding-top: @padding;
+}

spec/fixtures/themes/theme-with-package-file/package.json

@@ -1,3 +1,3 @@
 {
-  "stylesheets": ["first.css", "second.css", "last.css"]
+  "stylesheets": ["first.css", "second.less", "last.css"]
 }

spec/fixtures/themes/theme-with-package-file/second.css

@@ -1,5 +0,0 @@
-.editor {
-/*  padding-top: 102px;*/
-  padding-right: 102px;
-  padding-bottom: 102px;
-}

spec/fixtures/themes/theme-with-package-file/second.less

@@ -0,0 +1,7 @@
+@number: 102px;
+
+.editor {
+/*  padding-top: 102px;*/
+  padding-right: @number;
+  padding-bottom: @number;
+}

spec/fixtures/themes/theme-without-package-file/c.css

@@ -1,3 +0,0 @@
-.editor {
-  padding-bottom: 30px;
-}

spec/fixtures/themes/theme-without-package-file/c.less

@@ -0,0 +1,5 @@
+@number: 30px;
+
+.editor {
+  padding-bottom: @number;
+}

spec/spec-helper.coffee

@@ -15,7 +15,7 @@ TokenizedBuffer = require 'tokenized-buffer'
 fs = require 'fs'
 RootView = require 'root-view'
 Git = require 'git'
-requireStylesheet "jasmine.css"
+requireStylesheet "jasmine.less"
 fixturePackagesPath = require.resolve('fixtures/packages')
 require.paths.unshift(fixturePackagesPath)
 keymap.loadBundledKeymaps()

spec/stdlib/fs-spec.coffee

@@ -86,7 +86,7 @@ describe "fs", ->
     it "calls fn for every path in the tree at the given path", ->
       paths = []
       onPath = (path) ->
-        paths.push(fs.join(fixturesDir, path))
+        paths.push(path)
         true
       fs.traverseTree fixturesDir, onPath, onPath
       expect(paths).toEqual fs.listTree(fixturesDir)
@@ -106,14 +106,16 @@ describe "fs", ->
         expect(path).not.toMatch /\/dir\//
 
     it "returns entries if path is a symlink", ->
+      symlinkPath = fs.join(fixturesDir, 'symlink-to-dir')
       symlinkPaths = []
-      onSymlinkPath = (path) -> symlinkPaths.push(path)
+      onSymlinkPath = (path) -> symlinkPaths.push(path.substring(symlinkPath.length + 1))
 
+      regularPath = fs.join(fixturesDir, 'dir')
       paths = []
-      onPath = (path) -> paths.push(path)
+      onPath = (path) -> paths.push(path.substring(regularPath.length + 1))
 
-      fs.traverseTree(fs.join(fixturesDir, 'symlink-to-dir'), onSymlinkPath, onSymlinkPath)
-      fs.traverseTree(fs.join(fixturesDir, 'dir'), onPath, onPath)
+      fs.traverseTree(symlinkPath, onSymlinkPath, onSymlinkPath)
+      fs.traverseTree(regularPath, onPath, onPath)
 
       expect(symlinkPaths).toEqual(paths)
 

src/app/atom-theme.coffee

@@ -5,10 +5,10 @@ module.exports =
 class AtomTheme extends Theme
 
   loadStylesheet: (stylesheetPath)->
-    @stylesheets[stylesheetPath] = fs.read(stylesheetPath)
+    @stylesheets[stylesheetPath] = window.loadStylesheet(stylesheetPath)
 
   load: ->
-    if fs.extension(@path) is '.css'
+    if fs.extension(@path) in ['.css', '.less']
       @loadStylesheet(@path)
     else
       metadataPath = fs.resolveExtension(fs.join(@path, 'package'), ['cson', 'json'])
@@ -17,6 +17,6 @@ class AtomTheme extends Theme
         if stylesheetNames
           @loadStylesheet(fs.join(@path, name)) for name in stylesheetNames
       else
-        @loadStylesheet(stylesheetPath) for stylesheetPath in fs.list(@path, ['.css'])
+        @loadStylesheet(stylesheetPath) for stylesheetPath in fs.list(@path, ['.css', '.less'])
 
     super

src/app/config.coffee

@@ -37,16 +37,16 @@ class Config
     templateConfigDirPath = fs.resolve(window.resourcePath, 'dot-atom')
 
     onConfigDirFile = (path) =>
-      templatePath = fs.join(templateConfigDirPath, path)
-      configPath = fs.join(@configDirPath, path)
-      fs.write(configPath, fs.read(templatePath))
+      relativePath = path.substring(templateConfigDirPath.length + 1)
+      configPath = fs.join(@configDirPath, relativePath)
+      fs.write(configPath, fs.read(path))
     fs.traverseTree(templateConfigDirPath, onConfigDirFile, (path) -> true)
 
     configThemeDirPath = fs.join(@configDirPath, 'themes')
     onThemeDirFile = (path) ->
-      templatePath = fs.join(bundledThemesDirPath, path)
-      configPath = fs.join(configThemeDirPath, path)
-      fs.write(configPath, fs.read(templatePath))
+      relativePath = path.substring(bundledThemesDirPath.length + 1)
+      configPath = fs.join(configThemeDirPath, relativePath)
+      fs.write(configPath, fs.read(path))
     fs.traverseTree(bundledThemesDirPath, onThemeDirFile, (path) -> true)
 
   load: ->

src/app/editor.coffee

@@ -61,7 +61,7 @@ class Editor extends View
     else
       {editSession, @mini} = (editSessionOrOptions ? {})
 
-    requireStylesheet 'editor.css'
+    requireStylesheet 'editor.less'
 
     @id = Editor.nextEditorId++
     @lineCache = []

src/app/select-list.coffee

@@ -20,7 +20,7 @@ class SelectList extends View
   cancelling: false
 
   initialize: ->
-    requireStylesheet 'select-list.css'
+    requireStylesheet 'select-list.less'
 
     @miniEditor.getBuffer().on 'changed', => @schedulePopulateList()
     @miniEditor.on 'focusout', => @cancel() unless @cancelling

src/app/theme.coffee

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

src/app/window.coffee

@@ -1,6 +1,7 @@
 fs = require 'fs'
 $ = require 'jquery'
 ChildProcess = require 'child-process'
+{less} = require 'less'
 require 'jquery-extensions'
 require 'underscore-extensions'
 require 'space-pen-extensions'
@@ -24,17 +25,17 @@ window.setUpEnvironment = ->
   $(document).on 'keydown', keymap.handleKeyEvent
   keymap.bindDefaultKeys()
 
-  requireStylesheet 'reset.css'
-  requireStylesheet 'atom.css'
-  requireStylesheet 'tabs.css'
-  requireStylesheet 'tree-view.css'
-  requireStylesheet 'status-bar.css'
-  requireStylesheet 'command-panel.css'
-  requireStylesheet 'fuzzy-finder.css'
-  requireStylesheet 'overlay.css'
-  requireStylesheet 'popover-list.css'
-  requireStylesheet 'notification.css'
-  requireStylesheet 'markdown.css'
+  requireStylesheet 'reset.less'
+  requireStylesheet 'atom.less'
+  requireStylesheet 'tabs.less'
+  requireStylesheet 'tree-view.less'
+  requireStylesheet 'status-bar.less'
+  requireStylesheet 'command-panel.less'
+  requireStylesheet 'fuzzy-finder.less'
+  requireStylesheet 'overlay.less'
+  requireStylesheet 'popover-list.less'
+  requireStylesheet 'notification.less'
+  requireStylesheet 'markdown.less'
 
   if nativeStylesheetPath = require.resolve("#{platform}.css")
     requireStylesheet(nativeStylesheetPath)
@@ -117,10 +118,21 @@ window.stylesheetElementForId = (id) ->
 
 window.requireStylesheet = (path) ->
   if fullPath = require.resolve(path)
-    window.applyStylesheet(fullPath, fs.read(fullPath))
-  unless fullPath
+    content = window.loadStylesheet(fullPath)
+    window.applyStylesheet(fullPath, content)
+  else
+    console.log "bad", path
     throw new Error("Could not find a file at path '#{path}'")
 
+window.loadStylesheet = (path) ->
+  content = fs.read(path)
+  if fs.extension(path) == '.less'
+    (new less.Parser).parse content, (e, tree) ->
+      throw new Error(e.message, file, e.line) if e
+      content = tree.toCSS()
+
+  content
+
 window.removeStylesheet = (path) ->
   unless fullPath = require.resolve(path)
     throw new Error("Could not find a file at path '#{path}'")

src/packages/editor-stats/stylesheets/editor-stats.css

@@ -1,45 +0,0 @@
-.editor-stats-wrapper {
-  padding: 5px;
-  box-sizing: border-box;
-  border-top: 1px solid rgba(255, 255, 255, 0.05);
-  z-index: 9999;
-}
-
-.editor-stats {
-  height: 50px;
-  width: 100%;
-  background: #1d1f21;
-  border: 1px solid rgba(0, 0, 0, 0.3);
-  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
-  border-right: 1px solid rgba(255, 255, 255, 0.1);
-}
-
-.editor-stats rect.bar {
-  fill: rgba(255, 255, 255, 0.2);
-  shape-rendering: crispedges;
-}
-
-.editor-stats rect.bar.max {
-  fill: rgba(0, 163, 255, 1);
-}
-
-.editor-stats text {
-  font-size: 10px;
-  fill: rgba(255, 255, 255, 0.2);
-  font-family: Courier;
-}
-
-.editor-stats .minor text {
-  display: none;
-}
-
-.editor-stats line {
-  stroke: #ccc;
-  stroke-opacity: 0.05;
-  stroke-width: 1px;
-  shape-rendering: crispedges;
-}
-
-.editor-stats path.domain {
-  fill: none;
-}

src/packages/editor-stats/stylesheets/editor-stats.less

@@ -0,0 +1,45 @@
+.editor-stats-wrapper {
+  padding: 5px;
+  box-sizing: border-box;
+  border-top: 1px solid rgba(255, 255, 255, 0.05);
+  z-index: 9999;
+}
+
+.editor-stats {
+  height: 50px;
+  width: 100%;
+  background: #1d1f21;
+  border: 1px solid rgba(0, 0, 0, 0.3);
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+  border-right: 1px solid rgba(255, 255, 255, 0.1);
+
+  .bar {
+    fill: rgba(255, 255, 255, 0.2);
+    shape-rendering: crispedges;
+
+    &.max {
+      fill: rgba(0, 163, 255, 1);
+    }
+  }
+
+  text {
+    font-size: 10px;
+    fill: rgba(255, 255, 255, 0.2);
+    font-family: Courier;
+  }
+
+  .minor text {
+    display: none;
+  }
+
+  line {
+    stroke: #ccc;
+    stroke-opacity: 0.05;
+    stroke-width: 1px;
+    shape-rendering: crispedges;
+  }
+
+  path.domain {
+    display: none;
+  }
+}

src/packages/fuzzy-finder/lib/load-paths-handler.coffee

@@ -13,8 +13,10 @@ module.exports =
         return true if _.contains(ignoredNames, segment)
       repo?.isPathIgnored(fs.join(rootPath, path))
     onFile = (path) ->
+      path = path.substring(rootPath.length + 1)
       paths.push(path) unless isIgnored(path)
     onDirectory = (path) ->
+      path = path.substring(rootPath.length + 1)
       not isIgnored(path)
     fs.traverseTree(rootPath, onFile, onDirectory)
 

src/packages/markdown-preview/stylesheets/markdown-preview.css

@@ -1,424 +0,0 @@
-.markdown-preview {
-  font-family: "Helvetica Neue", Helvetica, sans-serif;
-  font-size: 14px;
-  line-height: 1.6;
-  background-color: #fff;
-  overflow: scroll;
-  padding: 20px;
-}
-
-.markdown-preview pre,
-.markdown-preview code,
-.markdown-preview tt {
-  font-size: 12px;
-  font-family: Consolas, "Liberation Mono", Courier, monospace;
-}
-
-.markdown-preview a {
-  color: #4183c4;
-}
-
-.markdown-preview ol > li {
-  list-style-type: decimal;
-}
-
-.markdown-preview ul > li {
-  list-style-type: disc;
-}
-
-.markdown-spinner {
-  margin: auto;
-  background-image: url(images/octocat-spinner-128.gif);
-  background-repeat: no-repeat;
-  background-size: 64px;
-  background-position: top center;
-  padding-top: 70px;
-  text-align: center;
-}
-
-
-/* this code below was copied from https://github.com/assets/stylesheets/primer/components/markdown.css */
-/* we really need to get primer in here somehow. */
-.markdown-preview {}
-  .markdown-preview > *:first-child {
-    margin-top: 0 !important; }
-  .markdown-preview > *:last-child {
-    margin-bottom: 0 !important; }
-  .markdown-preview a.absent {
-    color: #c00; }
-  .markdown-preview a.anchor {
-    display: block;
-    padding-left: 30px;
-    margin-left: -30px;
-    cursor: pointer;
-    position: absolute;
-    top: 0;
-    left: 0;
-    bottom: 0; }
-  .markdown-preview h1, .markdown-preview h2, .markdown-preview h3, .markdown-preview h4, .markdown-preview h5, .markdown-preview h6 {
-    margin: 20px 0 10px;
-    padding: 0;
-    font-weight: bold;
-    -webkit-font-smoothing: antialiased;
-    cursor: text;
-    position: relative; }
-    .markdown-preview h1 .mini-icon-link, .markdown-preview h2 .mini-icon-link, .markdown-preview h3 .mini-icon-link, .markdown-preview h4 .mini-icon-link, .markdown-preview h5 .mini-icon-link, .markdown-preview h6 .mini-icon-link {
-      display: none;
-      color: #000; }
-    .markdown-preview h1:hover a.anchor, .markdown-preview h2:hover a.anchor, .markdown-preview h3:hover a.anchor, .markdown-preview h4:hover a.anchor, .markdown-preview h5:hover a.anchor, .markdown-preview h6:hover a.anchor {
-      text-decoration: none;
-      line-height: 1;
-      padding-left: 0;
-      margin-left: -22px;
-      top: 15%; }
-      .markdown-preview h1:hover a.anchor .mini-icon-link, .markdown-preview h2:hover a.anchor .mini-icon-link, .markdown-preview h3:hover a.anchor .mini-icon-link, .markdown-preview h4:hover a.anchor .mini-icon-link, .markdown-preview h5:hover a.anchor .mini-icon-link, .markdown-preview h6:hover a.anchor .mini-icon-link {
-        display: inline-block; }
-    .markdown-preview h1 tt, .markdown-preview h1 code, .markdown-preview h2 tt, .markdown-preview h2 code, .markdown-preview h3 tt, .markdown-preview h3 code, .markdown-preview h4 tt, .markdown-preview h4 code, .markdown-preview h5 tt, .markdown-preview h5 code, .markdown-preview h6 tt, .markdown-preview h6 code {
-      font-size: inherit; }
-  .markdown-preview h1 {
-    font-size: 28px;
-    color: #000; }
-  .markdown-preview h2 {
-    font-size: 24px;
-    border-bottom: 1px solid #ccc;
-    color: #000; }
-  .markdown-preview h3 {
-    font-size: 18px; }
-  .markdown-preview h4 {
-    font-size: 16px; }
-  .markdown-preview h5 {
-    font-size: 14px; }
-  .markdown-preview h6 {
-    color: #777;
-    font-size: 14px; }
-  .markdown-preview p,
-  .markdown-preview blockquote,
-  .markdown-preview ul, .markdown-preview ol, .markdown-preview dl,
-  .markdown-preview table,
-  .markdown-preview pre {
-    margin: 15px 0; }
-  .markdown-preview hr {
-    background: transparent url("https://a248.e.akamai.net/assets.github.com/assets/primer/markdown/dirty-shade-0e7d81b119cc9beae17b0c98093d121fa0050a74.png") repeat-x 0 0;
-    border: 0 none;
-    color: #ccc;
-    height: 4px;
-    padding: 0; }
-  .markdown-preview > h2:first-child, .markdown-preview > h1:first-child, .markdown-preview > h1:first-child + h2, .markdown-preview > h3:first-child, .markdown-preview > h4:first-child, .markdown-preview > h5:first-child, .markdown-preview > h6:first-child {
-    margin-top: 0;
-    padding-top: 0; }
-  .markdown-preview a:first-child h1, .markdown-preview a:first-child h2, .markdown-preview a:first-child h3, .markdown-preview a:first-child h4, .markdown-preview a:first-child h5, .markdown-preview a:first-child h6 {
-    margin-top: 0;
-    padding-top: 0; }
-  .markdown-preview h1 + p,
-  .markdown-preview h2 + p,
-  .markdown-preview h3 + p,
-  .markdown-preview h4 + p,
-  .markdown-preview h5 + p,
-  .markdown-preview h6 + p {
-    margin-top: 0; }
-  .markdown-preview li p.first {
-    display: inline-block; }
-  .markdown-preview ul, .markdown-preview ol {
-    padding-left: 30px; }
-    .markdown-preview ul.no-list, .markdown-preview ol.no-list {
-      list-style-type: none;
-      padding: 0; }
-    .markdown-preview ul li > :first-child,
-    .markdown-preview ul li ul:first-of-type, .markdown-preview ol li > :first-child,
-    .markdown-preview ol li ul:first-of-type {
-      margin-top: 0px; }
-  .markdown-preview ul ul,
-  .markdown-preview ul ol,
-  .markdown-preview ol ol,
-  .markdown-preview ol ul {
-    margin-bottom: 0; }
-  .markdown-preview dl {
-    padding: 0; }
-  .markdown-preview dl dt {
-    font-size: 14px;
-    font-weight: bold;
-    font-style: italic;
-    padding: 0;
-    margin: 15px 0 5px; }
-    .markdown-preview dl dt:first-child {
-      padding: 0; }
-    .markdown-preview dl dt > :first-child {
-      margin-top: 0px; }
-    .markdown-preview dl dt > :last-child {
-      margin-bottom: 0px; }
-  .markdown-preview dl dd {
-    margin: 0 0 15px;
-    padding: 0 15px; }
-    .markdown-preview dl dd > :first-child {
-      margin-top: 0px; }
-    .markdown-preview dl dd > :last-child {
-      margin-bottom: 0px; }
-  .markdown-preview blockquote {
-    border-left: 4px solid #DDD;
-    padding: 0 15px;
-    color: #777; }
-    .markdown-preview blockquote > :first-child {
-      margin-top: 0px; }
-    .markdown-preview blockquote > :last-child {
-      margin-bottom: 0px; }
-  .markdown-preview table th {
-    font-weight: bold; }
-  .markdown-preview table th, .markdown-preview table td {
-    border: 1px solid #ccc;
-    padding: 6px 13px; }
-  .markdown-preview table tr {
-    border-top: 1px solid #ccc;
-    background-color: #fff; }
-    .markdown-preview table tr:nth-child(2n) {
-      background-color: #f8f8f8; }
-  .markdown-preview img {
-    max-width: 100%;
-    -moz-box-sizing: border-box;
-    box-sizing: border-box; }
-  .markdown-preview span.frame {
-    display: block;
-    overflow: hidden; }
-    .markdown-preview span.frame > span {
-      border: 1px solid #ddd;
-      display: block;
-      float: left;
-      overflow: hidden;
-      margin: 13px 0 0;
-      padding: 7px;
-      width: auto; }
-    .markdown-preview span.frame span img {
-      display: block;
-      float: left; }
-    .markdown-preview span.frame span span {
-      clear: both;
-      color: #333;
-      display: block;
-      padding: 5px 0 0; }
-  .markdown-preview span.align-center {
-    display: block;
-    overflow: hidden;
-    clear: both; }
-    .markdown-preview span.align-center > span {
-      display: block;
-      overflow: hidden;
-      margin: 13px auto 0;
-      text-align: center; }
-    .markdown-preview span.align-center span img {
-      margin: 0 auto;
-      text-align: center; }
-  .markdown-preview span.align-right {
-    display: block;
-    overflow: hidden;
-    clear: both; }
-    .markdown-preview span.align-right > span {
-      display: block;
-      overflow: hidden;
-      margin: 13px 0 0;
-      text-align: right; }
-    .markdown-preview span.align-right span img {
-      margin: 0;
-      text-align: right; }
-  .markdown-preview span.float-left {
-    display: block;
-    margin-right: 13px;
-    overflow: hidden;
-    float: left; }
-    .markdown-preview span.float-left span {
-      margin: 13px 0 0; }
-  .markdown-preview span.float-right {
-    display: block;
-    margin-left: 13px;
-    overflow: hidden;
-    float: right; }
-    .markdown-preview span.float-right > span {
-      display: block;
-      overflow: hidden;
-      margin: 13px auto 0;
-      text-align: right; }
-  .markdown-preview code, .markdown-preview tt {
-    margin: 0 2px;
-    padding: 0px 5px;
-    border: 1px solid #eaeaea;
-    background-color: #f8f8f8;
-    border-radius: 3px; }
-  .markdown-preview code {
-    white-space: nowrap; }
-  .markdown-preview pre > code {
-    margin: 0;
-    padding: 0;
-    white-space: pre;
-    border: none;
-    background: transparent; }
-  .markdown-preview .highlight pre, .markdown-preview pre {
-    background-color: #f8f8f8;
-    border: 1px solid #ccc;
-    font-size: 13px;
-    line-height: 19px;
-    overflow: auto;
-    padding: 6px 10px;
-    border-radius: 3px; }
-  .markdown-preview pre code, .markdown-preview pre tt {
-    margin: 0;
-    padding: 0;
-    background-color: transparent;
-    border: none; }
-
-/* this code was copied from https://github.com/assets/stylesheets/primer/components/pygments.css */
-/* the .markdown-preview class was then added to all rules */
-.markdown-preview .highlight {
-  background: #ffffff; }
-  .markdown-preview .highlight .c {
-    color: #999988;
-    font-style: italic; }
-  .markdown-preview .highlight .err {
-    color: #a61717;
-    background-color: #e3d2d2; }
-  .markdown-preview .highlight .k {
-    font-weight: bold; }
-  .markdown-preview .highlight .o {
-    font-weight: bold; }
-  .markdown-preview .highlight .cm {
-    color: #999988;
-    font-style: italic; }
-  .markdown-preview .highlight .cp {
-    color: #999999;
-    font-weight: bold; }
-  .markdown-preview .highlight .c1 {
-    color: #999988;
-    font-style: italic; }
-  .markdown-preview .highlight .cs {
-    color: #999999;
-    font-weight: bold;
-    font-style: italic; }
-  .markdown-preview .highlight .gd {
-    color: #000000;
-    background-color: #ffdddd; }
-  .markdown-preview .highlight .gd .x {
-    color: #000000;
-    background-color: #ffaaaa; }
-  .markdown-preview .highlight .ge {
-    font-style: italic; }
-  .markdown-preview .highlight .gr {
-    color: #aa0000; }
-  .markdown-preview .highlight .gh {
-    color: #999999; }
-  .markdown-preview .highlight .gi {
-    color: #000000;
-    background-color: #ddffdd; }
-  .markdown-preview .highlight .gi .x {
-    color: #000000;
-    background-color: #aaffaa; }
-  .markdown-preview .highlight .go {
-    color: #888888; }
-  .markdown-preview .highlight .gp {
-    color: #555555; }
-  .markdown-preview .highlight .gs {
-    font-weight: bold; }
-  .markdown-preview .highlight .gu {
-    color: #800080;
-    font-weight: bold; }
-  .markdown-preview .highlight .gt {
-    color: #aa0000; }
-  .markdown-preview .highlight .kc {
-    font-weight: bold; }
-  .markdown-preview .highlight .kd {
-    font-weight: bold; }
-  .markdown-preview .highlight .kn {
-    font-weight: bold; }
-  .markdown-preview .highlight .kp {
-    font-weight: bold; }
-  .markdown-preview .highlight .kr {
-    font-weight: bold; }
-  .markdown-preview .highlight .kt {
-    color: #445588;
-    font-weight: bold; }
-  .markdown-preview .highlight .m {
-    color: #009999; }
-  .markdown-preview .highlight .s {
-    color: #d14; }
-  .markdown-preview .highlight .na {
-    color: #008080; }
-  .markdown-preview .highlight .nb {
-    color: #0086B3; }
-  .markdown-preview .highlight .nc {
-    color: #445588;
-    font-weight: bold; }
-  .markdown-preview .highlight .no {
-    color: #008080; }
-  .markdown-preview .highlight .ni {
-    color: #800080; }
-  .markdown-preview .highlight .ne {
-    color: #990000;
-    font-weight: bold; }
-  .markdown-preview .highlight .nf {
-    color: #990000;
-    font-weight: bold; }
-  .markdown-preview .highlight .nn {
-    color: #555555; }
-  .markdown-preview .highlight .nt {
-    color: #000080; }
-  .markdown-preview .highlight .nv {
-    color: #008080; }
-  .markdown-preview .highlight .ow {
-    font-weight: bold; }
-  .markdown-preview .highlight .w {
-    color: #bbbbbb; }
-  .markdown-preview .highlight .mf {
-    color: #009999; }
-  .markdown-preview .highlight .mh {
-    color: #009999; }
-  .markdown-preview .highlight .mi {
-    color: #009999; }
-  .markdown-preview .highlight .mo {
-    color: #009999; }
-  .markdown-preview .highlight .sb {
-    color: #d14; }
-  .markdown-preview .highlight .sc {
-    color: #d14; }
-  .markdown-preview .highlight .sd {
-    color: #d14; }
-  .markdown-preview .highlight .s2 {
-    color: #d14; }
-  .markdown-preview .highlight .se {
-    color: #d14; }
-  .markdown-preview .highlight .sh {
-    color: #d14; }
-  .markdown-preview .highlight .si {
-    color: #d14; }
-  .markdown-preview .highlight .sx {
-    color: #d14; }
-  .markdown-preview .highlight .sr {
-    color: #009926; }
-  .markdown-preview .highlight .s1 {
-    color: #d14; }
-  .markdown-preview .highlight .ss {
-    color: #990073; }
-  .markdown-preview .highlight .bp {
-    color: #999999; }
-  .markdown-preview .highlight .vc {
-    color: #008080; }
-  .markdown-preview .highlight .vg {
-    color: #008080; }
-  .markdown-preview .highlight .vi {
-    color: #008080; }
-  .markdown-preview .highlight .il {
-    color: #009999; }
-  .markdown-preview .highlight .gc {
-    color: #999;
-    background-color: #EAF2F5; }
-
-.type-csharp .markdown-preview .highlight .k {
-  color: #0000FF; }
-.type-csharp .markdown-preview .highlight .kt {
-  color: #0000FF; }
-.type-csharp .markdown-preview .highlight .nf {
-  color: #000000;
-  font-weight: normal; }
-.type-csharp .markdown-preview .highlight .nc {
-  color: #2B91AF; }
-.type-csharp .markdown-preview .highlight .nn {
-  color: #000000; }
-.type-csharp .markdown-preview .highlight .s {
-  color: #A31515; }
-.type-csharp .markdown-preview .highlight .sc {
-  color: #A31515; }

src/packages/markdown-preview/stylesheets/markdown-preview.less

@@ -0,0 +1,409 @@
+.markdown-preview {
+  font-family: "Helvetica Neue", Helvetica, sans-serif;
+  font-size: 14px;
+  line-height: 1.6;
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0px;
+  left: 0px;
+  background-color: #fff;
+  overflow: scroll;
+  z-index: 3;
+  box-sizing: border-box;
+  padding: 20px;
+}
+
+.markdown-spinner {
+  margin: auto;
+  background-image: url(images/octocat-spinner-128.gif);
+  background-repeat: no-repeat;
+  background-size: 64px;
+  background-position: top center;
+  padding-top: 70px;
+  text-align: center;
+}
+
+// This is styling for generic markdownized text. Anything you put in a
+// container with .markdown-preview on it should render generally well. It also
+// includes some GitHub Flavored Markdown specific styling (like @mentions)
+.markdown-preview {
+  pre,
+  code,
+  tt {
+    font-size: 12px;
+    font-family: Consolas, "Liberation Mono", Courier, monospace;
+  }
+
+  a {
+    color: #4183c4;
+  }
+
+  ol > li {
+    list-style-type: decimal;
+  }
+
+  ul > li {
+    list-style-type: disc;
+  }
+
+  & > *:first-child {
+    margin-top: 0 !important;
+  }
+
+  & > *:last-child {
+    margin-bottom: 0 !important;
+  }
+
+  // Link Colors
+  a.absent {
+    color: #c00;
+  }
+
+  a.anchor {
+    display: block;
+    padding-left: 30px;
+    margin-left: -30px;
+    cursor: pointer;
+    position: absolute;
+    top: 0;
+    left: 0;
+    bottom: 0;
+  }
+
+  // Headings
+  h1, h2, h3, h4, h5, h6 {
+    margin: 20px 0 10px;
+    padding: 0;
+    font-weight: bold;
+    -webkit-font-smoothing: antialiased;
+    cursor: text;
+    position: relative;
+
+    .mini-icon-link {
+      display: none;
+      color: #000;
+    }
+
+    &:hover a.anchor {
+      text-decoration: none;
+      line-height: 1;
+      padding-left: 0;
+      margin-left: -22px;
+      top: 15%;
+
+      .mini-icon-link {
+        display: inline-block;
+      }
+    }
+    tt, code {
+      font-size: inherit;
+    }
+  }
+
+  h1 {
+    font-size: 28px;
+    color: #000;
+  }
+
+  h2 {
+    font-size: 24px;
+    border-bottom: 1px solid #ccc;
+    color: #000;
+  }
+
+  h3 {
+    font-size: 18px;
+  }
+
+  h4 {
+    font-size: 16px;
+  }
+
+  h5 {
+    font-size: 14px;
+  }
+
+  h6 {
+    color: #777;
+    font-size: 14px;
+  }
+
+  p,
+  blockquote,
+  ul, ol, dl,
+  table,
+  pre {
+    margin: 15px 0;
+  }
+
+  hr {
+    background: transparent;
+    border: 0 none;
+    color: #ccc;
+    height: 4px;
+    padding: 0;
+  }
+
+  & > h2:first-child,
+  & > h1:first-child,
+  & > h1:first-child + h2,
+  & > h3:first-child,
+  & > h4:first-child,
+  & > h5:first-child,
+  & > h6:first-child {
+    margin-top: 0;
+    padding-top: 0;
+  }
+
+  // fixes margin on shit like:
+  // <a name='the-heading'>
+  // <h1>The Heading</h1></a>
+  a:first-child {
+    h1, h2, h3, h4, h5, h6 {
+      margin-top: 0;
+      padding-top: 0;
+    }
+  }
+
+  h1 + p,
+  h2 + p,
+  h3 + p,
+  h4 + p,
+  h5 + p,
+  h6 + p {
+    margin-top: 0;
+  }
+
+  // ReST first graf in nested list
+  li p.first {
+    display: inline-block;
+  }
+
+  // Lists, Blockquotes & Such
+  ul, ol {
+    padding-left: 30px;
+
+    &.no-list {
+      list-style-type: none;
+      padding: 0;
+    }
+
+    li > :first-child,
+    li ul:first-of-type {
+      margin-top: 0px;
+    }
+  }
+
+  ul ul,
+  ul ol,
+  ol ol,
+  ol ul {
+    margin-bottom: 0;
+  }
+
+  dl {
+    padding: 0;
+  }
+
+  dl dt {
+    font-size: 14px;
+    font-weight: bold;
+    font-style: italic;
+    padding: 0;
+    margin: 15px 0 5px;
+
+    &:first-child {
+      padding: 0;
+    }
+    & > :first-child {
+      margin-top: 0px;
+    }
+
+    & > :last-child {
+      margin-bottom: 0px;
+    }
+  }
+
+  dl dd {
+    margin: 0 0 15px;
+    padding: 0 15px;
+    & > :first-child {
+      margin-top: 0px;
+    }
+
+    & > :last-child {
+      margin-bottom: 0px;
+    }
+  }
+
+  blockquote {
+    border-left: 4px solid #DDD;
+    padding: 0 15px;
+    color: #777;
+
+    & > :first-child {
+      margin-top: 0px;
+    }
+
+    & > :last-child {
+      margin-bottom: 0px;
+    }
+  }
+
+  // Tables
+  table {
+
+    th {
+      font-weight: bold;
+    }
+
+    th, td {
+      border: 1px solid #ccc;
+      padding: 6px 13px;
+    }
+
+    tr {
+      border-top: 1px solid #ccc;
+      background-color: #fff;
+
+      &:nth-child(2n) {
+        background-color: #f8f8f8;
+      }
+    }
+  }
+
+  // Images & Stuff
+  img {
+    max-width: 100%;
+    @include box-sizing();
+  }
+
+  // Gollum Image Tags
+
+  // Framed
+  span.frame {
+    display: block;
+    overflow: hidden;
+
+    & > span {
+      border: 1px solid #ddd;
+      display: block;
+      float: left;
+      overflow: hidden;
+      margin: 13px 0 0;
+      padding: 7px;
+      width: auto;
+    }
+
+    span img {
+      display: block;
+      float: left;
+    }
+
+    span span {
+      clear: both;
+      color: #333;
+      display: block;
+      padding: 5px 0 0;
+    }
+  }
+
+  span.align-center {
+    display: block;
+    overflow: hidden;
+    clear: both;
+
+    & > span {
+      display: block;
+      overflow: hidden;
+      margin: 13px auto 0;
+      text-align: center;
+    }
+
+    span img {
+      margin: 0 auto;
+      text-align: center;
+    }
+  }
+
+  span.align-right {
+    display: block;
+    overflow: hidden;
+    clear: both;
+
+    & > span {
+      display: block;
+      overflow: hidden;
+      margin: 13px 0 0;
+      text-align: right;
+    }
+
+    span img {
+      margin: 0;
+      text-align: right;
+    }
+  }
+
+  span.float-left {
+    display: block;
+    margin-right: 13px;
+    overflow: hidden;
+    float: left;
+
+    span {
+      margin: 13px 0 0;
+    }
+  }
+
+  span.float-right {
+    display: block;
+    margin-left: 13px;
+    overflow: hidden;
+    float: right;
+
+    & > span {
+      display: block;
+      overflow: hidden;
+      margin: 13px auto 0;
+      text-align: right;
+    }
+  }
+
+  // Inline code snippets
+  code, tt {
+    margin: 0 2px;
+    padding: 0px 5px;
+    border: 1px solid #eaeaea;
+    background-color: #f8f8f8;
+    border-radius:3px;
+  }
+
+  code { white-space: nowrap; }
+
+  // Code tags within code blocks (<pre>s)
+  pre > code {
+    margin: 0;
+    padding: 0;
+    white-space: pre;
+    border: none;
+    background: transparent;
+  }
+
+  .highlight pre, pre {
+    background-color: #f8f8f8;
+    border: 1px solid #ccc;
+    font-size: 13px;
+    line-height: 19px;
+    overflow: auto;
+    padding: 6px 10px;
+    border-radius:3px;
+  }
+
+  pre code, pre tt {
+    margin: 0;
+    padding: 0;
+    background-color: transparent;
+    border: none;
+  }
+}

src/packages/markdown-preview/stylesheets/pygments.less

@@ -0,0 +1,201 @@
+.highlight  {
+  background: #ffffff;
+
+  // Comment
+  .c { color: #999988; font-style: italic }
+
+  // Error
+  .err { color: #a61717; background-color: #e3d2d2 }
+
+  // Keyword
+  .k { font-weight: bold }
+
+  // Operator
+  .o { font-weight: bold }
+
+  // Comment.Multiline
+  .cm { color: #999988; font-style: italic }
+
+  // Comment.Preproc
+  .cp { color: #999999; font-weight: bold }
+
+  // Comment.Single
+  .c1 { color: #999988; font-style: italic }
+
+  // Comment.Special
+  .cs { color: #999999; font-weight: bold; font-style: italic }
+
+  // Generic.Deleted
+  .gd { color: #000000; background-color: #ffdddd }
+
+  // Generic.Deleted.Specific
+  .gd .x { color: #000000; background-color: #ffaaaa }
+
+  // Generic.Emph
+  .ge { font-style: italic }
+
+  // Generic.Error
+  .gr { color: #aa0000 }
+
+  // Generic.Heading
+  .gh { color: #999999 }
+
+  // Generic.Inserted
+  .gi { color: #000000; background-color: #ddffdd }
+
+  // Generic.Inserted.Specific
+  .gi .x { color: #000000; background-color: #aaffaa }
+
+  // Generic.Output
+  .go { color: #888888 }
+
+  // Generic.Prompt
+  .gp { color: #555555 }
+
+  // Generic.Strong
+  .gs { font-weight: bold }
+
+  // Generic.Subheading
+  .gu { color: #800080; font-weight: bold; }
+
+  // Generic.Traceback
+  .gt { color: #aa0000 }
+
+  // Keyword.Constant
+  .kc { font-weight: bold }
+
+  // Keyword.Declaration
+  .kd { font-weight: bold }
+
+  // Keyword.Namespace
+  .kn { font-weight: bold }
+
+  // Keyword.Pseudo
+  .kp { font-weight: bold }
+
+  // Keyword.Reserved
+  .kr { font-weight: bold }
+
+  // Keyword.Type
+  .kt { color: #445588; font-weight: bold }
+
+  // Literal.Number
+  .m { color: #009999 }
+
+  // Literal.String
+  .s { color: #d14 }
+
+  // Name
+  .n { color: #333333 }
+
+  // Name.Attribute
+  .na { color: #008080 }
+
+  // Name.Builtin
+  .nb { color: #0086B3 }
+
+  // Name.Class
+  .nc { color: #445588; font-weight: bold }
+
+  // Name.Constant
+  .no { color: #008080 }
+
+  // Name.Entity
+  .ni { color: #800080 }
+
+  // Name.Exception
+  .ne { color: #990000; font-weight: bold }
+
+  // Name.Function
+  .nf { color: #990000; font-weight: bold }
+
+  // Name.Namespace
+  .nn { color: #555555 }
+
+  // Name.Tag
+  .nt { color: #000080 }
+
+  // Name.Variable
+  .nv { color: #008080 }
+
+  // Operator.Word
+  .ow { font-weight: bold }
+
+  // Text.Whitespace
+  .w { color: #bbbbbb }
+
+  // Literal.Number.Float
+  .mf { color: #009999 }
+
+  // Literal.Number.Hex
+  .mh { color: #009999 }
+
+  // Literal.Number.Integer
+  .mi { color: #009999 }
+
+  // Literal.Number.Oct
+  .mo { color: #009999 }
+
+  // Literal.String.Backtick
+  .sb { color: #d14 }
+
+  // Literal.String.Char
+  .sc { color: #d14 }
+
+  // Literal.String.Doc
+  .sd { color: #d14 }
+
+  // Literal.String.Double
+  .s2 { color: #d14 }
+
+  // Literal.String.Escape
+  .se { color: #d14 }
+
+  // Literal.String.Heredoc
+  .sh { color: #d14 }
+
+  // Literal.String.Interpol
+  .si { color: #d14 }
+
+  // Literal.String.Other
+  .sx { color: #d14 }
+
+  // Literal.String.Regex
+  .sr { color: #009926 }
+
+  // Literal.String.Single
+  .s1 { color: #d14 }
+
+  // Literal.String.Symbol
+  .ss { color: #990073 }
+
+  // Name.Builtin.Pseudo
+  .bp { color: #999999 }
+
+  // Name.Variable.Class
+  .vc { color: #008080 }
+
+  // Name.Variable.Global
+  .vg { color: #008080 }
+
+  // Name.Variable.Instance
+  .vi { color: #008080 }
+
+  // Literal.Number.Integer.Long
+  .il { color: #009999 }
+
+  .gc {
+    color: #999;
+    background-color: #EAF2F5;
+  }
+}
+
+.type-csharp .highlight {
+  .k { color: #0000FF }
+  .kt { color: #0000FF }
+  .nf { color: #000000; font-weight: normal }
+  .nc { color: #2B91AF }
+  .nn { color: #000000 }
+  .s { color: #A31515 }
+  .sc { color: #A31515 }
+}

src/packages/package-generator/lib/package-generator-view.coffee

@@ -62,6 +62,7 @@ class PackageGeneratorView extends View
     for path in fs.listTree(templatePath)
       relativePath = path.replace(templatePath, "")
       relativePath = relativePath.replace(/^\//, '')
+      relativePath = relativePath.replace(/\.template$/, '')
       relativePath = @replacePackageNamePlaceholders(relativePath, packageName)
 
       sourcePath = fs.join(@getPackagePath(), relativePath)

src/packages/tree-view/stylesheets/tree-view.css

@@ -1,57 +0,0 @@
-.tree-view-wrapper {
-  position: relative;
-  height: 100%;
-  cursor: default;
-  -webkit-user-select: none;
-  min-width: 50px;
-  z-index: 2;
-}
-
-.tree-view {
-  position: relative;
-  cursor: default;
-  -webkit-user-select: none;
-  overflow: auto;
-  height: 100%;
-}
-
-.tree-view-wrapper .tree-view-resizer {
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  width: 10px;
-  cursor: col-resize;
-  z-index: 3;
-}
-
-.tree-view .entry {
-  text-wrap: none;
-  white-space: nowrap;
-}
-
-.tree-view .entry > .header,
-.tree-view .entry > .name {
-  z-index: 1;
-  position: relative;
-  display: inline-block;
-}
-
-.tree-view .selected > .highlight {
-  position: absolute;
-  left: 0;
-  right: 0;
-  height: 24px;
-}
-
-.tree-view .disclosure-arrow {
-  display: inline-block;
-}
-
-.tree-view-dialog {
-  position: absolute;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  z-index: 99;
-}

src/packages/tree-view/stylesheets/tree-view.less

@@ -0,0 +1,57 @@
+.tree-view-wrapper {
+  position: relative;
+  height: 100%;
+  cursor: default;
+  -webkit-user-select: none;
+  min-width: 50px;
+  z-index: 2;
+
+  .tree-view-resizer {
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    width: 10px;
+    cursor: col-resize;
+    z-index: 3;
+  }
+}
+
+.tree-view {
+  position: relative;
+  cursor: default;
+  -webkit-user-select: none;
+  overflow: auto;
+  height: 100%;
+
+  .entry {
+    text-wrap: none;
+    white-space: nowrap;
+
+    & > .header,
+    > .name {
+      z-index: 1;
+      position: relative;
+      display: inline-block;
+    }
+  }
+
+  .selected > .highlight {
+    position: absolute;
+    left: 0;
+    right: 0;
+    height: 24px;
+  }
+
+  .disclosure-arrow {
+    display: inline-block;
+  }
+}
+
+.tree-view-dialog {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 99;
+}

src/stdlib/cson.coffee

@@ -1,3 +1,4 @@
+require 'underscore-extensions'
 _ = require 'underscore'
 
 module.exports =

src/stdlib/fs.coffee

@@ -63,11 +63,11 @@ module.exports =
     paths = []
     if extensions
       onPath = (path) =>
-        paths.push(@join(rootPath, path)) if _.contains(extensions, @extension(path))
+        paths.push(path) if _.contains(extensions, @extension(path))
         false
     else
       onPath = (path) =>
-        paths.push(@join(rootPath, path))
+        paths.push(path)
         false
     @traverseTree(rootPath, onPath, onPath)
     paths
@@ -75,7 +75,7 @@ module.exports =
   listTree: (rootPath) ->
     paths = []
     onPath = (path) =>
-      paths.push(@join(rootPath, path))
+      paths.push(path)
       true
     @traverseTree(rootPath, onPath, onPath)
     paths

src/stdlib/require.coffee

@@ -66,6 +66,13 @@ exts =
     evaluated = exts.js(file, compiled)
     $native.write(cacheFilePath, compiled) if writeToCache
     evaluated
+  less: (file) ->
+    output = ""
+    (new less.Parser).parse __read(file), (e, tree) ->
+      throw new Error(e.message, file, e.line) if e
+      output = tree.toCSS()
+    output
+
 
 getPath = (path) ->
   path = resolve(path)

static/atom.css

@@ -1,86 +0,0 @@
-html, body {
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-}
-
-#root-view {
-  height: 100%;
-  overflow: hidden;
-  position: relative;
-}
-
-#root-view #horizontal {
-  display: -webkit-flex;
-  height: 100%;
-}
-
-#root-view #vertical {
-  display: -webkit-flex;
-  -webkit-flex: 1;
-  -webkit-flex-flow: column;
-}
-
-#panes {
-  position: relative;
-  -webkit-flex: 1;
-}
-
-#panes .column {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  overflow-y: hidden;
-}
-
-#panes .row {
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  overflow-x: hidden;
-}
-
-#panes .pane {
-  position: absolute;
-  display: -webkit-flex;
-  -webkit-flex-flow: column;
-  top: 0;
-  bottom: 0;
-  left: 0;
-  right: 0;
-  box-sizing: border-box;
-}
-
-#panes .pane .item-views {
-  -webkit-flex: 1;
-  display: -webkit-flex;
-  -webkit-flex-flow: column;
-}
-
-#panes .pane .item-views > * {
-  -webkit-flex: 1;
-  min-height: 0;
-}
-
-@font-face {
-  font-family: 'Octicons Regular';
-  src: url("octicons-regular-webfont.woff") format("woff");
-  font-weight: normal;
-  font-style: normal;
-}
-
-.is-loading {
-  background-image: url(images/spinner.svg);
-  background-repeat: no-repeat;
-  width: 14px;
-  height: 14px;
-  opacity: 0.5;
-  background-size: contain;
-  position: relative;
-  display: inline-block;
-  padding-left: 19px;
-}

static/atom.less

@@ -0,0 +1,86 @@
+html, body {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+}
+
+#root-view {
+  height: 100%;
+  overflow: hidden;
+  position: relative;
+
+  #horizontal {
+    display: -webkit-flex;
+    height: 100%;
+  }
+
+  #vertical {
+    display: -webkit-flex;
+    -webkit-flex: 1;
+    -webkit-flex-flow: column;
+  }
+}
+
+#panes {
+  position: relative;
+  -webkit-flex: 1;
+
+  .column {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    overflow-y: hidden;
+  }
+
+  .row {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    overflow-x: hidden;
+  }
+
+  .pane {
+    position: absolute;
+    display: -webkit-flex;
+    -webkit-flex-flow: column;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    box-sizing: border-box;
+  }
+
+  .pane .item-views {
+    -webkit-flex: 1;
+    display: -webkit-flex;
+    -webkit-flex-flow: column;
+  }
+
+  .pane .item-views > * {
+    -webkit-flex: 1;
+    min-height: 0;
+  }
+}
+
+@font-face {
+  font-family: 'Octicons Regular';
+  src: url("octicons-regular-webfont.woff") format("woff");
+  font-weight: normal;
+  font-style: normal;
+}
+
+.is-loading {
+  background-image: url(images/spinner.svg);
+  background-repeat: no-repeat;
+  width: 14px;
+  height: 14px;
+  opacity: 0.5;
+  background-size: contain;
+  position: relative;
+  display: inline-block;
+  padding-left: 19px;
+}

static/command-panel.css

@@ -1,135 +0,0 @@
-.command-panel {
-  position: relative;
-  padding: 0;
-}
-
-.command-panel .is-loading {
-  display: block;
-  margin: 0 auto 10px auto;
-  width: 100px;
-  background-color: #111;
-  background-size: auto;
-  background-position: 5px 5px;
-  padding: 5px 5px 10px 30px;
-  border-radius: 3px;
-  border: 1px solid rgba(255, 255, 255,  0.1);
-  border-top: 1px solid rgba(0, 0, 0, 1);
-  border-left: 1px solid rgba(0, 0, 0, 1);
-}
-
-.command-panel .preview-count {
-  display: inline-block;
-  margin-top: 4px;
-  font-size: 11px;
-}
-
-.command-panel .preview-list {
-  max-height: 300px;
-  overflow: auto;
-  margin: 0 0 10px 0;
-  position: relative;
-  cursor: default;
-}
-
-.command-panel .header:after {
-  content: ".";
-  display: block;
-  visibility: hidden;
-  clear: both;
-  height: 0;
-}
-
-.command-panel .expand-collapse {
-  float: right;
-}
-
-.command-panel .expand-collapse li {
-  display: inline-block;
-  cursor: pointer;
-  font-size: 11px;
-  margin-left: 5px;
-  padding: 5px 10px;
-  border-radius: 3px;
-}
-
-.command-panel .preview-count,
-.command-panel .expand-collapse {
-  -webkit-user-select: none;
-}
-
-.command-panel .preview-list .path {
-  position: relative;
-  -webkit-user-select: none;
-}
-
-.command-panel .preview-list .path-details:before {
-  font-family: 'Octicons Regular';
-  font-size: 12px;
-  width: 12px;
-  height: 12px;
-  margin-right: 5px;
-  margin-left: 5px;
-  -webkit-font-smoothing: antialiased;
-  content: "\f05b";
-  position: relative;
-  top: 0;
-}
-
-.command-panel .preview-list .is-collapsed .path-details:before {
-  content: "\f05a";
-}
-
-.command-panel .preview-list .path-name:before {
-  font-family: 'Octicons Regular';
-  font-size: 16px;
-  width: 16px;
-  height: 16px;
-  margin-right: 5px;
-  -webkit-font-smoothing: antialiased;
-  content: "\f011";
-  position: relative;
-  top: 1px;
-}
-
-.command-panel .preview-list .path.readme .path-name:before {
-  content: "\f007";
-}
-
-.command-panel .preview-list .operation {
-  padding-top: 2px;
-  padding-bottom: 2px;
-  padding-left: 10px;
-}
-
-.command-panel .preview-list .line-number {
-  margin-right: 1ex;
-  text-align: right;
-  display: inline-block;
-}
-
-.command-panel .preview-list .path-match-number {
-  padding-left: 8px;
-}
-
-.command-panel .preview-list .preview {
-  word-break: break-all;
-}
-
-.command-panel .preview-list .preview .match {
-  -webkit-border-radius: 2px;
-  padding: 1px;
-}
-
-.command-panel .prompt-and-editor .editor {
-  position: relative;
-  -webkit-flex: 1;
-}
-
-.command-panel .prompt-and-editor {
-  display: -webkit-flex;
-}
-
-.error-messages {
-  padding: 5px 1em;
-  color: white;
-}

static/command-panel.less

@@ -0,0 +1,132 @@
+.command-panel {
+  position: relative;
+  padding: 0;
+
+  .is-loading {
+    display: block;
+    margin: 0 auto 10px auto;
+    width: 100px;
+    background-color: #111111;
+    background-size: auto;
+    background-position: 5px 5px;
+    padding: 5px 5px 10px 30px;
+    border-radius: 3px;
+    border: 1px solid rgba(255,255,255,0.1);
+    border-top: 1px solid rgba(0,0,0,1);
+    border-left: 1px solid rgba(0,0,0,1);
+  }
+
+  .preview-count {
+    display: inline-block;
+    margin-top: 4px;
+    font-size: 11px;
+    -webkit-user-select: none;
+  }
+
+  .preview-list {
+    max-height: 300px;
+    overflow: auto;
+    margin: 0 0 10px 0;
+    position: relative;
+    cursor: default;
+
+    .path {
+      position: relative;
+      -webkit-user-select: none;
+    }
+
+    .path-details:before {
+      font-family: 'Octicons Regular';
+      font-size: 12px;
+      width: 12px;
+      height: 12px;
+      margin-right: 5px;
+      margin-left: 5px;
+      -webkit-font-smoothing: antialiased;
+      content: "\f05b";
+      position: relative;
+      top: 0;
+    }
+
+    .is-collapsed .path-details:before {
+      content: "\f05a";
+    }
+
+    .path-name:before {
+      font-family: 'Octicons Regular';
+      font-size: 16px;
+      width: 16px;
+      height: 16px;
+      margin-right: 5px;
+      -webkit-font-smoothing: antialiased;
+      content: "\f011";
+      position: relative;
+      top: 1px;
+    }
+
+    .path.readme .path-name:before {
+      content: "\f007";
+    }
+
+    .operation {
+      padding-top: 2px;
+      padding-bottom: 2px;
+      padding-left: 10px;
+    }
+
+    .line-number {
+      margin-right: 1ex;
+      text-align: right;
+      display: inline-block;
+    }
+
+    .path-match-number {
+      padding-left: 8px;
+    }
+
+    .preview {
+      word-break: break-all;
+
+      .match {
+        -webkit-border-radius: 2px;
+        padding: 1px;
+      }
+    }
+  }
+
+  .header:after {
+    content: ".";
+    display: block;
+    visibility: hidden;
+    clear: both;
+    height: 0;
+  }
+
+  .expand-collapse {
+    float: right;
+    -webkit-user-select: none;
+
+    li {
+      display: inline-block;
+      cursor: pointer;
+      font-size: 11px;
+      margin-left: 5px;
+      padding: 5px 10px;
+      border-radius: 3px;
+    }
+  }
+
+  .prompt-and-editor {
+    display: -webkit-flex;
+
+    .editor {
+      position: relative;
+      -webkit-flex: 1;
+    }
+  }
+}
+
+.error-messages {
+  padding: 5px 1em;
+  color: white;
+}

static/markdown.css

@@ -1,23 +0,0 @@
-.source.gfm {
-  -webkit-font-smoothing: antialiased;
-}
-
-.gfm .markup.heading {
-  font-weight: bold;
-}
-
-.gfm .bold {
-  font-weight: bold;
-}
-
-.gfm .italic {
-  font-style: italic;
-}
-
-.gfm .comment.quote {
-  font-style: italic;
-}
-
-.gfm .raw {
-  -webkit-font-smoothing: subpixel-antialiased;
-}

static/markdown.less

@@ -0,0 +1,25 @@
+.source {
+  .gfm {
+    -webkit-font-smoothing: antialiased;
+
+    .markup.heading {
+      font-weight: bold;
+    }
+
+    .bold {
+      font-weight: bold;
+    }
+
+    .italic {
+      font-style: italic;
+    }
+
+    .comment.quote {
+      font-style: italic;
+    }
+
+    .raw {
+      -webkit-font-smoothing: subpixel-antialiased;
+    }
+  }
+}