subtlegradient / sheet.js Goto Github PK

Hi Thomas,

Has this been used in production? Is it safe to parse user entered CSS like with JSCSSP without erroring? Is it still under active development?

Cheers,

Jamie

Did you make any progress with parsing Less CSS?

http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleSheet-deleteRule
http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSStyleSheet-insertRule

With CSS3 we've got a ton of cool css functions like gradient, and... whatever, I dont know, I'm interested in that one :) It would be extremely convenient to have function name and all arguments parsed in Sheet.js output.

The thing is sometimes it's like gradient(radial, from(#fff), color-stop(rgb(255,100,30)), to(#000)) then it gets tricky.

You can create a new Sheet, but you can't plug it into the document.head..

Why does this project use its own custom parsing system instead of simply using an existing (and widely used/supported?) thing like PEG.js?

Cf. https://github.com/dmajda/pegjs/blob/master/examples/css.pegjs

var myStyleSheet = new Sheet("#selector { color:blue }")
myStyleSheet.cssRules[0].style.color = "green"
myStyleSheet.cssRules[0].style.cssText //'color:blue;'

I can fix it by calling update()

myStyleSheet.update()
myStyleSheet.cssRules[0].style.cssText //'color:green;'

but in the browser it works without update method (which actually doesn't exist for CSSStyleSheet).

I expected to see CSSStyleRule class to implement cssText getter, but I didn't found it. The code looks a bit tricky to extend at first glance. Some pointers would be helpful.

Sheet.js uses sg-regex-tools.js which is not listed as a dependency, but rather required using common js require syntax. Please make use the extension file.

this bit of css yields a selector from /**** up to .ws-app, so it's not recognizing those comments properly. The rest (.ws-app .ws-container) is parsed ok.

    /****************************************************************
    *  Home page styling for all screen sizes.
    ****************************************************************/

    /* defaults */
    .ws-app {}
    .ws-app .ws-container {
           margin: 0 auto;
           position: relative;
    }

From: frank06

I realize that this is nit-picky, but the package.json "doc" entry under directories is meant to point to a subdirectory containing markdown files. Breaking this standard may not mesh well with upcoming npm features.

Have you seen JSCSSP? It's pretty heavy and advanced CSS parser written in JavaScript.

It might make sense to port JSCSSP into CommonJS module instead of writing your own from scratch. Or isn't it?