linear-gradient produces errors

[panosru]

Hello I use this css code linear-gradient(center top, #F5F5F5 0%, #EEEEEE 100%) but I get the following error when I try to parse it with nib:

/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/nib/lib/nib/gradients.styl:120
   116|       add-property(prop, replace(val, '__CALL__', img))
   117|     start = start[1]
   118| 
   119|   // legacy webkit
 > 120|   end = grad-point(opposite-position(start))
   121|   webkit-legacy = '-webkit-gradient(linear, %s, %s, %s)' % (grad-point(start) end join-stops(stops, webkit-stop))
   122|   add-property(prop, replace(val, '__CALL__', webkit-legacy))
   123| 

invalid position center
    at ".subnav " (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/front-end/assets/css/style.styl:61)

Error: /home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/nib/lib/nib/gradients.styl:120
   116|       add-property(prop, replace(val, '__CALL__', img))
   117|     start = start[1]
   118| 
   119|   // legacy webkit
 > 120|   end = grad-point(opposite-position(start))
   121|   webkit-legacy = '-webkit-gradient(linear, %s, %s, %s)' % (grad-point(start) end join-stops(stops, webkit-stop))
   122|   add-property(prop, replace(val, '__CALL__', webkit-legacy))
   123| 

invalid position center
    at ".subnav " (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/front-end/assets/css/style.styl:61)

    at /home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/functions/index.js:581:22
    at /home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/functions/index.js:582:7
    at Array.forEach (native)
    at Evaluator.oppositePosition (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/functions/index.js:574:33)
    at Evaluator.invokeBuiltin (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/evaluator.js:775:28)
    at Evaluator.visitCall (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/evaluator.js:329:16)
    at Evaluator.<anonymous> (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/index.js:28:39)
    at Evaluator.visit (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/evaluator.js:74:18)
    at Evaluator.<anonymous> (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/evaluator.js:451:26)
    at Evaluator.<anonymous> (/home/rnd/domains/design.rnd/public_html/app-ui/apps/main/node_modules/stylus/lib/visitor/index.js:28:39)

[tj]

ah that's busted in stylus (opposite-position) probably doesn't map center to itself

[tj]

mind opening this issue there? I'll get it fixed tomorrow first tthing

[panosru]

@visionmedia I though I was burned up but I have to admit you are a really burned up dude! :P Thanks for nib, uikit, express, redis, jade etc :P

Are you sure it is because of stylus? When I remove nib everything compiles fine...

[panosru]

Without nib, this: background-image linear-gradient(center top , #F5F5F5 0%, #EEEEEE 100%) compiles into this: background-image:linear-gradient(center top,#f5f5f5 0%,#eee 100%); so I believe it's not stylus issue :/

[tj]

nib is using a BIF from stylus called opposite-position(), I think that was only necessary for the old webkit syntax, maybe we can change that now

[tj]

https://github.com/LearnBoost/stylus/commit/b3275ebfc1dfa5273c6e519182839786f00fa824

but yeah i think we could change that to the -webkit-linear-gradient( syntax and remove its use in here

[panosru]

@visionmedia so now if I update stylus and nib I normally should not get an error?

[tj]

@panosru yeah it should be ok with that fix, I haven't released yet though. but like I said that legacy webkit syntax might be fine to remove now

[panosru]

@visionmedia I applied the patch manually and it worked fine with nib, thanks :)