search

danielepiccone / ng-pageslide

AngularJS sliding panel for serving additional content from off the page
http://danielepiccone.github.io/ng-pageslide/examples/
452 stars 162 forks source link

Fixes issue where when using Bootstrap Modals, multiple ng-pageslide… #149

Closed genaro-picazo closed 7 years ago

genaro-picazo commented 7 years ago

…-body-[open|closed] classes are added to the body.

genaro-picazo commented 7 years ago

@dpiccone - Can you please check out this pull request? The issue it solves is that when using the ng-pageslide directive in an application that also uses the bootstrap modals (ui-bootstrap), multiple ng-pageslide-body-[closed|open] tags are added to the body as soon as a modal is opened.

Assuming the pageslide panel was closed when the modal was launched, the body class looked like: " ng-pageslide-body-closed" before opening it, after opening it, it looks like: "ng-pageslide-body-open ng-pageslide-body-closed" and after closing the modal, it looks like: "ng-pageslide-body-closed ng-pageslide-body-closed". Note that the first ng-pageslide-body- class name does not have a space character before it. Thus, toggling the pageslide panel afterwards does not affect the first class name, only the second one. That means that the overlay (using the CSS :before selector) no longer works since when the panel is opened, you now have a -open and a *-closed class on the body. Easily reproducible on multiple applications that I tried.

danielepiccone commented 7 years ago

Thanks for this, I added another fix to prevent adding unnecessary spaces to body.className :+1: