ekryski/less2sass

Could not converted the conditional statements

Opened this issue · 5 comments

anujaykumar1 commented

i am trying less2sass for converting my legacy less version to scss, i would like to know what is "when" in less is it the "if" statement ?

i was expecting proper output for
.biggerX (@Index) when (@Index < 310) {
.bigger-@{index} { font-size: unit(@Index,~"%"); }
.biggerX(@Index + 10);
}

but i found

@mixin biggerX($index) when ($index < 310)
{
.bigger-${index} { font-size: unit($index,#{"%"}); }
@include biggerX($index + 10);
}

if when (in less)== if (in scss) then it suppose to make this conversion as well.
Do suggest me how may i proceed.

ekryski commented

@amoebageek Yes when is synonymous with if in SCSS but the syntax is pretty different. Like I said in the README this isn't perfect so you'll need to convert some things over manually. If you want to make an attempt at a PR I'll gladly take it but I don't really have a need for this script anymore so implementing the fix myself is pretty low priority for me.

  • 👍2
ekryski commented

This is actually a duplicate of #6 actually. We'll keep this one open for more context.

gagarine commented

I had the same problem. Just pasting the problematic code for reference:

.make-nested-list(@offset, @i, @n) when (@i < @n) {
  > .dropdown-menu > li {
    &.dropdown-header,
    > a {
      padding-left: @offset + (10 * @i);
    }

    .make-nested-list(@offset, @i + 1, @n);
  }
}
  • 👍1
MonsieurV commented

@gagarine Can you also add the expected output in Scss?

Maybe we can deal with the simpler cases for this one.

gagarine commented

Sure. I believe (not full tested yet, but it compile) it should be:

@mixin make-nested-list($offset, $i, $n) {
  @if ($i < $n) {
    > .dropdown-menu > li {
      &.dropdown-header,
      > a {
        padding-left: $offset + (10 * $i);
      }

      @include make-nested-list($offset, $i + 1, $n);
    }
  }
}
  • 👍2