Использование @mixin для достижения поддержки RTL на Angular - PullRequest
Новая
       85

Использование @mixin для достижения поддержки RTL на Angular

0 голосов
/ 13 июля 2020

Я использую миксин для преобразования моего Angular приложения из LTR в RTL соответственно. 

@mixin rtl($property, $ltr-value, $rtl-value) {
  [dir='ltr'] & {
    #{$property}: $ltr-value;
  }

  [dir='rtl'] & {
    #{$property}: $rtl-value;
  }
}

@mixin rtl-prop($ltr-property, $rtl-property, $value) {
  [dir='ltr'] & {
    #{$ltr-property}: $value;
  }

  [dir='rtl'] & {
    #{$rtl-property}: $value;
  }
}

Когда я использую @include, по какой-то причине он не работает. (Тег html определен правильно) 

@include rtl(border-radius, 0 10px 80px 0, 0 80px 10px 0);

<html lang="he" dir="rtl">

Есть идеи, почему?

1 Ответ

0 голосов
/ 02 августа 2020

Для тех, кто столкнется с этой проблемой в будущем, проблема заключалась в инкапсуляции компонента - он был установлен на Emulated, что, вероятно, мешало именам классов.

Вместо этого установите значение None.

...