Re: [css-shapes] Functional Notation

On Tue, Oct 8, 2013 at 3:58 AM, Alan Stearns <stearns@adobe.com> wrote:
> Well, it's not *exactly* like margins, since margins don't define rounded
> corners. If we're not requiring all four values, then we're back to
> minting a keyword to separate the rounded corner values:
>
> inset-rect( <shape-arg>{1,4} [ round <shape-arg>{1,2} ]? )
>
> In which case we should have the same keyword in rectangle():
>
> rectangle( <shape-arg>{4,4} [ round <shape-arg>{1,2} ]? )

This seems really good to me, actually.  I do now prefer rectangle()
to stay close to SVG, in anticipation of another function that uses a
radial-gradient()-like syntax, but I like inset-rect() in this form,
and I agree with both the disambiguation and parallel structure
arguments.  Plus, I simply like having the extension point for
corner-shape built in right away.

This still makes me think that we should just use border-radius
shorthand for the corner sizes, though.  That would mean a / between
the two numbers if you want to specify both rx and ry, but that's
easy.  The grammar would just be:

inset-rect( <shape-arg>{1,4} [ round <'border-radius'> ]? )
rect( <shape-arg>{4,4} [ round <'border-radius'> ]? )

I know, SVG doesn't have this, but I've been bitten by that lack
before, when wanting to do certain types of rounded corners that CSS
can do, and had to fall back to a much less readable <path> instead.

~TJ

Received on Tuesday, 8 October 2013 16:38:24 UTC