Unfortunately it is not that simple. I have now developed fixes for three themes and one extension, and they are all quite different, since each theme makes different assumptions and uses different values. In the end, someone has to install Fission over a specific theme and fiddle around until it looks the same with and without Fission.
The problem is that Fission applies a
differently structured XBL binding to the address bar (i.e. its parts are layed out and sometimes also called differently). You can see these differences when either comparing <a href="jar:jar:http://www.haslo.ch/zeniko/software/fission.xpi!/chrome/fission.jar!/content/fission/fission.xml">Fission's binding</a> and
Firefox' original.
Most notably there is an
additional stack which contains the background progress meter and everything except the drop-down button. This stack is usually styled as would otherwise be
#urlbar > .autocomplete-textbox-container > .textbox-input-box (as in the Noia case
above). All elements inside the stack must have transparent backgrounds, so that the progress bar remains visible (even behind the icons at the right).
While the background of the stack and .textbox-input-box is the same, the latter uses
padding for making the ending images visible, while the former must use
margins (as also in the example above). As a consequence, the proxy icon/favicon's position must be corrected, as well.
Most of these corrections can be applied in rules applying to either
#urlbar[fission] (Fission's binding in general) or
#urlbar[fission="fusion"] (Fusion-styled Fission in particular, as opposed to Icon-styled Fission which is
#urlbar[fission="icon"]). The
"fission" attribute is guaranteed to be set when Fission is active. Addional attributes of #urlbar related to Fission are "fission-link" (when a mouse-over link is displayed in the address bar) and "progress" (which contains an integer between 0 and 100 depending on the progress meter's state).
One trick for making development easier is to apply the following two rules. With these you can simply toggle the hidden pref
extensions.fission.iconize to switch between Fission's and Firefox' address bar binding:
Code: Select all
#urlbar:not([fission="fusion"]) {
-moz-binding: url(chrome://global/content/bindings/autocomplete.xml#autocomplete) !important;
} /* use Firefox' binding for Icon-style */
#statusbar-icon[value="100"], #statusbar-icon[value="0"] {
visibility: visible !important;
} /* don't hide the progress meter when it's not used */
Finally, for bonus points, you could try getting Icon-styled Fission look good, too (which consists mainly in setting top-/bottom-margins and removing unnecessary background-images).
Hope these explanations help to make it easier to adapt a theme for Fission...