Expected: Ripples canvas should be square
Actual: Ripples canvas is rectangular
If Ripples is disabled, the background image is square, and rendered as a square as a result of background-size:contain. However, the Ripples canvas is sized to the full geometry of its parent element.
I quickly hacked my own version of Ripples that forces the canvas to be a correctly positioned square during initialization and updateSize(), but it would be nice to have a general fix.
Live demo: https://ripples-bug.glitch.me/ (Resize so window is much wider than tall)
Expected: Ripples canvas should be square Actual: Ripples canvas is rectangular
If Ripples is disabled, the background image is square, and rendered as a square as a result of
background-size:contain.
However, the Ripples canvas is sized to the full geometry of its parent element.(Is this the "TODO: background-clip" from the source?)
I quickly hacked my own version of Ripples that forces the canvas to be a correctly positioned square during initialization and
updateSize()
, but it would be nice to have a general fix.