[whatwg] Request: Canvas Tag CSS

1. The CSS would not validate.

2. Developers exchange code on the web, via tutorials, snippets,
templates and so forth. If there is no standard, then one developer
may write a CSS rule for Canvas like:

.myButton {
      fillStyle: LinearGradient(0,0,0,30) ColorStop(0, '#00ABEB')
ColorStop(0.5, '#fff');
      lineWidth: 1;
      shadowColor: #000;
      shadowBlur: 5;
      fillRect: 0, 0, 100, 30;

.myButtonHighlight {
      fillStyle: rgba(255, 255, 255 , 0.5);
      fillRect: 2, 2, 96, 13;

And another may write something like:

.myButton {
      fill-style: linearGradient(0,0,0,30) colorStops(0, '#00ABEB',
0.5, '#fff');
      line-width: 1;
      shadow-color: #000;
      shadow-blur: 5;
      fill-rect: 0, 0, 100, 30;

.myButtonHighlight {
      fill-style: rgba(255, 255, 255 , 0.5);
      fill-rect: 2, 2, 96, 13;

Each developer has to re-invent the wheel, adding extra complexity to
their code, where it could be done once in a standard and exchangeable
way by the UA.

3. Someone makes a template for an application. A designer then wishes
to theme it. Looking at the CSS, the designer see all these CSS rules
they are unfamiliar with. They think, okay, I will go to W3C and see
what they are, but then they find nothing. Then they think, I'll do a
search on the web, but then find nothing.

Why add rounded corners to the CSS specification? You can do the same
thing with images. Why add any new feature to a specification? To make
it easier, more intuitive, and standard.

- Greg

On Sun, Apr 6, 2008 at 10:10 AM, Anne van Kesteren <annevk at opera.com> wrote:
> On Sun, 06 Apr 2008 10:49:01 +0200, Greg Houston <gregory.houston at gmail.com>
> wrote:
> > Having worked with the canvas tag quite a bit now, I've found that it
> > is a bit awkward that the canvas tag is not taking advantage of CSS.
> > If you are changing your site design, perhaps you want to change the
> > colors used in your line graphs as well. So you make the changes in
> > your CSS for the majority of your elements, which is rather painless,
> > and then for the canvas tag you then have to start digging through the
> > JavaScript to make your changes.
> >
>  Since <canvas> uses the <color> production from CSS why does a global
> search and replace through JavaScript files and CSS files not suffice?
>  Alternatively, you could use getComputedStyle() to get the color values
> from your CSS file.
>  --
>  Anne van Kesteren
>  <http://annevankesteren.nl/>
>  <http://www.opera.com/>

Received on Sunday, 6 April 2008 12:15:05 UTC