jQuery Forum

Would it be possible to add multi-classing support when scoping themes? For example, I have a default theme which is light-blue, then I create a "green" theme for buttons on the site with a scope of ".green".  When the ThemeRoller creates the green theme the css is generated as such:

.green .ui-widget { ... }
.green .ui-button { ... }
.green .ui-button .ui-button-text { ... }
etc...

Now the problem with this is that I now have to add extra wrapping around elements in order to theme them. Instead of simply doing: <button class="green ui-widget ui-button ...">
I now have to do:  <div class="green"><button class="ui-widget ui-button ..."></div>

If the ThemeRoller would output the scoped css as follows, this could be eliminated and provide support for either technique:

.green .ui-widget, .green.ui-widget { ... }
.green .ui-button, .green.ui-button  { ... }
etc...

Now granted I currently have modified the buttoncreate event to to detect my theme and wrap the element but I still do not feel as though this is ideal:

<button data-theme="green">My Green Button</button>
$('body').bind('buttoncreate',function(e,ui){
            var $self = $(e.target);
            var theme = $self.data('theme');
            if (!$.isEmpty(theme)) {
                $self.wrap('<span class="'+theme+'" />');
            }
});


Thanks,
Jason