Мне нужно, чтобы переменная $susy менялась с rtl на ltr, если в теле существует класс ar. Мне нужно сделать это, чтобы поддерживать многоязычность на моем сайте, ниже приведен код для того же
.page-container {
background-color: red;
@include container($susy);
@include susy-breakpoint($medium) {
background-color: yellow;
@include container($susy-medium);
}
@include susy-breakpoint($large) {
background-color: lightgreen;
@include container($susy-large);
}
&.ar {
//change flow to rtl
}
}
$medium: 768px; //tab
$large: 1024px; //desktop
//susy grid params small
$column-numbers-small: 6;
$column-width-small: 40px;
$column-gutter-small: 16px;
$available-width-small: 336px;
//susy grid params medium
$column-numbers-medium: 12;
$column-width-medium: 42px;
$column-gutter-medium: 20px;
$available-width-medium: 744px;
//susy grid params large
$column-numbers-large: 12;
$column-width-large: 86px;
$column-gutter-large: 24px;
$available-width-large: 1320px;
$susy: (
container: $available-width-small,
container-position: center,
columns: $column-numbers-small,
math: fluid,
output: isolate,
gutter-position: split,
gutters: $column-gutter-small/$column-width-small,
);
$susy-medium: (
container: $available-width-medium,
container-position: center,
columns: $column-numbers-medium,
math: fluid,
output: isolate,
gutter-position: split,
gutters: $column-gutter-medium/$column-width-medium,
);
$susy-large: (
container: $available-width-large,
container-position: center,
columns: $column-numbers-large,
math: fluid,
output: isolate,
gutter-position: split,
gutters: $column-gutter-large/$column-width-large,
);
$susy-large-ar: (
flow: rtl,
container: $available-width-large,
container-position: center,
columns: $column-numbers-large,
math: fluid,
output: isolate,
gutter-position: split,
gutters: $column-gutter-large/$column-width-large,
);
Может кто-нибудь предложить, как динамически переопределить это направление потока.
direction: rtl
см. w3schools.com/cssref/pr_text_direction.asp. - person Rene van der Lende   schedule 14.07.2017