[fxtf-drafts] filter() function would be improved with an optional margin (#398)

faceless2 has just created a new issue for https://github.com/w3c/fxtf-drafts:

== filter() function would be improved with an optional margin ==
The `filter()` function is really interesting - I've been playing with it for a couple of days now, in both Webkit and our own renderer.

Once issue I  have with it is that the filtered image remains the size of the input image. This is sensible, but means blur and drop-shadow can't really be applied easily - you have to pad the image file with transparent pixels first, otherwise the blur has a "hard edge" and the drop-shadow is clipped.

I think this functionality would be quite easy to add; currently we have

`filter( [ <image> | <string> ], <filter-value-list> )`

Can I suggest changing this to

`filter( [ <image> | <string> ] <length>{0,4}, <filter-value-list> )`

1, 2, 3 or 4 lengths would be parsed the same way they are for the `margin` property to pad the source image with transparent pixels before applying the filters - so `filter(url(frame.png) 20px)` would add 20px to each sides.

The use case is this sort of thing:

`border-image: filter(url(frame.png) 15px, drop-shadow(10px 10px 5px)) 100;`


Please view or discuss this issue at https://github.com/w3c/fxtf-drafts/issues/398 using your GitHub account

Received on Tuesday, 5 May 2020 18:22:09 UTC