rc1: data-content-theme not working AND data-theme on page not cascading to header & footer #2655

Closed
rbdcti opened this Issue Oct 10, 2011 · 8 comments

Comments

Projects
None yet
5 participants
Contributor

rbdcti commented Oct 10, 2011

Several theme issues I ran into. Hopefully I'm not being stupid here, but I've pared it down to the most basic example and the problems still persist.

See http://jsfiddle.net/aNJPS/ for my use-case. Tried with rc1 and latest (if there is a difference)...

At least for me, the page looks like: http://dl.dropbox.com/u/9719672/jquerymobile-issue.png

Looks like that in Firefox 7, newest Chrome and iPhone 4.

As a "fix" I can manually apply data-theme to the header and footer, but it still doesn't fix the content issue. Need a jquery hack for that to remove that theme class from the content block...

gseguin was assigned Oct 10, 2011

Contributor

MauriceG commented Oct 10, 2011

The docs at http://jquerymobile.com/test/docs/toolbars/docs-headers.html says at Default header features:
The header toolbar is themed with the "a" swatch by default (black in the default theme) but you can easily set the theme swatch color.

Contributor

rbdcti commented Oct 10, 2011

Yes, but according to #282 the data-theme specified on the page level should cascade, no?

Contributor

toddparker commented Oct 10, 2011

I think this feature may have been lost with the decoupling a while back. We'll have to look into re-adding this but it would have to be post-1.0. At least it's easy to add that attribute to your header.

Contributor

rbdcti commented Oct 10, 2011

Todd: yup. But the removing of the ui-body- class from the content pane is a bit more hackish:

For reference of other folks, the line I'm using is:
$("[data-role='content']").removeClass(function (index, css) { return (css.match (/\bui-body-\S+/g) || []).join(' '); });

Contributor

MauriceG commented Oct 10, 2011

May i have lost the context know, because the jumps between header/footer bars and content inheritance.
But what the code above shall do? Remove the the ui-body-x class from the content?

Contributor

rbdcti commented Oct 11, 2011

Maurice: Yeah...I was having the issue where a ui-body-x class was being added to the content div...thus you'd get a gradient overlap. That line I posted dynamically removes that css class and fixes it for me.

Member

agcolom commented Mar 10, 2012

@toddparker I believe we can close this one. We have made it clear in the docs that headers and footers do not inherit theme from the page, therefore I believe this is a feature and not a bug.

Contributor

toddparker commented Mar 12, 2012

Right, this is working as designed so closing.

toddparker closed this Mar 12, 2012

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment