Just had to track down a bug causing pages to break in our new docs. Page was working in Chrome, but breaking on iOS and there was a performance impact on Safari. The css was the following (for a footer with a corner gradient) ```css .footer { background-color: $color-black; position: relative; overflow: hidden; z-index: 0; &:after { content: ''; position: absolute; right: -900px; bottom: -1100px; width: 1290px; height: 1100px; background: $gradient-conic-blue-to-red; filter: blur(300px); transform: matrix(-0.09, 1, -1, -0.09, 0, 0); z-index: -1; } } ``` The issue stemmed from our designer creating the gradient using a transformed coloured square with `blur(300px)` applied. I was able to fix this by creating the gradient in a normal way with `background-image`, but I don't think that having a blur of 300px should cause such a performance issue that the page breaks entirely, especially since it works smoothly in chrome.
<rdar://problem/81273896>