vpusher / the-grid

Grid layout custom element with drag and drop capabilities
https://www.webcomponents.org/element/vpusher/the-grid
MIT License
129 stars 31 forks source link

Nesting inside another component doesn't work #2

Closed bkjohnson closed 7 years ago

bkjohnson commented 7 years ago

I've started building an Electron + Polymer app and the tile elements inside the grid don't appear to work if the grid is nested inside another component.

Here the-grid works as expected, and you can see that the proper classes are applied to the div.

image

But when it is nested inside my-app the tile divs don't have the proper styles applied.

screenshot from 2017-04-08 09-48-44

I added a console.log(style.textContext) here and the styles are definitely there so I'm not sure why they aren't being applied.

It may not be obvious from the screenshots, but if I drag a tile the placeholder doesn't update behind it either, it just stays in the top left.

I'd be happy to submit a PR if I could tell what was causing this, but this is my first time using Polymer 2.0 (I've been using 1.x for a long time) and so I just don't really know why this is happening. Any help would be appreciated.

vpusher commented 7 years ago

@bkjohnson yes, the generated stylesheet is applied for grid used as light dom because local dom can't be styled from the document (i.e. outside of the component itself). I will have a look into this. Thank you for you feedback and your PR.