Re: [css3-images] Summary of recent gradient issues

On Wed, Jun 15, 2011 at 00:03, Brad Kemper <brad.kemper@gmail.com> wrote:

>  6. Reverse the meaning of the keywords, but change the syntax slightly
> ("to upper-right" or some such, instead of just "right"), to avoid
> collisions with existing style sheets, and to make the meaning more clear
> (avoiding confusion among those of us who think starting with the starting
> edge is a natural interpretation).
>

As a variation that hasn't been suggested yet (I don't think, though it's
close to a few suggestions that have been made), how about this syntax?
<linear-gradient> = linear-gradient(
[
    <angle>
    |
    [ top | bottom | left | right [to [ top | bottom | left | right] ]? ]
    , <color-stop>[, <color-stop>]+
);

If the "[to [top | bottom | left | right ] ]" portion is left out, the
parser must parse it as given in each of these cases:
top: top to bottom
bottom: bottom to top
left: left to right
right: right to left

Corner-to-corner gradients can be made by specifying "top to right" (which
is equivalent to "left to bottom") and so on.

In this syntax, it is made explicit that the single keyword is a shorthand
for the whole thing. Then, if the author is inclined to use keywords but
can't remember which direction a keyword represents, the author has the
option to make their direction explicit by specifying the start and end
point with keywords. (Also in this syntax, the use of an angle or keyword
bit is no longer optional.)

For reference, here is the current syntax:
# <linear-gradient> = linear-gradient(
# [
#     [ [top | bottom] || [left | right] ]
#     |
#     <angle>
# ,]?
# <color-stop>[, <color-stop>]+
# );

Eli Morris-Heft