kutlugsahin / ngx-smooth-dnd

angular wrapper for smooth-dnd
165 stars 30 forks source link

Horizontal layout not expanding width before drop #16

Closed danielcarlstrom closed 6 years ago

danielcarlstrom commented 6 years ago

Hi,

First:

Thanks for a great tool!

Now, I'm trying to build a horizontal layout with groups where you can drop in between groups. I'm not sure on how to make the group container expand when being hovered with an item.

If I use vertical, the height is altered, but not when it's horizontal.

Please see this simple, not fully working, example. It shows the flaw. https://stackblitz.com/edit/angular-mqyve9

It's probably something I've missed but would be happy for some guidance.

Thanks,

danielcarlstrom commented 6 years ago

Okay I think I found it, the placeholder element that is inserted into the container when hovering with a droppable item needs to be inline-block, then it works, so I added this to css:

::ng-deep.smooth-dnd-stretcher-element.horizontal {
  display: inline-block;
}

Edit: re-opened for bug-fix.

kutlugsahin commented 6 years ago

Hey @danielcarlstrom. Thanks for submitting the issue. I applied your solution. Thanks to you it is fixed at version 0.2.5 :) Cheers!!