Sass version is behind

[bensampaio]

I have the following HTML:

<div class="grid">
  <div class="col-12">
    <div class="box"></div>
  </div>
  <div class="col-3_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-9_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-3_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-9_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-3_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-9_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-6_xs-12 grid">
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
  </div>
  <div class="col-6_xs-12 grid">
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
  </div>
  <div class="col-6_xs-12 grid">
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
  </div>
  <div class="col-6_xs-12 grid">
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
    <div class="col-6_sm-12">
      <div class="box"></div>
    </div>
  </div>
  <div class="col-3_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-9_sm-12">
    <div class="box"></div>
  </div>
  <div class="col-12">
    <div class="box"></div>
  </div>
</div>

When I load your css via cdnjs I get the result I want:

When I include your SASS files into my SASS files I get the following result:

Working example: https://jsfiddle.net/dg4k84zj/.

Would it be possible to fix that? I would prefer to import the sass files instead of using the generated CSS, since I want to be able to access your SASS variables... Thank you!

[devlint]

Hi!
Indeed there was a little mistake in sass version. Sorry.
Version 2.1.1 is up-to-date.
Can you try and close the issue?
Thx you

[bensampaio]

It looks better but there is still a little problem with columns that also work as grids. Example html:

<div id="container" class="grid">
  <div id="parent1" class="col-6 grid">
    <div class="col-3"></div>
    <div class="col-9"></div>
  </div>
  <div id="parent2" class="col-6 grid">
    <div class="col-6"></div>
    <div class="col-6"></div>
  </div>
</div>

With the example above:

• If I use the already generated CSS #parent1 and #parent2 have no padding but the inner columns do (which is what I would expect);
• If I use the SASS version, then #parent1, #parent2 and their child columns have padding.

[devlint]

Hello, for me v2.2.0 compilation from Sass source works well.
Here your fiddle with gridlex.css compiled from sass included:
https://jsfiddle.net/devlint/zro50zmx/1/
Can you try again? Thx

[bensampaio]

The issue is fixed indeed. I just realised the problem I mentioned on my last reply was being caused by CSS Modules. So basically, if someone comes across this same problem, you shouldn't import CSS meant to be global inside of a CSS Module.