[directory tree] Fix ejectable volume label width and splitter margin

The eject button should be 3px left of the splitter (not 0px), and the
label width computation should include that 3px splitter gap + the 6px
margin either side of the label.

See crbug.com/979162#c20 and crbug.com/979162#c21 for the computations
of the values. The result would look like this:

  ____________________________________|‾‾‾‾‾|         ;;
  |..6px..|____label_width____|..6px..|  ⏏  | < 3px > ;; < splitter
                                      |_____|         ;;

However after CL:1617041, removable volume labels and the eject button
are position: absolute. And the splitter bar can be used to reduce the
width of the directory tree. Doing that causes the label text to '...'
elide: removable volume labels are the only directory tree labels that
do that (... elide) in Files app at this time!

Including the 6px margin either side of the label in the width, causes
the label text to completely elide (disappear) when the directory tree
width is small. To avoid that and at least show some characters of the
label text when elided, we _do not_ include the 6px margin either side
of the label in its width computation, but do account for the 3px gap,

   width: calc(100% - 48px - 40px - 3px);

which gets added in this CL (using right: 3px) to the eject button. If
future developers wonder about it, this long-ish change log might help
them understand the intricate CSS minutiae of the eject button.

Bug: 979162
Change-Id: I73a9cd89ba5b88ba603301ba3187c86cb4875670
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1712350Reviewed-by: Noel Gordon <noel@chromium.org>
Reviewed-by: Austin Tankiang <austinct@chromium.org>
Commit-Queue: Noel Gordon <noel@chromium.org>
Cr-Commit-Position: refs/heads/master@{#679838}

ui/file_manager/file_manager/foreground/css/file_manager.css

@@ -173,7 +173,7 @@ div.splitter {
 .ejectable > span.label {
   left: 48px;
   position: absolute;
-  width: calc(100% - 48px - 40px);
+  width: calc(100% - 48px - 40px - 3px);
 }
 
 #directory-tree .tree-row .rename-placeholder {
@@ -228,7 +228,7 @@ div.splitter {
   flex: none;
   height: 40px;
   position: absolute;
-  right: 0;
+  right: 3px;
   width: 40px;
   z-index: 1;  /* Make sure the icon is on upper layer than paper-ripple. */
 }