Display line number and symbol on the same line

[gruzzlymug]

I'd like to get a more compact view of the symbols in the scrollable list. There is a lot of empty space to the right of the symbol and line number in the display in the list. I'd like to be able to see more symbols at once (in the same amount of space).

I think the file I'd like to modify is file-view.coffee. I could not find a way to change it locally. Is there a simple way to do this?

Thanks for making such a useful package.

[thedaniel]

You can style that in your own styles.less file - you'll have to play around a bit to get it the way you want, but these selectors should get you started:

.symbols-view {
  .two-lines {
    .primary-line {
    }
    .secondary-line {
    }
  }
}

cc @simurai in case he has feedback on this, but I don't think we'll change the default view of the symbols to one line.

[simurai]

This should make it one line only:

.symbols-view {
  .two-lines {
    display: flex !important;
    .primary-line {
      flex: 1;
    }
    .secondary-line {
    }
  }
}

[thedaniel]

Looks like you're all set. I'm closing this, reopen if you need further clarification.

[gruzzlymug]

Thanks!

I tweaked it a bit to get the Line # on the left. The column alignment could be a bit better but I'll work on that later.

.symbols-view {
  .two-lines {
    display: flex !important;
    .primary-line {
      flex: 1;
      order: 1;
    }
    .secondary-line {
      order: 0;
      padding-right: 10px;
    }
  }
}

[m3talstorm]

If you want the ctrl+r menu to be as compact (vertically) as possible then add this to your .atom/styles.less

// Make the ctrl+r window compact (vertically)
atom-panel.modal .select-list ol.list-group li, atom-panel.modal.select-list ol.list-group li {
    padding-top: 0em;
    padding-right: 1em;
    padding-bottom: 0em;
    padding-left: 1em;
}