Reputation: 1377
I seem to be missing something when it comes to applying themes to my polymer app. I started with a theme.css from polymerthemes.com and a test app. All worked well.
Then I started breaking it up into separate polymer elements and brining in some of my existing elements (built from paper and core elements). The styling stopped working as it hit the shadow dom boundary.
To fix it, I put body /deep/
in front of every style in themes.css!!
Works but I can't imagine that is the way this is supposed to work.
I had a look at core-style
and that looks like exactly what is needed, but none of the core and paper elements seem to use it. Am I missing something or is this still very much a work in progress?
It would be great if we could get to a point where instead of downloading a theme.css and putting body /deep/
everywhere, that we could simply add a bower (or pub) dependency on a theme and it would work out of the box. Is this realistic?
Upvotes: 1
Views: 963
Reputation: 106
I'm part of the team behind polymerthemes.com.
Your solution should work fine, however we'll be releasing an update shortly with the default CSS download piercing all shadow boundaries.
Bower integration is coming too (it's been a highly requested feature), stay tuned.
EDIT: All themes on polymerthemes.com now pierce all shadow boundaries.
We've also added support for bower, basic usage:
bower install polymer-themes
or to add as a dependency to your app's bower.json file:
bower install --save polymer-themes
Upvotes: 2