Re: [css3-images] simplifying radial gradients - Lea Verou gallery

On Oct 7, 2011, at 4:01 PM, Brian Manthos <brianman@microsoft.com> wrote:

> Note that this is just for the top-level page.  I didn't dig deeper by clicking on anything.
> 
> -----Original Message-----
> From: Brian Manthos 
> Sent: Friday, October 07, 2011 4:00 PM
> To: Sylvain Galineau; Alan Gresley
> Cc: L. David Baron; Brad Kemper; www-style@w3.org
> Subject: RE: [css3-images] simplifying radial gradients - Lea Verou gallery
> 
> Sylvain:
>> Lea Verou's pattern gallery: http://leaverou.me/css3patterns/#
> 
> Quick and dirty pass...

I did a some closer analysis of those patterns earlier, before I sent in that long proposal, and here is what I found with regard to radial "gradients" (I didn't record how many had 100% color stops ending at the farthest corners, but as I recall, most did not):

Using Radial Values:
Starry Night: default (color stops only)
Marrakesh: default (color stops only)
Rainbow bokeh: default (color stops only)
Carbon fibre: default (color stops only)
Polka dot: default (color stops only)
Cross: uses 'circle', but it's not needed and is identical without it
Waves: uses offsets and 'circle' *** relies on clipping of the circle within the tile **
Seigaiha: uses offsets and 'circle' *** relies on clipping of the circle within the tile **
Yin Yang: uses offsets and 'circle' *** relies on clipping of the circle within the tile **
Hearts: uses offsets and 'closest-side' and 'circle', but would have been simpler using background-repeat instead
Brady Bunch: uses 'closest side', but could have just used different percentages or fixed lengths without that (background-size was set anyway)
Shippo: uses 'closest side', but could have just used different percentages or fixed lengths without that (background-size was set anyway)