Add blur to what's under section panes

[jiku]

To make stuff easier to read. On hold for now (due to lack of client support and negative impact on performance).
Local branch: feature-blur-section-panes-issue-79

https://www.google.no/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=css%20blur%20background

backdrop-filter

Supposed, but doesn't seem to work in Safari 9.0.1 / OSX 10.10.5.

From this

can be used on top of [...] WebGL, and other dynamic content.

Poorly supported.
Can use Modernizr to detect support.

You can fake it with element() or SVG filters (see SVG below).

http://iamvdo.me/en/blog/advanced-css-filters
https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter
http://www.domneill.com/blog/posts/2015/07/28/my-favourite-new-features-in-webkit-and-safari/

CSS3 filters

Experiencing the same... i.e. section panes and content are blurred, while background isn't.

Seems well supported.
http://jordanhollinger.com/2014/01/29/css-gaussian-blur-behind-a-translucent-box/ (approach can't be easily used... duplicates and blurs a static background image)
https://css-tricks.com/frosting-glass-css-filters/ (same)

CSS-Filters Polyfill

PIXI, Two or THREE for section panes

Could be useful... not sure in practice.

SVG

Not sure it improves on CSS3 filters, or anything else... Seems often static. Cold be dynamic but there are performance costs?

http://stackoverflow.com/questions/14971288/div-disappears-after-applying-svg-gaussian-blur/30234445#30234445

blur.js

Deprecated?

Other/unsure (JS?)

http://codepen.io/rikschennink/pen/zvcgx
http://jsfiddle.net/jhiggins/MqvdQ/10/
https://www.reddit.com/r/webdev/comments/1myjfh/proof_of_concept_ios7like_gaussian_blur_sticky/ccdud34

http://codepen.io/anthonyadamski/pen/yJBpd

http://codepen.io/Kseso/pen/JBrcD (Great windows, seems underperformant?)