W3C home > Mailing lists > Public > www-style@w3.org > October 2011

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

From: Brad Kemper <brad.kemper@gmail.com>
Date: Sat, 8 Oct 2011 01:18:53 -0700
Message-Id: <8E99DFFB-CA82-480F-AAE8-7C7658BD7BCA@gmail.com>
Cc: Sylvain Galineau <sylvaing@microsoft.com>, Alan Gresley <alan@css-class.com>, "L. David Baron" <dbaron@dbaron.org>, "www-style@w3.org" <www-style@w3.org>
To: Brian Manthos <brianman@microsoft.com>
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)
Received on Saturday, 8 October 2011 08:19:36 GMT

This archive was generated by hypermail 2.3.1 : Tuesday, 26 March 2013 17:20:45 GMT