Unify iron-dropdown CSS

chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html

Index: chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html
diff --git a/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html b/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html
index 500c5f9b411764152e7b1d9d9471a0b65a348a96..42ddd664ee2f82930b4a43cd6a36bc1b76b4c90f 100644
--- a/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html
+++ b/chrome/browser/resources/settings/bluetooth_page/bluetooth_device_list_item.html
@@ -5,9 +5,10 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icon/iron-icon.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-item/paper-item.html">
+<link rel="import" href="/settings_shared_css.html">
 
 <dom-module id="bluetooth-device-list-item">
-  <style>
+  <style include="settings-shared">
     iron-icon {
       -webkit-padding-start: 10px;
     }
@@ -19,12 +20,6 @@
     span.name[connected] {
       font-weight: 500;
     }
-
-    /* TODO(dbeam): combine with other similar styles. */
-    .dropdown-content {
-      background: white;
-      box-shadow: 0 2px 6px grey;
-    }
   </style>
   <template>
     <div class="flex layout horizontal center" dropdown$="[[dropdownOpened]]"
@@ -36,16 +31,11 @@
       </iron-icon>
       <span class="flex"></span>
       <span hidden$="[[!device.connecting]]">$i18n{bluetoothConnecting}</span>
-      <!-- This <div on-tap> is not [actionable] because its effect is not user
-           visible. -->

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

why are you removing this?

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

I looked through the code and found a number of divs with on-tap and no
'actionable' property and no comment. It wasn't clear to me what was special
about this one, other than the TODO below which I believe is now resolved.

I can restore it if you think it's helpful, but maybe we can clarify it?

[Dan Beam, 2016/07/09 00:09:59]

which ones?
how would you clarify it?

       <div hidden$="[[!device.paired]]" on-tap="doNothing_">
         <paper-icon-button icon="cr:more-vert" toggles
             active="{{dropdownOpened}}">
         </paper-icon-button>
-        <!-- TODO(dbeam): does this need [actionable] if all the controls are
-             paper-items. Conversely, should the on-tap be at this level? -->
-        <iron-dropdown opened="{{dropdownOpened}}" on-tap="menuSelected_"
-            actionable>
+        <iron-dropdown opened="{{dropdownOpened}}" on-tap="menuSelected_">
           <div class="dropdown-content">
             <paper-item id="connect" hidden$="[[device.connected]]">
               $i18n{bluetoothConnect}