"Unable to determine the opposite position:" Error in the compass "0.12.7

Running Compass 0.12.7 (Alnilam) I repeat this error several times:

Running "compass:dev" (compass) task Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to Cannot determine the opposite position of: to unchanged public/styles/sass/ie_only.scss unchanged public/img/icons-s6ab39d30ab.png overwrite public/styles/css/screen.css (2.484s) 

Something is wrong with my gradients, which I accept, but what is wrong here, and how can I alleviate the problem?

+5
source share
2 answers

I had the same problem in my project using compass 0.12.7, and an unexpected problem can only be solved by updating the compass. A warning about the problem is triggered when using linear-gradient mixing with a position value of to right , as in the following example:

 div { @include background(linear-gradient(to right, red, blue)); } 

This will compile for something like this (throwing an error in your question):

 div { background: -webkit-gradient(linear, to right, to left, color-stop(0%, #ff0000), color-stop(100%, #0000ff)); background: -webkit-linear-gradient(to right, #ff0000, #0000ff); background: -moz-linear-gradient(to right, #ff0000, #0000ff); background: -o-linear-gradient(to right, #ff0000, #0000ff); background: linear-gradient(to right, #ff0000, #0000ff); } 

Otherwise, this is invalid CSS code. The correct conclusion should be as follows:

 div { background: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #ff0000), color-stop(100%, #0000ff)); background: -moz-linear-gradient(left, #ff0000, #0000ff); background: -webkit-linear-gradient(left, #ff0000, #0000ff); background: linear-gradient(to right, #ff0000, #0000ff); } 

The only way to fix this is to update the compass, as I said.

+2
source

If you cannot / do not want to update your sass, you can remove this "to" property.

The default gradient gradient is vertical:

 @include background(linear-gradient(red, blue)); 

To get the horizontal position:

 @include background(linear-gradient(90deg, red, blue)); 
0
source

Source: https://habr.com/ru/post/1207352/


All Articles