Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
750 views
in Technique[技术] by (71.8m points)

css - "Compact" function in Bourbon with SASS not called

I have a problem using mixins included in Bourbon. When this mixin uses the "compact" function of Bourbon, it just compile it into the css without using it. Here is a screenshot of the rendred CSS for a box-shadow :

http://i.stack.imgur.com/YF1JB.png

I use it on a non-static site, with the latest Sass version. I use Codekit to compile.

Thanks for help !

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

Ok so after diving a bit deeper here is how I fixed it.

This problem is probably being caused because of this commit: https://github.com/thoughtbot/bourbon/commit/ac07c990c0d0fe16f4c455490c9a9fdff7fe27af

The compact function has been rewritten in Ruby to better integrate with Rails. Initially I just copy pasted the 'stylesheet' folder from the repo. And thats when I started false sytax.

I fixed the error by reading the instructions :) - the instruction on how to install it in Rails and then it worked.

In your case, idk if they have a codekit implementation but I believe you can fix it by adding the following code:

@function compact($var-1,        $var-2: false,
                  $var-3: false, $var-4: false,
                  $var-5: false, $var-6: false,
                  $var-7: false, $var-8: false,
                  $var-9: false, $var-10: false) {
  $full: $var-1;
  $vars: $var-2, $var-3, $var-4, $var-5,
         $var-6, $var-7, $var-8, $var-9, $var-10;

  @each $var in $vars {
    @if $var {
      $full: $full, $var;
    }
  }
  @return $full;
}

(I got the code from the repo)

in a file name _function.scss inside your addons folder and reference it in _bourbon.scss. And that should fix your problem.


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...