Alternative Sage Toolbar Icon

My previous modifications to the Firefox Toolbar have one problem. Certain extensions’ toolbar icons become borked. This is due to forcing a css priority, unintentionally overriding css rules for these icons.

The fix is simple, the following rules just need to be re-applied in userChrome.css, after the rules for the main toolbar:

 #sage-button {
      list-style-image: url("chrome://sage/skin/sage.png") !important;
    }
    toolbar[iconsize="small"] #sage-button {
      list-style-image: url("chrome://sage/skin/sage-small.png") !important;
    }

So, while I was at it, I created a new toolbar icon for Sage, based on the new RSS Live Bookmarks icon:

Screenshot of the Sage Icon

I’ve revised the Sage mod kit to include the new icon, which you can download here and add this to your userChrome.css instead:

#sage-button {
      list-style-image: url("sage.png") !important;
    }
    toolbar[iconsize="small"] #sage-button {
      list-style-image: url("sage-small.png") !important;
    }