Bug 1525193 - HTML ghost button styles r=dao

Differential Revision: https://phabricator.services.mozilla.com/D21295

--HG--
extra : moz-landing-system : lando

toolkit/mozapps/extensions/content/aboutaddons.html

@@ -21,7 +21,7 @@
           <span class="addon-description"></span>
         </div>
         <div class="more-options-menu">
-          <button action="more-options"></button>
+          <button class="ghost-button" action="more-options"></button>
           <panel-list>
             <panel-item action="toggle-disabled"></panel-item>
             <panel-item data-l10n-id="remove-addon-button" action="remove"></panel-item>

toolkit/themes/shared/in-content/common.inc.css

@@ -278,6 +278,18 @@ xul|button.primary:not([disabled="true"]):hover:active {
   background-color: var(--in-content-primary-button-background-active);
 }
 
+html|button.ghost-button {
+  background-color: transparent;
+}
+
+html|button.ghost-button:enabled:hover {
+  background-color: var(--in-content-button-background);
+}
+
+html|button.ghost-button:enabled:hover:active {
+  background-color: var(--in-content-button-background-hover);
+}
+
 html|input[type="color"] {
   padding: 6px;
   width: 50px;