Opened 11 years ago

Closed 10 years ago

#8095 closed bug (notabug)

ThemeRoller - CSS Scope

Reported by: troberts Owned by: troberts
Priority: minor Milestone: 1.9.0
Component: [meta] ui.themeroller Version: 1.8.17
Keywords: Cc:
Blocked by: Blocking:


If I use download a theme with specifying a CSS Scope (under advanced theme settings), the css scope is applied to everything BUT a few items under ui.button. Example - download the 'start' theme and apply ".start" as the css scope - the resulting jquery-ui-1.8.17.custom.css file has:

.start .ui-button { display: inline-block; ...
.start .ui-button-icon-only { width: 2.2em; }
button.ui-button-icon-only { width: 2.4em; } <-- CSS SCOPE NOT APPLIED
.start .ui-button-icons-only { width: 3.4em; } 
button.ui-button-icons-only { width: 3.7em; } <-- CSS SCOPE NOT APPLIED

/*button text element */
.start .ui-button .ui-button-text ...
.start .ui-button-text-only .ui-but...
.start .ui-button-icon-only .ui-but...
.start .ui-button-text-icon-primary...
.start .ui-button-text-icon-seconda...
.start .ui-button-text-icons .ui-bu...
/* no icon support for input elements...
input.ui-button { padding: .4em 1em; }  <-- CSS SCOPE NOT APPLIED

Without the scope and using MULTIPLE themes in an application get's buttons that are 'confused' to what theme they should render

Change History (5)

comment:1 Changed 11 years ago by Scott González

Component: ui.button[meta] ui.themeroller
Owner: set to jquery-infrastructure

comment:2 Changed 10 years ago by Scott González

Owner: changed from jquery-infrastructure to troberts
Status: newpending

It seems strange to me that the widget-specific rules would need to be scoped anyway. The only thing that changes between themes are the rules in jquery.ui.theme.css. What problem is this causing?

comment:3 in reply to:  2 Changed 10 years ago by troberts

Status: pendingnew

I have an application that has a main page with jquery ui tabs on a page (using my 'default' theme [ie no CSS scope]). The tab panels each have their own assigned theme (a visual cue to our users). Without the CSS scope, the themeing of the buttons on those tab panels are inconsistent with the theme we assigned to the panel. Not sure if I explained that correctly - but that's what's happening.

comment:4 Changed 10 years ago by Scott González

Status: newpending

I still don't understand why that happens, as the lines you pointed to aren't affected by the theme settings. You should have exactly the same rules in both cases. Can you provide a reduced test case showing the problem?

comment:5 Changed 10 years ago by Scott González

Resolution: invalid
Status: pendingclosed

I'm closing this until we can get a reduced test case showing a problem. If you're able to provide a reduced test case showing the error, please file a new issue at

Note: See TracTickets for help on using tickets.