Add primary/secondary line classes to select list

This will be a style that can be used by extending
classes to provide two lines that don't wrap with
color and padding.

This is initially used by symbols view and fuzzy finder.

src/packages/fuzzy-finder/lib/fuzzy-finder-view.coffee

@@ -37,7 +37,7 @@ class FuzzyFinderView extends SelectList
 
   itemForElement: (path) ->
     $$ ->
-      @li =>
+      @li class: 'two-lines', =>
         if git?
           status = git.statuses[path]
           if git.isStatusNew(status)
@@ -59,8 +59,8 @@ class FuzzyFinderView extends SelectList
         else
           typeClass = 'text-name'
 
-        @div fsUtils.base(path), class: "file #{typeClass}"
-        @div project.relativize(path), class: 'path'
+        @div fsUtils.base(path), class: "primary-line file #{typeClass}"
+        @div project.relativize(path), class: 'secondary-line path'
 
   openPath: (path) ->
     rootView.open(path, {@allowActiveEditorChange}) if path

src/packages/fuzzy-finder/stylesheets/fuzzy-finder.less

@@ -5,9 +5,6 @@
   }
 
   .path {
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
     color: rgba(0, 0, 0, 0.5);
     margin-left: 26px;
     font-size: .9em;
@@ -37,10 +34,6 @@
   }
 
   .file {
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    overflow: hidden;
-
     &:before {
       font-family: 'Octicons Regular';
       font-size: 16px;

src/packages/symbols-view/lib/symbols-view.coffee

@@ -25,13 +25,13 @@ class SymbolsView extends SelectList
 
   itemForElement: ({position, name, file}) ->
     $$ ->
-      @li =>
-        @span name
+      @li class: 'two-lines', =>
+        @div name, class: 'primary-line'
         if position
           text = "Line #{position.row + 1}"
         else
           text = fsUtils.base(file)
-        @div text, class: 'right function-details'
+        @div text, class: 'secondary-line'
 
   toggleFileSymbols: ->
     if @hasParent()

src/packages/symbols-view/spec/symbols-view-spec.coffee

@@ -30,10 +30,10 @@ describe "SymbolsView", ->
         expect(symbolsView.find('.loading')).toBeEmpty()
         expect(rootView.find('.symbols-view')).toExist()
         expect(symbolsView.list.children('li').length).toBe 2
-        expect(symbolsView.list.children('li:first').find('span')).toHaveText 'quicksort'
-        expect(symbolsView.list.children('li:first').find('.function-details')).toHaveText 'Line 1'
-        expect(symbolsView.list.children('li:last').find('span')).toHaveText 'quicksort.sort'
-        expect(symbolsView.list.children('li:last').find('.function-details')).toHaveText 'Line 2'
+        expect(symbolsView.list.children('li:first').find('.primary-line')).toHaveText 'quicksort'
+        expect(symbolsView.list.children('li:first').find('.secondary-line')).toHaveText 'Line 1'
+        expect(symbolsView.list.children('li:last').find('.primary-line')).toHaveText 'quicksort.sort'
+        expect(symbolsView.list.children('li:last').find('.secondary-line')).toHaveText 'Line 2'
         expect(symbolsView).not.toHaveClass "error"
         expect(symbolsView.error).not.toBeVisible()
 
@@ -175,7 +175,7 @@ describe "SymbolsView", ->
         editor.trigger 'symbols-view:go-to-declaration'
         symbolsView = rootView.find('.symbols-view').view()
         expect(symbolsView.list.children('li').length).toBe 1
-        expect(symbolsView.list.children('li:first').find('span')).toHaveText 'tagged.js'
+        expect(symbolsView.list.children('li:first').find('.primary-line')).toHaveText 'tagged.js'
 
   describe "project symbols", ->
     it "displays all tags", ->
@@ -192,10 +192,10 @@ describe "SymbolsView", ->
         expect(symbolsView.find('.loading')).toBeEmpty()
         expect(rootView.find('.symbols-view')).toExist()
         expect(symbolsView.list.children('li').length).toBe 4
-        expect(symbolsView.list.children('li:first').find('span')).toHaveText 'callMeMaybe'
-        expect(symbolsView.list.children('li:first').find('.function-details')).toHaveText 'tagged.js'
-        expect(symbolsView.list.children('li:last').find('span')).toHaveText 'thisIsCrazy'
-        expect(symbolsView.list.children('li:last').find('.function-details')).toHaveText 'tagged.js'
+        expect(symbolsView.list.children('li:first').find('.primary-line')).toHaveText 'callMeMaybe'
+        expect(symbolsView.list.children('li:first').find('.secondary-line')).toHaveText 'tagged.js'
+        expect(symbolsView.list.children('li:last').find('.primary-line')).toHaveText 'thisIsCrazy'
+        expect(symbolsView.list.children('li:last').find('.secondary-line')).toHaveText 'tagged.js'
         expect(symbolsView).not.toHaveClass "error"
         expect(symbolsView.error).not.toBeVisible()
 

static/select-list.less

@@ -19,6 +19,16 @@
     li {
       padding: 10px;
       display: block;
+
+      &.two-lines {
+        padding: 5px 10px 5px 10px;
+      }
+
+      .primary-line, .secondary-line {
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        overflow: hidden;
+      }
     }
 
     li:last-child {

themes/atom-dark-ui/select-list.less

@@ -36,7 +36,7 @@
     }
 
     .right,
-    .path {
+    .secondary-line {
       color: #777;
     }
 
@@ -45,7 +45,7 @@
     }
 
     .selected .right,
-    .selected .path {
+    .selected .secondary-line {
       color: #ccc;
     }