Modal 1.1 - Use flex instead of transform to centre modal body

Back to changelog

Before this change, the modal body was centred using a combination of position: absolute; and tranform: translate();. However, this has an issue in that it could translate the modal body by a partial pixel, causing it to become blurry.

To account for this, Modal would resize the body by reading its current size, then rounding it up to the nearest 2px so that translating it by half its height and half its width would always translate it by an integer number of pixels.

Now, this approach is no longer used and instead display: flex; is used to centre the modal body.

Breaking changes

  • Flex layout is now used instead of 2D transforms and JavaScript resizing in order to centre the modal body. In order to update to version 1.10, the CSS for Modal must also be updated.

Non-breaking changes

  • None