fixup! Bug 21952: Implement Onion-Location

Bug 41608 - Use the same styling for ".onion available" urlbar button as
the tor-connect-urlbar-button. This also stops the button from
overflowing its container like before. Also move to after the bookmark
button.

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

@@ -363,9 +363,6 @@
                      onclick="FullZoom.reset(); FullZoom.resetScalingZoom();"
                      tooltip="dynamic-shortcut-tooltip"
                      hidden="true"/>
-
-#include ../../components/onionservices/content/onionlocation-urlbar.inc.xhtml
-
               <hbox id="pageActionButton"
                     class="urlbar-page-action"
                     role="button"
@@ -383,6 +380,8 @@
                        class="urlbar-icon"/>
               </hbox>
             </hbox>
+
+#include ../../components/onionservices/content/onionlocation-urlbar.inc.xhtml
           </hbox>
         </hbox>
         <toolbartabstop/>

browser/components/onionservices/content/onionlocation-urlbar.inc.xhtml

 # Copyright (c) 2020, The Tor Project, Inc.
 
 <hbox id="onion-location-box"
-      class="urlbar-icon-wrapper urlbar-page-action"
+      class="tor-urlbar-button"
       role="button"
       hidden="true"
       onclick="OnionLocationParent.buttonClick(event);">
   <image id="onion-location-button" role="presentation"/>
-  <hbox id="onion-label-container"><label id="onion-label"/></hbox>
+  <label id="onion-label"/>
 </hbox>

browser/components/onionservices/content/onionlocation.css

 /* Copyright (c) 2020, The Tor Project, Inc. */
 
-#onion-location-box {
-  background-color: var(--purple-60);
-  -moz-context-properties: fill;
-  fill: white;
-}
-
-#onion-location-box:hover {
-  background-color: var(--purple-70);
-}
-
-#onion-location-box:active {
-  background-color: var(--purple-80);
-}
-
-@media (prefers-color-scheme: dark) {
-  #onion-location-box {
-    background-color: var(--purple-50);
-  }
-
-  #onion-location-box:hover {
-    background-color: var(--purple-60);
-  }
-
-  #onion-location-box:active {
-    background-color: var(--purple-70);
-  }
-}
-
 #onion-location-button {
   list-style-image: url(chrome://browser/content/onionservices/onionlocation.svg);
-  padding-inline-start: 0.5em;
-}
-
-label#onion-label {
-  margin: 0;
-  padding-block: 0;
-  padding-inline: 0.5em;
-  color: white;
-  font-weight: normal;
+  -moz-context-properties: fill;
+  fill: currentColor;
 }
 
 .onionlocation-notification-icon {