PolymerElements / paper-icon-button

A Material Design icon button
https://www.webcomponents.org/element/PolymerElements/paper-icon-button
42 stars 44 forks source link

icons aren't visible when direct children of paper-dialog #120

Open davidmaxwaterman opened 6 years ago

davidmaxwaterman commented 6 years ago

Description

icons aren't rendered when direct children of paper-dialog

Related: https://stackoverflow.com/questions/41148666/paper-icon-button-doesnt-show-the-icon-when-located-inside-another-element/46033710#46033710

Expected outcome

I expect to see an icon button, but I see nothing unless I wrap it in a wrapper element.

Actual outcome

Seems like foreground colour is same as background colour, making it invisible.

Live Demo

https://jsbin.com/hehovisoso/edit?html,console,output

Steps to reproduce

Run jsbin

Browsers Affected

krumware commented 6 years ago

This looks to be due to padding being applied to slotted elements, which is affecting the icon size. A workaround is to override that padding: https://jsbin.com/korinawuca/1/edit?html,console,output