less.ruby icon indicating copy to clipboard operation
less.ruby copied to clipboard

Published 20 hours ago • verified publisher icon less

@-webkit-keyframes declaration causes syntax error

Open nerkles opened this issue 15 years ago • 14 comments

Admittedly this is not standard CSS (yet?) but it would be nice to have it not throw a syntax.

Docs at: http://developer.apple.com/documentation/AppleApplications/Reference/SafariCSSRef/Articles/OtherStandardCSS3Features.html#//apple_ref/doc/uid/TP40007601-SW4

example:

@-webkit-keyframes 'tvout' {
0% {
    -webkit-transform: scale(1);
}
10% {
    -webkit-transform: scale(1.2);
}
40% {
    -webkit-transform: scale(0.1);
}
100% {
    -webkit-transform: scale(0.01)
}
}

nerkles avatar Aug 05 '09 17:08 nerkles

In my "brief" experience, any -webkit-* based rule throws a syntax error. I've been having trouble with -webkit-transition in particular.

bryanveloso avatar Sep 12 '09 20:09 bryanveloso

It should pass through anything it doesn't understand when it comes to declarations, but @-webkit-keyframes is a bit over the top. It makes sense to have a rule that passes through anything at any level it doesn't understand, though. +1 :)

augustl avatar Sep 14 '09 14:09 augustl

yea that stuff is just crazy, I'm working on a CSS interpolation rule, which looks like

% { ...anything in here is skipped, and outputted as-is... }

cloudhead avatar Sep 14 '09 18:09 cloudhead

I like the idea that anything which does not need to be processed should pass through unharmed.

AFAIK, CSS Animation is a proposed standard, pretty darn awesome, and a potential accessible replacement for Flash (esp. combined w/SVG), and likely to be approved by W3C eventually.

nerkles avatar Sep 15 '09 19:09 nerkles

The % { } syntax would be great until support for all of the craziness is resolved.

soffes avatar Nov 23 '09 20:11 soffes

Has an interpolation/passthru been implemented in anyone's fork?

alanhogan avatar Feb 28 '10 07:02 alanhogan

Hey I've implemeted it on this branch of my fork http://github.com/rc1/less/tree/escapist It's a bit of a hack but you are welcome to try. The interpolation/passthru is ${ }$ and needs to be used within a selector.

rc1 avatar Mar 22 '10 16:03 rc1

Are there any updates on this? What about support in less.js?

mattmcmanus avatar Oct 28 '10 18:10 mattmcmanus

Could really use a fix of some sort on this. Any news?

joemccann avatar Dec 28 '10 15:12 joemccann

Has the CSS interpolation fix been implemented yet? Any updates?

idris avatar Jul 14 '11 18:07 idris

@idris Unless you’re a big Node.js guy, I think most people have moved to Compass/Sass. It handles this kind of stuff a lot better.

alanhogan avatar Jul 19 '11 18:07 alanhogan

@idris development has moved to https://github.com/cloudhead/less.js that is where the fix has been applied, in the rewrite.

@alanhogan perhaps it should have been named 'less v2'. You do not need node anymore than you need ruby for this. See: http://lesscss.org/

rc1 avatar Jul 19 '11 19:07 rc1

@alanhogan I actually moved from Sass (Scss) to Less. If Github forks/follows is any indicator, cloudhead/less.js is way more popular than nex3/sass

@rc1 you say "the fix has been applied", but the issue still exists in less.js: https://github.com/cloudhead/less.js/issues/166

idris avatar Jul 19 '11 20:07 idris

Not sure it is. I only followed Less because I wanted to know hen showstoppers were fixed. But if it works for people, great!

On Jul 19, 2011, at 1:43 PM, [email protected] wrote:

@alanhogan I actually moved from Sass (Scss) to Less. If Github forks/follows is any indicator, cloudhead/less.js is way more popular than nex3/sass

@rc1 you say "the fix has been applied", but the issue still exists in less.js: https://github.com/cloudhead/less.js/issues/166

Reply to this email directly or view it on GitHub: https://github.com/cloudhead/less/issues/68#issuecomment-1610469

alanhogan avatar Jul 19 '11 21:07 alanhogan