LESS css loop example

loop.less

.loop (0) {}
.loop (@index) when (@index > 0) {
  .classname-@{index} {
    top: @index * 1px;
  }
  .loop (@index - 1);
}
 
#example {
  .loop(5);
}

output.css

#example .classname-5 {
  top: 5px;
}
#example .classname-4 {
  top: 4px;
}
#example .classname-3 {
  top: 3px;
}
#example .classname-2 {
  top: 2px;
}
#example .classname-1 {
  top: 1px;
}

            @max-grid-items : 20;
            .grid-row-loop (0) {}
            .grid-row-loop (@index) when (@index > 0) {
              @nextIndex : (@index * 2);
              @prevIndex : (@nextIndex - 1);
              &:nth-child(@{prevIndex}) {
                grid-row: @index;
              }
              &:nth-child(@{nextIndex}) {
                grid-row: @index;
              }
              .grid-row-loop (@index - 1);
            }
            .grid-row-loop (@max-grid-items);