/ / Поддържа ли SASS добавянето! Важно за всички свойства в mixin? - Sass, компас-Sass

Поддържа ли SASS добавяне! Важно за всички свойства в миксин? - Шас, компас-сас

Понастоящем използвам рамка на компаса и всичко това е полезно CSS3 mixins. Бих искал да използвам border-radius(5px) mixin и всички свойства, които идват от него, са маркирани с !important

в ПО-МАЛКО възможно е да се приложи !important към всички имоти в mixin, като просто я посочите след обаждане

.myMixin(@x) {
border-radius: @x;
-moz-border-radius: @x;
}

.myClass {
.myMixin(5px) !important;
}

се компилира до

.myClass {
border-radius: 5px !important;
-moz-border-radius: 5px !important;
}

Възможно ли е това да е в SASS, или ще трябва да пренапиша миксините с важен параметър?

@mixin my-border-radius($value, $important: false) {
border-radius: @value if($important, !important, null);
....
}

Отговори:

26 за отговор № 1

Отговорът е твърде очевиден ...

!important може просто да бъде посочен като част от стойността на имота

border-radius(5px !important);

4 за отговор № 2

Отговорът на Cander работи за прости променливи, които не са последвани от никакви други атрибути.


Преход в @mixin ($ duration, $ content:нула) { -webkit-transition: всички $ линейни $ съдържание; -moz-transition: всички $ линейни $ съдържание; -о-преход: всички $ линейни $ съдържание; преход: всички $ линейни $ съдържания; }

Аз добавих $content променлива и я настройте като null, Сега можете да се обадите на миксина с:

@include transition(0.3s);

и ако искате да добавите !important, употреба

@include transition(0.3s, !important);

Благодаря!


1 за отговор № 3

Mixin:

@mixin verlauf($color1, $color2) {
background: $color1;
background: -moz-linear-gradient(top, $color1 0%, $color2 100%);
background: -webkit-linear-gradient(top, $color1 0%,$color2 100%);
background: linear-gradient(to bottom, $color1 0%,$color2 100%);
}

SCSS:

 @include verlauf(#607a8b !important, #4b6272 !important);

Резултат:

background: #607a8b !important;
background: -moz-linear-gradient(top, #607a8b !important 0%, #4b6272 !important 100%);
background: -webkit-linear-gradient(top, #607a8b !important 0%, #4b6272 !important 100%);
background: linear-gradient(to bottom, #607a8b !important 0%, #4b6272 !important 100%); }

Той работи и с два (и повече) променливи миксина!