search

MohammadYounes / rtlcss

Framework for transforming Cascading Style Sheets (CSS) from Left-To-Right (LTR) to Right-To-Left (RTL)
https://rtlcss.com
MIT License
1.68k stars 129 forks source link

rtlcss in media query #222

Closed DevonVille closed 3 years ago

DevonVille commented 3 years ago

seems to ignore when using media queries.

MohammadYounes commented 3 years ago

Can you provide an example ?

DevonVille commented 3 years ago

Just having a simple scss file:

.popup {
  position: fixed;

  @include mq($until: tablet) { left: 15px; }
  @include mq(tablet) { right: 30px; }
}

rtlcss doesn't seem see the left/right rules under the media queries. In the delta created of the changes, the media query part is missing. it happens in all place I have media query applied.

if any other information is needed please let me know what.

MohammadYounes commented 3 years ago

RTLCSS works on CSS output, can you provide a CSS example presenting the issue ?

DevonVille commented 3 years ago

having this css:

.side-nav {
    right: 2vw;
}

@media (min-width:85.375em) {
    .side-nav {
        right: 5vw
    }
}

is giving me this output (using the onlyDiff option):

.side-nav {
    left: 2vw
}

and disregards the media

DevonVille commented 3 years ago

After retrying manually through the CLI, it seems there's a problem with the webpack plugin that's being used and not RTLCSS itself.