While upgrading to 1.7
Jörn Zaefferer
was using the default theme, accordion was completely customized.
After updating jQuery to 1.3.2 and core and both plugins to 1.7 I was
stuck with the accordion default theme. The themeing approach we had
so far was way too different to adapt the base theme to it, so I had
to find a way to disable the base theme for the accordion.
I ended up with adding a CSS scope to the theme, namely #ui-container.
For the datepicker to keep working with the scoped CSS, I had to
modify its source to append the datepicker to that container-element -
by default, the datepicker is appended to body and there is no
parent-element I can use for scoping.
Just excluding ui.accordion.css doesn't help at all, as ui.core.css
and ui.theme.css still apply to the accordion - I can't ommit these
either, they are required for datepicker.
To make this less painful, a first step would be adding an
appendTo-option to the datepicker: http://dev.jqueryui.com/ticket/4306
What else can we do to make using themes more selective?
Jörn
Scott Jehl
Scoping a theme to any overlaid widget (dialog, datepicker) is pretty
difficult right now since they're appended to the end of the body.
I'm not sure what to suggest you do until we add the appendTo option.
Another option I think we should consider adding is the helper or
helperClass option.
Basically, this could be a class name that you pass to the dialog and
it would generate a static wrapper around the overlay, shadow, and
dialog widget, that has the class name you specified.
I guess the most straightforward approach for your case right now
would be to design a global theme that applies to your datepicker, and
then a more tightly scoped theme to apply to your accordion.
Jörn Zaefferer
> helperClass option.
> Basically, this could be a class name that you pass to the dialog and
> it would generate a static wrapper around the overlay, shadow, and
> dialog widget, that has the class name you specified.
appendTo makes more sense, as that can solve other problems as well.
> I guess the most straightforward approach for your case right now
> would be to design a global theme that applies to your datepicker, and
> then a more tightly scoped theme to apply to your accordion.
The problem I have: I don't want any UI CSS theme to apply to the
accordion at all. The base theme adds a ton of styles that are way too
much work to override in custom CSS.
Jörn
Paul Bakaus
appendTo makes more sense, as that can solve other problems as well.
> Another option I think we should consider adding is the helper or
> helperClass option.
> Basically, this could be a class name that you pass to the dialog and
> it would generate a static wrapper around the overlay, shadow, and
> dialog widget, that has the class name you specified.
I agree - an appendTo option is important in any plugin that appends nodes. Sometimes
you want to simulate an iframe with overflow hidden and a div.
The problem I have: I don't want any UI CSS theme to apply to the
> I guess the most straightforward approach for your case right now
> would be to design a global theme that applies to your datepicker, and
> then a more tightly scoped theme to apply to your accordion.
accordion at all. The base theme adds a ton of styles that are way too
much work to override in custom CSS.
Jörn
--
Paul Bakaus
UI Architect
--
http://paulbakaus.com
http://www.linkedin.com/in/paulbakaus
Richard D. Worth
In that case don't introduce a theme that's not scoped. Or perhaps you want to just include ui.accordion.css, but not ui.core.css and ui.theme.css?
- Richard
Jörn Zaefferer
>> accordion at all. The base theme adds a ton of styles that are way too
>> much work to override in custom CSS.
>
> In that case don't introduce a theme that's not scoped. Or perhaps you want
> to just include ui.accordion.css, but not ui.core.css and ui.theme.css?
Thats what I ended up with, and it got quite ugly as I can't specify a
scope for the datepicker when appended by default to body.
Jörn