BS4 Alpha 6 header items incorrect order

[luciuschoi]

ekko-lightbox.min.css and ekko-lightbox.min.css.map files are not minified with updated ekko-lightbox.css file for BS4 alpha 6.

[luciuschoi]

After updating BS 4 alpha 6,

Uncaught TypeError: this._$modal.data(...).handleUpdate is not a function at d.value (ekko-lightbox.js:574) at HTMLImageElement.e.onload (ekko-lightbox.js:520)

[ashleydw]

They are minified?

https://github.com/ashleydw/lightbox/blob/fae581a3a160c77cc8b12b3c1ce8ecc377f4961f/dist/ekko-lightbox.min.css

https://github.com/ashleydw/lightbox/blob/fae581a3a160c77cc8b12b3c1ce8ecc377f4961f/dist/ekko-lightbox.min.js

Post an example page with your problem.

[luciuschoi]

It doesn't work when I open index.html file in the example directory after cloning this repo

Bug resolved myself. => After debugging, I finally recognized that my '.show' class was conflicted with '.show' class of Bootstrap 4 alpha 6 version. And so, after renaming my '.show' class to '.show-action', it works well.

[ashleydw]

The example works fine: https://rawgit.com/ashleydw/lightbox/master/examples/index.html

[luciuschoi]

I don't known why it doesn't work on cloning this repo. But, Just above example shows text to be aligned right side and so it need to be updated to be aligned to left side.

[luciuschoi]

The alignment of items in flexbox mode will be controlled with flex-direction but I don't know how to fix the modal form of Bootstrap 4.

[luciuschoi]

In ekko-lightbox.js file, replace the header variable with the following value: (exchange <button> and <h4> tag with each other)

var header = '<div class="modal-header"' + (this._config.title || this._config.alwaysShowClose ? '' : ' style="display:none"') + '><h4 class="modal-title">' + (this._config.title || "&nbsp;") + '</h4><button type="button" class="close" data-dismiss="modal" aria-label="' + this._config.strings.close + '"><span aria-hidden="true">&times;</span></button></div>';

And update styles as the following:

.modal-title {
  line-height: 1.2em;
}
.modal-footer {
  justify-content: unset;
}

[fizzvr]

@luciuschoi nice debug, but now we need to do a Pull Request to fix these changes. I'll do.

Proper aligment