control the look (such as size) of core-menu-button (related to use of /deep/)

[Diana Perpignan]

Hi All,

Before the big upgrade of Polymer of last week or so, I had everything working with my test project. Then, I got the new version of Polymer, all my problems began.

I am using core-menu-button and core-item to create a drop-down menu. It works functionally. However, I found all those layers of shadow root underneath 

core-menu-button, I cannot control the size of the icon for core-menu-button, because the size is styled in svg under core-icon, which is a shadow dom under core-icon-button, which is a shadow dom under core-menu-button.

So I tried using /deep/ in the styling css of the same level as my custom element, which contains core-menu-button:

core-menu-button /deep/ core-icon {

  width: 14px;

  height: 14px;

  size: 14px;

}

Of course, it doesn't work. I am using Chrome Version 35.0.1916.153.

Anybody has any idea how to style elements deep embedded in Polymer elements?

Thanks

Diana

[Steve Orvell]

This is harder than it should be. I'm going to take a look at fixing it as soon as I get a chance. Here's an issue to help track it, feel free to post feedback there: https://github.com/Polymer/core-icon/issues/8

Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/ea40c943-69c7-4257-8862-20e05ae6576d%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.