Prevent Sass von einschließlich Eigentum an allen

Question

In meinem aktuellen Projekt verwende ich eine Sass-mixin grob wie folgt aus:

mixin.scss:

@mixin my_mixin($header-border-top-stack, 
       $header-border-bottom-stack) { 
    #some-id { 
    border-top: $header-border-top-stack; 
    border-bottom: $header-border-top-stack; 
    } 
} 

styles.scss:

@import "path/to/mixin.scss"; 
@include my_mixin(1px solid black, 2px solid red); 

Manchmal möchte ich nicht dieberührenEigentum überhaupt. diese Leider:

@import "path/to/mixin.scss"; 
@include my_mixin(1px solid black, none); 

Ergebnisse in .css wie folgt aus:

#some-id { 
    border-top: 1px solid black; 
    border-bottom: none; 
} 

ich nach einer Möglichkeit, die Durchmischung durch Berühren der border-bottom Eigenschaft überhaupt zu verhindern (beinhalten nicht einmal in die .css). Irgendwelche Ideen?

Answer 1

Ich habe einen @if condition für den Scheck

@mixin my_mixin($header-border-top-stack, $header-border-bottom-stack) { 
    #some-id { 
    border-top: $header-border-top-stack; 
    @if $header-border-bottom-stack != 'none' { 
     border-bottom: $header-border-bottom-stack; 
    } 
    } 
} 

Dies funktioniert gut. Aber nur ein Tipp, ich habe festgestellt, dass Sie mixin sind, setzt den Selektor hinein, der nicht flexibel ist, und ich weiß nicht, ob das eine gute Übung ist. Man könnte es so umschreiben

@mixin my_mixin($header-border-top-stack, $header-border-bottom-stack) { 
    border-top: $header-border-top-stack; 
    @if $header-border-bottom-stack != 'none' { 
    border-bottom: $header-border-bottom-stack; 
    } 
} 

Dadurch verhindern Sie mixin sind, können auf verschiedenen tags
div { @include my_mixin(1px solid black, none); }
p { @include my_mixin(1px solid black, 2px solid red); }

stattdessen verwendet werden es immer wiederkehr #some-id { ... }