Sass Ruby transition filter effect error message

Question

The following css transition effects are not compiling in Sass and, I am receiving the following error message.

Line 10 of _brightness.scss: $color: 100% is not a color for `red'

This was working on my site, but I think update of Sass has broken my effects and made it return the error above. The following is my transition with a hover effect, which does not work.

.viewimage img {
  -webkit-filter: brightness(100%);
  -moz-transition: all 0.2s ease-in-out;
  -webkit-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;   
  transition: all 0.2s ease-in-out;
}
.viewimage:hover img {
  -webkit-filter: brightness(80%);
}

Does anyone know why this error is occurring and what an appropriate fix for it would be?

This will maybe be helpfull: github.com/chriseppstein/compass/issues/1418 — Nico O
– Nico O, Commented Feb 25, 2014 at 13:32
thanks Nico O, gave me the right direction for fixing the issue — Key
– Key, Commented Feb 25, 2014 at 14:56

Key · Accepted Answer · 2014-02-25 14:55:59Z

3

Credit to 'Nico O' for suggesting the link, have found the fix using the following code.

.viewimage img {
  @include filter(#{"brightness(1)"});
  @include transition(all 0.2s ease-in-out);
}

.viewimage:hover img {
  @include filter(#{"brightness(0.8)"})
}

answered Feb 25, 2014 at 14:55

Key

3964 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Sass Ruby transition filter effect error message

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related