Can rtlcss ignore specific css properties?

Question

Can you configure rtlcss to ignore specific css properties across all files?

I know you can use the control directives to ignore individual code blocks, but I can't find in the documentation how you can exclude css properties across the entire file/directory. Preferrably using CLI.

For example, I want to exclude background-position from being changed. How can I do that?

Edit: I just found out I need to write a plugin to do this. I will try it out. https://rtlcss.com/learn/extending-rtlcss/declaration-processor/

Answer 1

I strongly suggest not to use rtlcss, as I have got tired of this package and it's complications. instead, if you are working with sass, you can create and use your own direction mixins, it will be much more dynamic and easy to use. for example =>>>>

$selectorLtr: ".app-ltr";
$selectorRtl: ".app-rtl";

@mixin dir-direction($value, $importance: null) {
    @if $value==ltr {
        #{$selectorLtr} & {
            direction: ltr $importance;
        }

        #{$selectorRtl} & {
            direction: rtl $importance;
        }
    } @else if $value==rtl {
        #{$selectorLtr} & {
            direction: rtl $importance;
        }

        #{$selectorRtl} & {
            direction: ltr $importance;
        }
    } @else {
        direction: inherit $importance;
    }
}

// then use it in a single line like this
.element {
    @include dir-direction(ltr);
}

// then it will be generated like this
.app-ltr Ï .element {
  direction: ltr;
}
.app-rtl Ï .element {
  direction: rtl;
}

then you can work your way through every property

For more examples, please find dir-mixins file in this demo