2012-07-25 16 views
6

Ich habe ein Problem mit Mixins in Bourbon enthalten. Wenn dieses Mixin die "kompakte" Funktion von Bourbon verwendet, kompiliert es es einfach in das CSS, ohne es zu benutzen. Hier ist ein Screenshot des rendred CSS für einen box-shadow:"Compact" -Funktion in Bourbon mit SASS nicht

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

ich es auf einer nicht-statische Website verwenden, mit der neuesten Version Sass. Ich verwende Codekit zum kompilieren.

Vielen Dank für Ihre Hilfe!

+0

Ähnliche http://stackoverflow.com/questions/41957672/compass-box-shadow-mixin-returns-invalid-property-value – Green

Antwort

14

Ok, nach dem Tauchen ein bisschen tiefer hier ist, wie ich es behoben habe.

Dieses Problem wird wahrscheinlich dieses begehen wegen wird verursacht: https://github.com/thoughtbot/bourbon/commit/ac07c990c0d0fe16f4c455490c9a9fdff7fe27af

Die kompakte Funktion in Ruby geschrieben wurde mit Rails, um besser zu integrieren. Zunächst kopiere ich einfach den 'Stylesheet' Ordner aus dem Repo. Und das ist, als ich falsche Sytax begann.

Ich habe den Fehler behoben, indem ich die Anweisungen gelesen habe :) - die Anweisungen, wie man es in Rails installiert und dann hat es funktioniert.

In Ihrem Fall IDK, wenn sie eine codekit Implementierung haben, aber ich glaube, dass Sie es, indem Sie den folgenden Code beheben:

@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; 
} 

(ich den Code aus dem Repo bekam)

in einem Dateinamen _function.scss in Ihrem Addons-Ordner und verweisen Sie es in _bourbon.scss. Und das sollte dein Problem beheben.

+0

Ich hatte ein ähnliches Problem beim Ausführen von Assets: Precompile. Ich habe deine Lösung benutzt, aber ich musste $ var-11 zu den obigen Listen hinzufügen. Danke für die passende Lösung. – ghayes

+0

Bei Verwendung der SASS-Syntax: https://gist.github.com/mahemoff/5251266 – mahemoff