WebUI Dark Mode: update "drop to install" dialog on extensions page

Screenshot: on bug

R=rdevlin.cronin@chromium.org
BUG=937165

Change-Id: If381e0cf96b9649fc5c3871cf6a7887e8176c9f3
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1496598
Auto-Submit: Dan Beam <dbeam@chromium.org>
Reviewed-by: Devlin <rdevlin.cronin@chromium.org>
Cr-Commit-Position: refs/heads/master@{#637500}
diff --git a/chrome/browser/resources/md_extensions/drop_overlay.html b/chrome/browser/resources/md_extensions/drop_overlay.html
index 3eb0139..985c3ca 100644
--- a/chrome/browser/resources/md_extensions/drop_overlay.html
+++ b/chrome/browser/resources/md_extensions/drop_overlay.html
@@ -13,16 +13,21 @@
     <style include="cr-hidden-style">
       :host {
         align-items: center;
-        background-color: #f1f1f1;
+        background-color: rgba(241, 241, 241, .9);
+        color: var(--cr-secondary-text-color);
         display: flex;
         height: 100%;
         justify-content: center;
-        opacity: 0.9;
         position: absolute;
         width: 100%;
         z-index: 10;
       }
 
+      :host-context([dark]) {
+        /* TODO(dbeam): share with cr-dialog dialog::backdrop? */
+        background-color: rgba(0, 0, 0, .6);
+      }
+
       #container {
         align-items: center;
         display: flex;
@@ -30,7 +35,6 @@
       }
 
       iron-icon {
-        color: var(--google-grey-refresh-700);
         height: 64px;
         margin-bottom: 16px;
         width: 64px;