New CSS3 attribute 'animation'

Apr 7, 2012 at 7:27 AM

I installed twitterbootstrap today. I renamed main file bootstrap.less to bootstrap.chirp.less and managed to compile it with latest (2.0.0.4) version. Although I still had an error in progress-bars.less file:

Error    2    Parse Error on line 9 in file 'progress-bars.less':
  [8]: // Webkit
  [9]: @-webkit-keyframes progress-bar-stripes {
       ----------------------------------------^
 [10]:   from  { background-position: 0 0; }    bootstrap\bootstrap.chirp.less    9    41

 

I started to investigate an found that guys from bootstrap team are using new CSS3 animation attribute with its @keyframes syntax which does not supported by chirp:

// Webkit
@-webkit-keyframes progress-bar-stripes {
  from  { background-position: 0 0; }
  to    { background-position: 40px 0; }
}

// Firefox
@-moz-keyframes progress-bar-stripes {
  from  { background-position: 0 0; }
  to    { background-position: 40px 0; }
}

// Spec
@keyframes progress-bar-stripes {
  from  { background-position: 0 0; }
  to    { background-position: 40px 0; }
}

For now, I've just commented this block (I am not going to use progress bars anyway) but I think it needs to be fixed.

Developer
Apr 15, 2012 at 12:35 AM

Chirpy use dotless for convert less to css.

Probably dotless not support this feature.

https://github.com/dotless/dotless/issues/110

https://github.com/dotless/dotless/issues/163

Apr 16, 2012 at 5:47 AM

Yes, you are probably right. But I tried latest dotless version and it works fine with @keyframe. Moreover, twitterbootstrap team suggests to use dotless. I installed it using nuget and it was fine.

Apr 17, 2012 at 4:34 PM

What version of dotless is chirpy using? Maybe it's because they are using an older one? If so, this seems like a chirpy or dotless issue, not Orchard or the Orchard bootstrap theme. 

Developer
Apr 20, 2012 at 11:03 PM

Chripy use NuGet package for Dotless.

In last source code Chipry use version : 1.3.0.0.

May 24, 2012 at 10:54 AM

I used twitter bootstrap with chirpy without any problems at all, though I grabbed all the sources of bootstrap (not the precompiled version).