Bug 1706479 - Simplify page action style rules. r=desktop-theme-reviewers,dao

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

browser/base/content/browser-pageActions.js

@@ -533,7 +533,7 @@ var BrowserPageActions = {
 
   _makeUrlbarButtonNode(action) {
     let buttonNode = document.createXULElement("hbox");
-    buttonNode.classList.add("urlbar-icon-wrapper", "urlbar-page-action");
+    buttonNode.classList.add("urlbar-page-action");
     if (action.extensionID) {
       buttonNode.classList.add("urlbar-addon-page-action");
     }

browser/base/content/navigator-toolbox.inc.xhtml

@@ -336,7 +336,7 @@
                 </hbox>
                 <hbox id="cfr-button"
                       role="presentation"
-                      class="urlbar-page-action urlbar-icon-wrapper">
+                      class="urlbar-page-action">
                   <image class="urlbar-icon"/>
                 </hbox>
               </hbox>
@@ -345,7 +345,7 @@
                 <image id="userContext-indicator"/>
               </hbox>
               <hbox id="reader-mode-button"
-                    class="urlbar-page-action urlbar-icon-wrapper"
+                    class="urlbar-page-action"
                     role="button"
                     hidden="true"
                     tooltip="dynamic-shortcut-tooltip"
@@ -358,7 +358,7 @@
                      tooltip="dynamic-shortcut-tooltip"
                      hidden="true"/>
               <hbox id="pageActionButton"
-                    class="urlbar-page-action urlbar-icon-wrapper"
+                    class="urlbar-page-action"
                     role="button"
                     data-l10n-id="urlbar-page-action-button"
                     onmousedown="BrowserPageActions.mainButtonClicked(event);"
@@ -368,7 +368,7 @@
               <hbox id="star-button-box"
                     hidden="true"
                     role="button"
-                    class="urlbar-page-action urlbar-icon-wrapper"
+                    class="urlbar-page-action"
                     onclick="BrowserPageActions.doCommandForAction(PageActions.actionForID('bookmark'), event, this);">
                 <image id="star-button"
                        class="urlbar-icon"/>

browser/themes/shared/urlbar-searchbar.inc.css

@@ -407,38 +407,35 @@
 }
 
 .urlbar-icon {
-  width: calc(var(--urlbar-min-height) - 2px /* border */ - 2 * var(--urlbar-container-padding));
-  height: calc(var(--urlbar-min-height) - 2px /* border */ - 2 * var(--urlbar-container-padding));
-  padding: var(--urlbar-icon-padding);
+  width: 16px;
+  height: 16px;
   -moz-context-properties: fill, fill-opacity;
   fill: currentColor;
   fill-opacity: var(--urlbar-icon-fill-opacity);
+}
+
+.urlbar-page-action {
+  width: calc(var(--urlbar-min-height) - 2px /* border */ - 2 * var(--urlbar-container-padding));
+  height: calc(var(--urlbar-min-height) - 2px /* border */ - 2 * var(--urlbar-container-padding));
+  border-radius: var(--urlbar-icon-border-radius);
+  padding: var(--urlbar-icon-padding);
   color: inherit;
 }
 
-.urlbar-icon,
-.urlbar-icon-wrapper {
-  border-radius: var(--urlbar-icon-border-radius);
-}
-
-:root[uidensity=compact] .urlbar-icon {
+:root[uidensity=compact] .urlbar-page-action {
   margin-inline: 1px;
 }
 
-:not(.urlbar-icon-wrapper) > .urlbar-icon:not([disabled]):hover,
-.urlbar-icon-wrapper:not([disabled]):hover {
+.urlbar-page-action:not([disabled]):hover {
   background-color: hsla(0,0%,70%,.2);
 }
 
-:not(.urlbar-icon-wrapper) > .urlbar-icon:not([disabled])[open],
-:not(.urlbar-icon-wrapper) > .urlbar-icon:not([disabled]):hover:active,
-.urlbar-icon-wrapper:not([disabled])[open],
-.urlbar-icon-wrapper:not([disabled]):hover:active {
+.urlbar-page-action:not([disabled])[open],
+.urlbar-page-action:not([disabled]):hover:active {
   background-color: hsla(0,0%,70%,.3);
 }
 
-.urlbar-icon:-moz-focusring,
-.urlbar-icon-wrapper:-moz-focusring {
+.urlbar-page-action:-moz-focusring {
   outline: var(--toolbarbutton-focus-outline);
   outline-offset: -2px;
 }