Bug 1520957 - [release 119] 7536/improve source pane padding (#7651). r=dwalsh
☠☠ backed out by 5b1c54cbac38 ☠ ☠
authorGary Blackwood <gary@garyblackwood.co.uk>
Fri, 18 Jan 2019 12:17:08 -0500
changeset 514560 f1f01efee7672d83fc3940fa3785ebc7a4d68307
parent 514559 118720bcf7bd6cece9570eb8b459bc7d57cc227f
child 514561 b74cd7c3ae9b23815cc5b863f1db2cc0d8c4a6fc
push id1953
push userffxbld-merge
push dateMon, 11 Mar 2019 12:10:20 +0000
treeherdermozilla-release@9c35dcbaa899 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersdwalsh
bugs1520957
milestone66.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1520957 - [release 119] 7536/improve source pane padding (#7651). r=dwalsh
devtools/client/debugger/new/dist/debugger.css
devtools/client/debugger/new/dist/vendors.js
devtools/client/debugger/new/src/components/PrimaryPanes/OutlineFilter.css
devtools/client/debugger/new/src/components/PrimaryPanes/Sources.css
devtools/client/debugger/new/src/components/shared/tests/__snapshots__/ManagedTree.spec.js.snap
devtools/client/debugger/new/src/components/test/__snapshots__/ProjectSearch.spec.js.snap
devtools/client/shared/components/reps/reps.js
--- a/devtools/client/debugger/new/dist/debugger.css
+++ b/devtools/client/debugger/new/dist/debugger.css
@@ -1818,18 +1818,17 @@ menuseparator {
   position: fixed;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   z-index: 999;
 }
 .outline-filter {
-  margin: 5px 0 0 0;
-  padding: 0px 10px;
+  padding: 4px 10px 0 10px;
 }
 
 .outline-filter-input {
   padding: 0.5em 1.6em;
   width: 100%;
   border: 1px solid var(--theme-splitter-color);
   background-color: var(--theme-sidebar-background);
   color: var(--theme-body-color);
@@ -2095,18 +2094,18 @@ menuseparator {
   display: flex;
 }
 
 .sources-list .managed-tree {
   flex: 1;
   display: flex;
 }
 
-.sources-list .managed-tree .tree-node:first-child {
-  margin-top: 4px;
+.sources-list .managed-tree .tree {
+  padding: 4px 0;
 }
 
 .sources-list .managed-tree .tree .node {
   padding: 0 10px 0 3px;
   width: 100%;
 }
 
 .sources-list .tree .img.arrow {
--- a/devtools/client/debugger/new/dist/vendors.js
+++ b/devtools/client/debugger/new/dist/vendors.js
@@ -5029,20 +5029,17 @@ class Tree extends Component {
             this.props.onCollapse(item, e.altKey);
           } else {
             this.props.onExpand(item, e.altKey);
           }
         }
       });
     });
 
-    const style = Object.assign({}, this.props.style || {}, {
-      padding: 0,
-      margin: 0
-    });
+    const style = Object.assign({}, this.props.style || {});
 
     return _reactDomFactories2.default.div({
       className: `tree ${this.props.className ? this.props.className : ""}`,
       ref: el => {
         this.treeRef = el;
       },
       role: "tree",
       tabIndex: "0",
--- a/devtools/client/debugger/new/src/components/PrimaryPanes/OutlineFilter.css
+++ b/devtools/client/debugger/new/src/components/PrimaryPanes/OutlineFilter.css
@@ -1,11 +1,10 @@
 .outline-filter {
-  margin: 5px 0 0 0;
-  padding: 0px 10px;
+  padding: 4px 10px 0 10px;
 }
 
 .outline-filter-input {
   padding: 0.5em 1.6em;
   width: 100%;
   border: 1px solid var(--theme-splitter-color);
   background-color: var(--theme-sidebar-background);
   color: var(--theme-body-color);
--- a/devtools/client/debugger/new/src/components/PrimaryPanes/Sources.css
+++ b/devtools/client/debugger/new/src/components/PrimaryPanes/Sources.css
@@ -66,18 +66,18 @@
   display: flex;
 }
 
 .sources-list .managed-tree {
   flex: 1;
   display: flex;
 }
 
-.sources-list .managed-tree .tree-node:first-child {
-  margin-top: 4px;
+.sources-list .managed-tree .tree {
+  padding: 4px 0;
 }
 
 .sources-list .managed-tree .tree .node {
   padding: 0 10px 0 3px;
   width: 100%;
 }
 
 .sources-list .tree .img.arrow {
--- a/devtools/client/debugger/new/src/components/shared/tests/__snapshots__/ManagedTree.spec.js.snap
+++ b/devtools/client/debugger/new/src/components/shared/tests/__snapshots__/ManagedTree.spec.js.snap
@@ -214,22 +214,17 @@ exports[`ManagedTree sets expanded items
       <div
         className="tree "
         onBlur={[Function]}
         onFocus={[Function]}
         onKeyDown={[Function]}
         onKeyPress={[Function]}
         onKeyUp={[Function]}
         role="tree"
-        style={
-          Object {
-            "margin": 0,
-            "padding": 0,
-          }
-        }
+        style={Object {}}
         tabIndex="0"
       >
         <TreeNode
           depth={0}
           expanded={true}
           focused={false}
           id="a-$"
           index={0}
@@ -438,22 +433,17 @@ exports[`ManagedTree sets expanded items
       <div
         className="tree "
         onBlur={[Function]}
         onFocus={[Function]}
         onKeyDown={[Function]}
         onKeyPress={[Function]}
         onKeyUp={[Function]}
         role="tree"
-        style={
-          Object {
-            "margin": 0,
-            "padding": 0,
-          }
-        }
+        style={Object {}}
         tabIndex="0"
       >
         <TreeNode
           depth={0}
           expanded={false}
           focused={false}
           id="a-$"
           index={0}
--- a/devtools/client/debugger/new/src/components/test/__snapshots__/ProjectSearch.spec.js.snap
+++ b/devtools/client/debugger/new/src/components/test/__snapshots__/ProjectSearch.spec.js.snap
@@ -229,22 +229,17 @@ exports[`ProjectSearch found search resu
             <div
               className="tree "
               onBlur={[Function]}
               onFocus={[Function]}
               onKeyDown={[Function]}
               onKeyPress={[Function]}
               onKeyUp={[Function]}
               role="tree"
-              style={
-                Object {
-                  "margin": 0,
-                  "padding": 0,
-                }
-              }
+              style={Object {}}
               tabIndex="0"
             >
               <TreeNode
                 depth={0}
                 expanded={true}
                 focused={false}
                 id="undefined-$"
                 index={0}
--- a/devtools/client/shared/components/reps/reps.js
+++ b/devtools/client/shared/components/reps/reps.js
@@ -4584,20 +4584,17 @@ class Tree extends Component {
             this.props.onCollapse(item, e.altKey);
           } else {
             this.props.onExpand(item, e.altKey);
           }
         }
       });
     });
 
-    const style = Object.assign({}, this.props.style || {}, {
-      padding: 0,
-      margin: 0
-    });
+    const style = Object.assign({}, this.props.style || {});
 
     return _reactDomFactories2.default.div({
       className: `tree ${this.props.className ? this.props.className : ""}`,
       ref: el => {
         this.treeRef = el;
       },
       role: "tree",
       tabIndex: "0",