Improve selected node highlighting by using minWidth instead of width

Codeboy0127 · Codeboy0127 · commit 81b08de73d13 · 2019-02-28T12:56:49.000-08:00
diff --git a/src/devtools/views/Element.css b/src/devtools/views/Element.css
@@ -1,6 +1,5 @@
 .Element,
 .SelectedElement {
-  width: 100%;
   border-radius: 0.25em;
   position: relative;
   white-space: nowrap;
diff --git a/src/devtools/views/Element.js b/src/devtools/views/Element.js
@@ -89,6 +89,8 @@ export default function ElementView({ index, style }: Props) {
       style={{
         ...style, // "style" comes from react-window
         paddingLeft: `${(depth - baseDepth) * 0.75 + 0.25}rem`,
+        width: undefined,
+        minWidth: '100%',
       }}
     >
       <span className={styles.Component} ref={ref}>

Original file line number	Diff line number	Diff line change
`@@ -89,6 +89,8 @@ export default function ElementView({ index, style }: Props) {`
`89`	`89`	`style={{`
`90`	`90`	`...style, // "style" comes from react-window`
`91`	`91`	paddingLeft: `${(depth - baseDepth) * 0.75 + 0.25}rem`,
	`92`	`+ width: undefined,`
	`93`	`+ minWidth: '100%',`
`92`	`94`	`}}`
`93`	`95`	`>`
`94`	`96`	`<span className={styles.Component} ref={ref}>`