WebUI MD Refresh: Update button hover and pressed states up to spec.

Bug: 832173
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: I5ddefc63684ad5fb5d2dff9e1da0a241404c0ac4
Reviewed-on: https://chromium-review.googlesource.com/1066736
Commit-Queue: Demetrios Papadopoulos <dpapad@chromium.org>
Reviewed-by: Scott Chen <scottchen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#560138}

ui/webui/resources/cr_elements/paper_button_style_css.html

@@ -46,18 +46,32 @@
         border-color: rgb(210, 227, 252);
       }
 
+      paper-button:not(.action-button):active {
+        /* google-grey-800 with opacity */
+        box-shadow:
+            0 1px 2px 0 rgba(60, 64, 67, 0.30),
+            0 3px 6px 2px rgba(60, 64, 67, 0.15);
+      }
+
       paper-button.action-button:hover {
         /* google-blue-600 with opacity. */
         background-color: rgba(26,115,232, 0.9);
-        /* google-blue-500 with opacity */
         box-shadow:
-          0 1px 1px 0 rgba(66, 133, 244, 0.54),
-          0 1px 3px 1px rgba(66, 133, 244, 0.30);
+            0 1px 2px 0 var(--google-blue-500-opacity-30),
+            0 1px 3px 1px var(--google-blue-500-opacity-15);
+      }
+
+      paper-button.action-button:active {
+        box-shadow:
+            0 1px 2px 0 var(--google-blue-500-opacity-30),
+            0 3px 6px 2px var(--google-blue-500-opacity-15);
       }
 
       paper-button.action-button {
         --paper-ripple-opacity: 0.32;
         --paper-button-ink-color: white;
+        --google-blue-500-opacity-30: rgba(66, 133, 244, 0.3);
+        --google-blue-500-opacity-15: rgba(66, 133, 244, 0.15);
         background-color: var(--text-or-bg-color);
         border: none;
         color: white;