Use octicon as folding indicator

spec/app/editor-spec.coffee

@@ -1903,16 +1903,18 @@ describe "Editor", ->
       editor.attachToDom()
 
     describe "when a fold-selection event is triggered", ->
-      it "folds the lines covered by the selection into a single line with a fold class", ->
+      it "folds the lines covered by the selection into a single line with a fold class and marker", ->
         editor.getSelection().setBufferRange(new Range([4, 29], [7, 4]))
         editor.trigger 'editor:fold-selection'
 
         expect(editor.renderedLines.find('.line:eq(4)')).toHaveClass('fold')
+        expect(editor.renderedLines.find('.line:eq(4) > .fold-marker')).toExist()
         expect(editor.renderedLines.find('.line:eq(5)').text()).toBe '8'
 
         expect(editor.getSelection().isEmpty()).toBeTruthy()
         expect(editor.getCursorScreenPosition()).toEqual [5, 0]
 
+
     describe "when a fold placeholder line is clicked", ->
       it "removes the associated fold and places the cursor at its beginning", ->
         editor.setCursorBufferPosition([3,0])
@@ -1921,6 +1923,7 @@ describe "Editor", ->
         editor.find('.fold.line').mousedown()
 
         expect(editor.find('.fold')).not.toExist()
+        expect(editor.find('.fold-marker')).not.toExist()
         expect(editor.renderedLines.find('.line:eq(4)').text()).toMatch /4-+/
         expect(editor.renderedLines.find('.line:eq(5)').text()).toMatch /5/
 

src/app/editor.coffee

@@ -1059,8 +1059,6 @@ class Editor extends View
 
     if fold = screenLine.fold
       lineAttributes = { class: 'fold line', 'fold-id': fold.id }
-      if @activeEditSession.selectionIntersectsBufferRange(fold.getBufferRange())
-        lineAttributes.class += ' selected'
     else
       lineAttributes = { class: 'line' }
 
@@ -1093,6 +1091,8 @@ class Editor extends View
       if invisibles.eol
         line.push("<span class='invisible'>#{invisibles.eol}</span>")
 
+    line.push("<span class='fold-marker'/>") if fold
+
     line.push('</pre>')
     line.join('')
 

themes/Atom - Dark/editor.css

@@ -43,21 +43,24 @@
   -webkit-animation-iteration-count: 1;
 }
 
-.editor .line.fold {
-  background-color: #444;
-}
-
 .editor .gutter .line-number.fold {
-  color: #FBA0E3;
-  opacity: .75;
+  color: #fba0e3;
+  opacity: .8;
 }
 
 .editor .gutter .line-number.fold.cursor-line {
   opacity: 1;
 }
 
-.editor .fold.selected {
-  background-color: #244;
+.editor .fold-marker:before {
+  content: '\f25e';
+  font-family: 'Octicons Regular';
+  display: inline-block;
+  margin-left: .5em;
+  margin-top: .1em;
+  line-height: .8em;
+  -webkit-font-smoothing: antialiased;
+  color: #fba0e3;
 }
 
 .editor .invisible {

themes/Atom - Light/editor.css

@@ -46,21 +46,24 @@
   -webkit-animation-iteration-count: 1;
 }
 
-.editor .line.fold {
-  background-color: #444;
-}
-
 .editor .gutter .line-number.fold {
-  color: #FBA0E3;
-  opacity: .75;
+  color: #fba0e3;
+  opacity: .8;
 }
 
 .editor .gutter .line-number.fold.cursor-line {
   opacity: 1;
 }
 
-.editor .fold.selected {
-  background-color: #244;
+.editor .fold-marker:before {
+  content: '\f25e';
+  font-family: 'Octicons Regular';
+  display: inline-block;
+  margin-left: .5em;
+  margin-top: .1em;
+  line-height: .8em;
+  -webkit-font-smoothing: antialiased;
+  color: #fba0e3;
 }
 
 .editor .invisible {