4

I am using

@include keyframes(small) {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.small {
  @include animation(small 1s infinite);
}

And rails gives me the following error:

Sass::SyntaxError at /
Undefined mixin 'keyframes'. (or 'animation')

I am using latest SASS and compass --pre (alpha) which is supposed to support animations.

ilyo
  • 35,851
  • 46
  • 106
  • 159
  • BTW, the `--pre` flag is no longer necessary since Compass 1.x is considered stable. The alpha version you're using might actually be older than the stable version. – cimmanon Nov 18 '14 at 15:49
  • Are you actually importing the necessary files from Compass to get the animation mixins? – cimmanon Nov 18 '14 at 15:54
  • @cimmanon `@import 'compass/css3';` – ilyo Nov 18 '14 at 15:55
  • When I do `compass -v` I get `0.12`. But I also have `1.0.1` installed and in the gemfile I have `gem "compass-rails", "~> 1.1.3"` ??? – ilyo Nov 18 '14 at 16:08
  • [Compass-rails requires Compass 0.12](https://rubygems.org/gems/compass-rails/versions/1.1.3) – cimmanon Nov 18 '14 at 16:10
  • I tried to switch to `compass-rails 2.0.1`, installed the jem and got `Could not find gem 'compass-rails", "~> 2.0.1 (>= 0) ruby' in the gems available on this machine.` – ilyo Nov 18 '14 at 16:13

2 Answers2

0

Try using the following combination of gems in your GemFile:

gem "sass", "~> 3.2.19"
gem 'sass-rails', '~> 4.0.4'
gem "compass", "~> 0.12.7"
gem 'compass-rails', '~> 2.0.0'

And then make sure you have the following lines at the top of your scss file:

@import "compass";
@import "compass/css3";
user3170356
  • 66
  • 4
  • This won't help because Compass 0.12 is the entire problem. The OP needs Compass 1.x (which depends on Sass 3.3). – cimmanon Nov 19 '14 at 16:48
  • My bad. I was sure I had used Compass mixins for animations in one of my projects, but I just checked again and saw that it was plain CSS. – user3170356 Nov 19 '14 at 18:10
0

The following gemfile updates should do it...

# compass 1.0 needed to use keyframe mixin
# but compass 1.0 needs Sass 3.3 (further below)
gem "compass", "~> 1.0" 
gem 'compass-rails'

# use sass-rails ~>5.0 to get Sass ~>3.3 
# needed for compass ~>1.0 
# which is needed for keyframes mixin
gem 'sass-rails', "~>5.0"
Oladele
  • 1
  • 2