[sources] Fix tree item colors in Workspace tab.

Make sure that the file systems with no mapped files are grayed out,
including their file/folder items, and even when they are selected.
At the same time ensure that files/folders in file systems with mapped
files don't show grayed out.

Screenshot: https://imgur.com/nPe6L8R
Fixed: 404256670
Change-Id: Ib8a1183ad58b83cf6cb8258cfc7d0e5632c61677
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6440210
Commit-Queue: Benedikt Meurer <[email protected]>
Auto-Submit: Benedikt Meurer <[email protected]>
Commit-Queue: Alex Rudenko <[email protected]>
Reviewed-by: Alex Rudenko <[email protected]>

Author: bmeurer

front_end/panels/sources/navigatorTree.css

@@ -105,13 +105,15 @@
   color: var(--icon-folder-authored);
 }
 
-.navigator-fs-tree-item:not(.has-mapped-files, .selected) > :not(.selection),
-.navigator-fs-folder-tree-item:not(.has-mapped-files, .selected) > :not(.selection) {
-  color: var(--sys-color-on-surface-subtle);
-  opacity: 40%;
-
-  & devtools-icon {
+.navigator-fs-tree-item:not(.has-mapped-files),
+.navigator-fs-tree-item:not(.has-mapped-files) + ol li {
+  & > :not(.selection) {
     color: var(--sys-color-on-surface-subtle);
+    opacity: 40%;
+
+    & devtools-icon {
+      color: var(--sys-color-on-surface-subtle);
+    }
   }
 }