scsslint box-shadow sass mixin Farbliterale wie rgba validation

Question

Ich benutze scsslint, um meine scss zu validieren, bekomme ich diesen Fehler unten, was ist der beste Weg, um das zu beheben?

[W] ColorVariable: Farbe Literale wie rgba(0, 0, 0, 0.75) sollte nur in Variablendeklarationen verwendet werden; sie sollten überall anders über Variable bezeichnet werden.

@mixin box-shadow-new($value) { 
     -webkit-box-shadow: $value; 
     -moz-box-shadow: $value; 
     box-shadow: $value; 
    } 



.btn-exit { 
     @include box-shadow-new(4px 3px 26px -6px rgba(0, 0, 0, .75)); 
     background-color: $button-bg-main; 
     border-color: $button-bg-main; 
     color: $button-color-main; 
    } 

Answer 1

das bei Ihnen zu sagen, dass die Farbe als eine Variable eingestellt werden soll, anstatt direkt im Stil geschrieben. Also in Ihrer variables.scss Datei, oder wo auch immer Sie Variablen gruppieren (? Sie sind direkt here's one way), so etwas wie:

$box-shadow-color: rgba(0, 0, 0, .75) 

würde ich noch weiter gehen und empfehlen, dass der volle box-shadow Stil eine Variable sein, so Sie können diesen Stil überall platzieren und konsistent sein:

$box-shadow: 4px 3px 26px -6px rgba(0, 0, 0, .75); 

Beachten Sie, dass Sie möglicherweise warnen, die Farbe selbst in eine Variable noch zu setzen. Es wird manchmal sehr "verschachtelte Puppen", aber Sie könnten theoretisch das semitransparente Schwarz wiederverwenden.

@include box-shadow-new($box-shadow); 

:

Die mixin würde dann wie genannt werden