LESS import link does not add @media or calls grid mixins

I recently discovered a link import option ( http://lesscss.org/features/#import-options ).

So, I started reorganizing my existing fewer files to remove duplicates and take advantage of link options. In one of my smaller files, I mix Bootstrap 3 with my mixins:

@import (reference) "../../../../less/variables.less";
@import (reference) "../../../../less/vendor/bootstrap/variables.less";
@import (reference) "../../../../less/vendor/bootstrap/mixins.less";
@import (reference) "../../../../less/vendor/bootstrap/grid.less";

.horizontal-submit-container {
    .make-sm-column(6);
    .make-sm-column-offset(6);
}

After compiling with the link flag, this is what I get from the horizontal-submit-container mixin:

.horizontal-submit-container {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}

And this css is incomplete - it lacks some @media lines. However, when I remove the reference flag, I get the proper value:

.horizontal-submit-container {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) {
  .horizontal-submit-container {
    float: left;
    width: 50%;
  }
}
@media (min-width: 768px) {
  .horizontal-submit-container {
    margin-left: 50%;
  }
}
+3
source share
1 answer

​​ , ( ):

.horizontal-submit-container {
    .make-sm-column; // copy the mixins themselves into it, then call them...
    .make-sm-column(6);
    .make-sm-column-offset(6);
}

mixin @media , , , . , .

0

All Articles