Bug 697750 - Follow-up: replace about:home sync "links" (actually buttons) with links. r=gavin.sharp

browser/base/content/aboutHome.css

@@ -373,25 +373,8 @@ body[dir=rtl] #restorePreviousSession::before {
   padding-top: 1em;
 }
 
-/* Hack to make buttons appear as links. Necessary to piggyback on browser.js
- * OnBrowserClick listener, which checks that click originates from a button.
- */
 .sync-link {
-  -moz-appearance: none;
-  outline: none;
-  border: none;
-  color: -moz-hyperlinktext;
-  background-color: transparent;
-}
-
-.sync-link:hover {
-  color: -moz-activehyperlinktext;
-  text-decoration: underline;
-  cursor: pointer;
-}
-
-.sync-link:active {
-  padding: 0px 6px 0px 6px;
+  padding: 1em;
 }
 
 @media all and (max-height: 370px) {

browser/base/content/aboutHome.xhtml

@@ -103,8 +103,8 @@
         <a href="http://www.mozilla.com/about/">&abouthome.aboutMozilla;</a>
       </div>
       <div id="syncLinksContainer">
-        <button class="sync-link" id="setupSyncLink">&abouthome.syncSetup.label;</button>
-        <button class="sync-link" id="pairDeviceLink">&abouthome.pairDevice.label;</button>
+        <a href="javascript:void(0);" class="sync-link" id="setupSyncLink">&abouthome.syncSetup.label;</a>
+        <a href="javascript:void(0);" class="sync-link" id="pairDeviceLink">&abouthome.pairDevice.label;</a>
       </div>
     </div>
   </body>

browser/base/content/browser.js

@@ -2687,7 +2687,9 @@ function BrowserOnAboutPageLoad(document) {
  */
 function BrowserOnClick(event) {
     // Don't trust synthetic events
-    if (!event.isTrusted || event.target.localName != "button")
+    if (!event.isTrusted ||
+        (event.target.localName != "button" &&
+         event.target.className != "sync-link"))
       return;
 
     var ot = event.originalTarget;