search

vkalinichev / postcss-rtl

PostCSS plugin for RTL-adaptivity
MIT License
173 stars 33 forks source link

incorrect property value generated with !important keyword. #13

Closed ntf closed 7 years ago

ntf commented 7 years ago

I found that properties with !important is generating [dir=rtl] rule with !important !important which is not expected.

Affected version : 0.5.9

test script: 

const rtl = require('postcss-rtl');
const postcss = require('postcss');

const css = '.test{margin-left:0 !important;padding-left:0 !important}';
const rtlcss = require('rtlcss');
console.log('rtlcss', rtlcss.process(css));
const processor = postcss([rtl()]);
processor.process(css)
    .then((result) => console.log('postcss-rtl', result.css));

Input 

.test{margin-left:0 !important;padding-left:0 !important}

Output of rtlcss ( expected output ):

.test{margin-right:0 !important;padding-right:0 !important}

Output of postcss + postcss-rtl:

[dir=ltr] .test {
    margin-left:0 !important;
    padding-left:0 !important
}
[dir=rtl] .test {
    margin-right:0 !important !important;
    padding-right:0 !important !important
}
kanzelm3 commented 7 years ago

I am having this issue as well.

vkalinichev commented 7 years ago

Fixed by @ntf (#14) and published as v0.5.10!