Unify iron-dropdown CSS

chrome/browser/resources/settings/settings_shared_css.html

Index: chrome/browser/resources/settings/settings_shared_css.html
diff --git a/chrome/browser/resources/settings/settings_shared_css.html b/chrome/browser/resources/settings/settings_shared_css.html
index a04010cd17536ac42079476780000fd5e90f8298..beb794e7925c324ce6264a24396a6cb7b19377c0 100644
--- a/chrome/browser/resources/settings/settings_shared_css.html
+++ b/chrome/browser/resources/settings/settings_shared_css.html
@@ -55,6 +55,16 @@
         outline: none;
       }
 
+      iron-dropdown .dropdown-content {
+        background-color: white;
+        box-shadow: 0 2px 6px var(--paper-grey-500);
+      }
+
+      iron-dropdown .dropdown-content paper-item:hover {

[dpapad, 2016/07/08 21:01:29]

Do we want to preserve the hover effect? In dropdown lists we only have focus
effect, but not hover (see
https://chromium.googlesource.com/chromium/src/+/4d8e2d9c3a4e495f4df013cad9ab...).

Also could we get rid of paper-items inside iron-dropdown lists, in favor of
divs with a dropdown-item CSS class (see lines 40-56 above). Perhaps that is
better suited as a separate cleanup. 

[stevenjb, 2016/07/08 21:03:53]

I'd prefer to make both changes in a separate cleanup. In particular, the the
focus only effect would, imho, be particularly bad for iron-dropdown.

+        @apply(--settings-actionable);

[Dan Beam, 2016/07/08 23:08:08]

I probably would've done this:

iron-dropdown .dropdown-content paper-item {
  @apply(--settings-actionable);
}

instead of only on :hover, but I suppose this works while --settings-actionable
only has cursor: pointer;

[stevenjb, 2016/07/08 23:50:05]

Oh, yeah, that's actually what I had in my head. I will fix this and also use >
* instead of paper-item so this will work when we use div instead.
 

+        background-color: var(--settings-hover-color);
+      }
+
       span ~ a {
         -webkit-margin-start: 4px;
       }