at-import / breakpoint

Really simple media queries in Sass
MIT License
2.09k stars 142 forks source link

Can't seem to extend a placeholder or class which consists solely of media query content coming from Breakpoint #176

Open philwolstenholme opened 7 years ago

philwolstenholme commented 7 years ago

Hi,

I have the following placeholder and class set up:

.is-hidden-tablet,
%is-hidden-tablet {
  @include breakpoint($lap) {
    display: none;
  }
}

When I try and use @extend %is-hidden-tablet; then I get this error message:

>> ".menu--secondary .menu .menu__item:last-of-type" failed to @extend "%is-hidden-tablet".
>> The selector "%is-hidden-tablet" was not found.

If I change my placeholder and class to the following then everything works okay:

.is-hidden-tablet,
%is-hidden-tablet {
  content: "";
  @include breakpoint($lap) {
    display: none;
  }
}

I don't think this is a bug with Sass or Breakpoint as I can't reproduce the issue in Sassmeister: http://www.sassmeister.com/gist/35cc92c46ec3154fb723581aaed3943e

Does anyone have any idea what might be the cause?

➜  npm list node-sass
└─┬ grunt-sass@1.1.0
  └── node-sass@3.10.1

➜  npm list breakpoint-sass
└── breakpoint-sass@2.6.1
philwolstenholme commented 7 years ago

Additionally, if I write a regular, plain CSS media query inside .is-hidden-tablet / %is-hidden-tablet (instead of making a call to breakpoint() then I do not get any errors.

joeajbrewer commented 7 years ago

I'm having the same issue.