Fix the rounded corner box shadows on panels

The CSS for rounded corner box shadows on the display panels didn't
make the panel items themselves have rounded corners.

This adds rounding to the panel item elements and tweaks the display
panel box shadows.

Bug: 947388
Change-Id: Iad2ca10b42f0bd307e30479896c071095c5b94a3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1698389Reviewed-by: Luciano Pacheco <lucmult@chromium.org>
Commit-Queue: Alex Danilo <adanilo@chromium.org>
Cr-Commit-Position: refs/heads/master@{#676756}

ui/file_manager/file_manager/foreground/elements/xf_display_panel.js

@@ -68,8 +68,8 @@ class DisplayPanel extends HTMLElement {
               #container {
                   align-items: stretch;
                   background-color: #FFF;
-                  box-shadow: -2px -1px rgba(60, 64, 67, 0.15),
-                              -1px 2px rgba(60, 64, 67, 0.3),
+                  box-shadow: -1px -1px rgba(60, 64, 67, 0.15),
+                              0px 2px rgba(60, 64, 67, 0.3),
                               2px 0px rgba(60, 64, 67, 0.15);
                   border-radius: 4px;
                   display: flex;

ui/file_manager/file_manager/foreground/elements/xf_panel_item.js

@@ -58,6 +58,7 @@ class PanelItem extends HTMLElement {
               .xf-panel-item {
                   align-items: center;
                   background-color: #FFF;
+                  border-radius: 4px;
                   display: flex;
                   flex-direction: row;
                   max-width: 400px;