Kronuz / pyScss

pyScss, a Scss compiler for Python
MIT License
582 stars 141 forks source link

Nested media query problems? #316

Open lee-hodg opened 10 years ago

lee-hodg commented 10 years ago

Looks like pyScss doesn't correctly handle the "all and.." of a nested media query?

Here is a min working example:

scss:

$small-device: 768px;

@mixin mobile(){ // Media Query Mobile
    @media all and (max-width: #{$small-device - 1px}) {
        @content;
     }
 }

@mixin media-queries($width){
  @media all and (max-width: #{$width + px}) {
      @content;
   }
 }

.customer-mob {
    @include mobile(){
                @include media-queries(360){
                    padding: 10px 0; 
              }
     }
   }

css out according to http://sassmeister.com/

@media all and (max-width: 767px) and (max-width: 360px) {
    .customer-mob {
         padding: 10px 0;
     }
 }

css out according to pyScss:

@media all and (max-width: 767px) and all and (max-width: 360px) {
     .customer-mob {
             padding: 10px 0;   }
  }
eevee commented 9 years ago

pyscss doesn't actually understand media query syntax at all; it just sort of fakes it with some "and"s. It should probably learn.