Передача аргументов из mixin в блок контента

Question

Этот open issue in the Sass queue, по-видимому, подразумевает, что переданные аргументы @content еще не определены, но Susy 2, похоже, в состоянии это сделать. Отслеживание того, как это делается, - это немного кроличьей дыры, хотя я еще не понял ее. Возможно, кто-то может пролить свет с помощью простого примера? Я хочу создать пользовательский mixin, который наследует макет, переданный от susy-breakpoint(), используя пользовательскую карту.

Пример: Определение макета 4 столбца в глобальной карте Сасс, будет возвращать ширину 100%, когда оболочка 4 задается внутри susy-breakpoint() «ы @content. Когда пользовательский макет из 8 столбцов передается непосредственно на susy-breakpoint() через аргумент $layout, вложенный span() mixin поднимает новый макет. Но пользовательский вложенный микстик не подберет новый макет. Зачем?

@import 'susy'; 

$susy: (
    columns: 4, 
); 

@mixin inherit-layout($layout: 4) { 
    columns: $layout; 
} 

@include susy-breakpoint(30em) { 
    // nested code uses an 4-column grid from global map 
    .global-cols { 
    @include span(4); 
    @include inherit-layout(); 
    } 
} 

@include susy-breakpoint(48em, $layout: 8) { 
    // nested code uses an 8-column grid from $layout 
    .inherited-cols { 
    @include span(4); 
    @include inherit-layout(); 
    } 
} 

Составитель CSS:

@media (min-width: 30em) { 
    .global-cols { 
    width: 100%; 
    float: left; 
    margin-left: 0; 
    margin-right: 0; 
    columns: 4; 
    } 
} 

@media (min-width: 48em) { 
    .inherited-cols { 
    width: 48.71795%; 
    float: left; 
    margin-right: 2.5641%; 
    columns: 4; 
    } 
} 

Update:

Я обнаружил, что делает переменную по умолчанию для inherit-value() подмешать значение ключа столбцов на существующем $susy карте позволяет подмешать к захватить контекст. Но почему? И почему он не работает с другой картой или за пределами susy-breakpoint()?

Смотрите здесь: http://sassmeister.com/gist/d86e217aca3aa8337b83

Answer 1

Susy не проходит никаких аргументов в @content - вместо этого, мы изменяем глобальные переменные в начале блока содержимого, а затем изменить его обратно в конце:

$example: 4; 

@mixin local($local) { 
    $old: $example; 
    $example: $local !global; 

    @content 

    $example: $old !global; 
} 

// out here, $example == 4 

@include local(12) { 
    // in here, $example == 12 
}