less 循环生成 padding 和 margin

// start
@padding-direction: t, b, l, r, x, y;
@min-padding-value: 1;
@max-padding-value: 80;

.padding-direction-loop(@data,  @value, @i: 1) when(@i =< length(@data)) {
    @direction: extract(@data, @i);

    .p-@{direction}-@{value} when (@direction = l) {
        padding-left: @value * 1px;
    }

    .p-@{direction}-@{value} when (@direction = r) {
        padding-right: @value * 1px;
    }

    .p-@{direction}-@{value} when (@direction = t) {
        padding-top: @value * 1px;
    }

    .p-@{direction}-@{value} when (@direction = b) {
        padding-bottom: @value * 1px;
    }

    .p-@{direction}-@{value} when (@direction = x) {
        padding: 0 @value * 1px;
    }

    .p-@{direction}-@{value} when (@direction = y) {
        padding: @value * 1px 0;
    }

    .padding-direction-loop(@data, @value, (@i + 1));
}

.padding-loop(@n, @i: @min-padding-value) when(@i =< @n ) {
    .p-a-@{i} {
        padding: 1px * @i;
    }

    .padding-direction-loop(@padding-direction, @i);
    .padding-loop(@n, (@i + 1));
}

.padding-loop(@max-padding-value);
// end


// start 
@margin-direction: t, b, l, r, x, y;
@min-margin-value: 1;
@max-margin-value: 80;

.margin-direction-loop(@data,  @value, @i: 1) when(@i =< length(@data)) {
    @direction: extract(@data, @i);

    .m-@{direction}-@{value} when (@direction = l) {
        margin-left: @value * 1px;
    }

    .m-@{direction}-@{value} when (@direction = r) {
        margin-right: @value * 1px;
    }

    .m-@{direction}-@{value} when (@direction = t) {
        margin-top: @value * 1px;
    }

    .m-@{direction}-@{value} when (@direction = b) {
        margin-bottom: @value * 1px;
    }

    .m-@{direction}-@{value} when (@direction = x) {
        margin: 0 @value * 1px;
    }

    .m-@{direction}-@{value} when (@direction = y) {
        margin: @value * 1px 0;
    }

    .margin-direction-loop(@data, @value, (@i + 1));
}

.margin-loop(@n, @i: @min-margin-value) when(@i =< @n ) {
    .m-a-@{i} {
        margin: 1px * @i;
    }

    .margin-direction-loop(@margin-direction, @i);
    .margin-loop(@n, (@i + 1));
}

.margin-loop(@max-margin-value);