Fix indentation in outline view

Summary:
Showing outline view on this test-spec.js file:

```js
function topLevel1() {}

describe('Should be unindented', () => {
  it('A should be indented 1 level', () => {
  });

  describe('B should be indented 1 level', () => {
    it('BA should be indented 2 levels', () => {
    });
  });
  it('C should be indented 1 level', () => {
  });

});

function topLevel2() {}
```

Before yields:

{F125213807}

Note that the A and C nodes are incorrectly indented; they should be indented to match up with the B node.

After yields:

{F125213851}

Note that this fixes the indenting of the 'A' and 'C' entries in the outline view.

Reviewed By: matthewwithanm

Differential Revision: D7900313

fbshipit-source-id: 1e6b256ea6a74a40e15b4b9a8b8cd8e4773c6d1e

modules/atom-ide-ui/pkg/atom-ide-outline-view/styles/outline-view.less

@@ -31,12 +31,46 @@
  min-width: 100%;
 }
 
-.outline-view-trees .list-item {
+// No padding on the root node.
+.outline-view-trees.list-tree {
+ padding-left: 0px;
+}
+
+// Special case for unexpandable children of the root node.
+.outline-view-trees > .list-item {
+ padding: 0 @component-padding / 2;
+}
+
+.outline-view-trees .list-nested-item {
  padding: 0 @component-padding / 2;
 }
 
-.outline-view-trees.has-collapsable-children .list-nested-item > .list-tree > .list-item {
- padding-left: @component-padding * 4;
+// Atom.less (from https://github.com/atom/atom-ui/blob/master/styles/lists.less)
+// has a rule:
+// .list-tree.has-collapsable-children .has-flat-children li.list-item {
+// margin-left: 0px;
+// }
+// which is not what we want.
+//
+// We really want the rule for:
+// .list-tree.has-collapsable-children li.list-item {
+// margin-left: @component-icon-size;
+// }
+// to win here, so repeat it with a more specific selector.
+.outline-view-trees .has-flat-children li.list-item.outline-view-item {
+ margin-left: @component-icon-size;
+}
+
+// Same issue of overriding default Atom styles as the previous rule.
+// The presence of expandable children should not impact layout.
+.outline-view-trees li.list-item.outline-view-item {
+ margin-left: @component-icon-size;
+}
+
+// This selector identifies just the children of a node with children.
+// We want all children indented the same amount, regardless of what they contain.
+.outline-view-trees .list-tree {
+ padding-left: @component-padding;
 }
 
 .panel-heading .outline-view-close-button {