Proposal: Advanced XUL CSS Selectors

[aspr1n]

There may be an equally easy way of achieving this that I am unaware of, but my proposal is as follows:

A new set of "moz-" XML attributes are added to every XUL nsIDOMWindow:

moz-app="[application_guid]"
moz-version="[application_version]"
moz-current-theme="[theme_guid]"
moz-platform="win32/osx/linux"
moz-chrome-url="[registered_chrome_url_of_window]"

Now every theme can create selectors based on the above attributes in the window or page element thus:

Code: Select all

window[moz-platform="osx"] #myelem{
  padding-left: 10px;
  /* More OSX specific styles */
}

or:

Code: Select all

page[moz-current-theme="9f08cb5a-76b1-4bcf-aff9-90e1a5d60b1e"] { /* Noia Theme GUID */
  padding-left: 10px;
  /* More Noia theme specific styles */
}

Comments??

asp

[cheeaun]

I'm not very sure but what is the purpose of doing this? From what I see, this can be done with some XBL binding, to add those attributes.

[Sailfish]

I already do the theme identification part with all my themes using an overlay, as follows:

global/global.css

Code: Select all

/* ::::: XBL bindings ::::: */

/* Added on 20030120 (along with SPCwindowOverlay.xml) to
* uniquely identify the theme in the top-level window.
*/
window {
  -moz-binding: url("chrome://global/skin/SPCwindowOverlay.xml#theme");
}

and

global/SPCwindowOverlay.xml

Code: Select all

<?xml version="1.0"?>

<bindings id="windowBindings"
   xmlns="http://www.mozilla.org/xbl"
   xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
   xmlns:xbl="http://www.mozilla.org/xbl">

  <binding id="theme">
    <content themer="sailfish" theme="SPC" subskin="" />
  </binding>
 
</bindings>

The above is for Sky Pilot Classic so then a user can add theme-specific userChrome.css or userContent.css changes simply by prepending the following clause to their selector:

Code: Select all

window[theme="SPC"] someSelector {
  someStyle: Override !important;
}